Added rotation filter

This commit is contained in:
Devine Lu Linvega 2016-12-29 14:18:55 -07:00
parent ded226c16f
commit 782032e6b2
8 changed files with 92 additions and 45 deletions

View File

@ -30,12 +30,14 @@
<script type="text/javascript" src="scripts/modules/render.js"></script>
<script type="text/javascript" src="scripts/filters/filter.js"></script>
<script type="text/javascript" src="scripts/filters/stencil.js"></script>
<script type="text/javascript" src="scripts/filters/rotate.js"></script>
<!-- Need to migrate -->
<script type="text/javascript" src="scripts/filters/saturation.js"></script>
<script type="text/javascript" src="scripts/filters/chromatic.js"></script>
<script type="text/javascript" src="scripts/filters/offset.js"></script>
<script type="text/javascript" src="scripts/filters/eval.js"></script>
<script type="text/javascript" src="scripts/filters/balance.js"></script>
<script type="text/javascript" src="scripts/filters/stencil.js"></script>
<script type="text/javascript" src="scripts/core/keyboard.js"></script>
<script type="text/javascript" src="scripts/core/cursor.js"></script>

View File

@ -22,39 +22,7 @@ function Hint(element)
this.message = function(module,cmd)
{
var s = this.pad(cmd.content.join(" "));
s += cmd.content.join(" ").length == 0 ? "<span class='module'>"+module.constructor.name+"</span>" : "";
// Params
var e = 0;
while(e < 10){
if(!module.parameters[e]){ break; }
var param_name = module.parameters[e].name;
s += cmd[param_name.toLowerCase()]() ? "" : "<span class='param'>"+param_name+"</span>";
e += 1;
}
// Variables
if(module.variables){
for (var key in module.variables){
if(cmd.variable(key)){continue;}
s += "<span class='variable_key'>"+key+"</span>=<span class='variable_value'>"+module.variables[key]+"</span> ";
}
}
return s;
}
this.pad = function(input)
{
var s = "";
for (i = 0; i < input.length+2; i++){
s += "_";
}
return "<span style='color:#000'>"+s+"</span>";
return module.hint(cmd);
}
this.default = function()

View File

@ -34,4 +34,10 @@ commander.query("~ "+ronin.timestamp());
commander.query("# "+starting_canvas.render());
commander.query("# layer=render");
commander.query("# layer=main");
commander.query("> 1 0,0 #000000");
commander.query("> 1 0,0 #000000");
// commander.query("# #999");
// commander.query("> #0000ff");
// commander.query("_ 0,100 360,100");
// commander.query("> #ff00ff");
// commander.query("_ 180,0 180,200");
// commander.query("%rotate");

42
scripts/filters/rotate.js Normal file
View File

@ -0,0 +1,42 @@
function Filter_Rotate()
{
Filter.call(this);
this.parameters = [Angle,Position];
this.render = function(cmd)
{
var position = cmd.position() ? cmd.position() : new Position(ronin.surface.size.width/2,ronin.surface.size.height/2);
var angle = cmd.angle() ? cmd.angle().degrees : 90;
ronin.overlay.clear();
this.draw(this.context(),angle,position);
ronin.overlay.clear();
}
this.preview = function(cmd)
{
if(cmd.position()){
ronin.overlay.clear();
ronin.overlay.draw_pointer(cmd.position());
}
}
this.draw = function(context = this.context(), angle, position)
{
var w = ronin.surface.size.width;
var h = ronin.surface.size.height;
ronin.overlay.context().drawImage(context.canvas,0,0,w,h);
ronin.surface.active_layer.clear();
context.save();
context.translate(position.x,position.y);
context.rotate(angle*Math.PI/180);
context.drawImage(ronin.overlay.context().canvas, -position.x, -position.y,w,h)
context.rotate(-angle*Math.PI/180);
context.restore();
}
}

View File

@ -1,6 +1,7 @@
function Filter_Stencil()
{
Filter.call(this);
this.parameters = [Angle];
this.render = function(cmd)
{

View File

@ -27,7 +27,39 @@ function Module(rune)
this.hint = function(cmd)
{
return "unknown";
var s = this.pad(cmd.content.join(" "));
s += cmd.content.join(" ").length == 0 ? "<span class='module'>"+this.constructor.name+"</span>" : "";
// Params
var e = 0;
while(e < 10){
if(!this.parameters[e]){ break; }
var param_name = this.parameters[e].name;
s += cmd[param_name.toLowerCase()]() ? "" : "<span class='param'>"+param_name+"</span>";
e += 1;
}
// Variables
if(this.variables){
for (var key in this.variables){
if(cmd.variable(key)){continue;}
s += "<span class='variable_key'>"+key+"</span>=<span class='variable_value'>"+this.variables[key]+"</span> ";
}
}
return s;
}
this.pad = function(input)
{
var s = "";
for (i = 0; i < input.length+2; i++){
s += "_";
}
return "<span style='color:#000'>"+s+"</span>";
}
this.widget = function()

View File

@ -6,14 +6,13 @@ function Render(rune)
this.collection = {};
this.collection["stencil"] = new Filter_Stencil();
this.collection["rotate"] = new Filter_Rotate();
this.active = function(cmd)
{
var name = cmd.content[0];
if(!this.collection[name]){ console.log("Unknown filter:"+name); return; }
cmd.content.shift();
if(!this.collection[name]){ return; }
return this.collection[name].render(cmd);
}
@ -21,11 +20,8 @@ function Render(rune)
this.passive = function(cmd)
{
var name = cmd.content[0];
if(!this.collection[name]){ console.log("Unknown filter:"+name); return; }
if(!this.collection[name]){ return; }
cmd.content.shift();
console.log(name);
return this.collection[name].preview(cmd);
}

View File

@ -52,8 +52,8 @@ function Stroke(rune)
ronin.surface.context().moveTo(pos1.x,pos1.y);
ronin.surface.context().lineTo(pos2.x,pos2.y);
ronin.surface.context().lineCap="round";
ronin.surface.context().lineWidth = 1;
ronin.surface.context().strokeStyle = new Color("#ff0000").rgba();
ronin.surface.context().lineWidth = 10;
ronin.surface.context().strokeStyle = ronin.brush.color.rgba();
ronin.surface.context().stroke();
ronin.surface.context().closePath();
}