From 52c39c832cb30e6cf1954cc985d4d396adeee6b9 Mon Sep 17 00:00:00 2001 From: Devine Lu Linvega Date: Mon, 10 Apr 2017 10:29:02 -1000 Subject: [PATCH] Added rotate to layer --- index.html | 1 - presets/grid.icon.dictionarism.rin | 23 ++++++++++++++++ presets/template.rabbits.rin | 2 -- scripts/filters/rotate.js | 42 ------------------------------ scripts/modules/layer.js | 37 +++++++++++++++++++++++++- scripts/modules/render.js | 1 - 6 files changed, 59 insertions(+), 47 deletions(-) create mode 100644 presets/grid.icon.dictionarism.rin delete mode 100644 scripts/filters/rotate.js diff --git a/index.html b/index.html index ad9e027..fc4735b 100644 --- a/index.html +++ b/index.html @@ -31,7 +31,6 @@ - diff --git a/presets/grid.icon.dictionarism.rin b/presets/grid.icon.dictionarism.rin new file mode 100644 index 0000000..347fc67 --- /dev/null +++ b/presets/grid.icon.dictionarism.rin @@ -0,0 +1,23 @@ +frame.resize 420x420 ; +brush:color #ff0000 ; +magnet.grid 15x15 4,4 ; +frame.select main ; +path:line_width 30 ; +path:line_color #ffffff ; +path.stroke M240,180 l0,-90 a30,-30 0 0,1 30,-30 a30,30 0 0,1 30,30 a-30,30 0 0,1 -30,30 l-180,0 a-30,-30 0 0,1 -30,-30 a30,-30 0 0,1 30,-30 a30,30 0 0,1 30,30 l0,180 a-30,30 0 0,1 -30,30 a-30,-30 0 0,1 -30,-30 a30,-30 0 0,1 30,-30 l180,0 a30,30 0 0,1 30,30 a-30,30 0 0,1 -30,30 a-30,-30 0 0,1 -30,-30 l0,-90 ; +path:line_width 1 ; +path:line_color #000000 ; +path.stroke M240,180 l0,-90 a30,-30 0 0,1 30,-30 a30,30 0 0,1 30,30 a-30,30 0 0,1 -30,30 l-180,0 a-30,-30 0 0,1 -30,-30 a30,-30 0 0,1 30,-30 a30,30 0 0,1 30,30 l0,180 a-30,30 0 0,1 -30,30 a-30,-30 0 0,1 -30,-30 a30,-30 0 0,1 30,-30 l180,0 a30,30 0 0,1 30,30 a-30,30 0 0,1 -30,30 a-30,-30 0 0,1 -30,-30 l0,-90 ; +path:line_color #ffffff ; +path:line_width 4 ; +path:line_cap butt ; +path.stroke M105,120 l30,0 M240,105 l0,30 M225,240 l30,0 M120,225 l0,30 ; +path:line_width 1 ; +path:line_color #000000 ; +path.stroke M120,105 l0,30 M225,120 l30,0 M240,225 l0,30 M135,240 l-30,0 ; +path:line_width 10 ; +path:line_color #cccccc ; +path.stroke M100,105 l0,30 M140,105 l0,30 M260,225 l0,30 M220,225 l0,30 M225,100 l30,0 M225,140 l30,0 M105,220 l30,0 M105,260 l30,0; +magnet.grid 1x1 ; +layer.rotate 180,180 45' ; +layer.translate 30,30 ; \ No newline at end of file diff --git a/presets/template.rabbits.rin b/presets/template.rabbits.rin index 993036a..02f2a69 100644 --- a/presets/template.rabbits.rin +++ b/presets/template.rabbits.rin @@ -2,7 +2,5 @@ terminal.display hide ; frame.resize 1060x600 ; source.load /08.jpg x600 ; render.sharpen 0.25 ; -render.saturate #ffffff; -render.contrast 0.25 ; source.load /hundred.rabbits.logo.white.svg 70x70 0,530 ; source.save \ No newline at end of file diff --git a/scripts/filters/rotate.js b/scripts/filters/rotate.js deleted file mode 100644 index 084cb55..0000000 --- a/scripts/filters/rotate.js +++ /dev/null @@ -1,42 +0,0 @@ -function Filter_Rotate() -{ - Filter.call(this); - this.parameters = [Angle,Position]; - - this.render = function(cmd) - { - var position = cmd.position() ? cmd.position() : new Position(ronin.frame.settings["size"].width/2,ronin.frame.settings["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.frame.settings["size"].width; - var h = ronin.frame.settings["size"].height; - - ronin.overlay.context().drawImage(context.canvas,0,0,w,h); - - ronin.frame.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(); - } -} \ No newline at end of file diff --git a/scripts/modules/layer.js b/scripts/modules/layer.js index 17e2f7f..631f5f1 100644 --- a/scripts/modules/layer.js +++ b/scripts/modules/layer.js @@ -3,6 +3,8 @@ function Layer(name,manager = null) Module.call(this,"#"); this.add_method(new Method("translate",["position"])); + this.add_method(new Method("rotate",["position","angle"])); + this.add_method(new Method("scale",["position","value"])); this.add_method(new Method("clear",[])); this.add_method(new Method("rotate",["position","angle"])); this.add_method(new Method("mirror",["position"])); @@ -17,10 +19,43 @@ function Layer(name,manager = null) this.element.setAttribute("id","_"+name); this.element.setAttribute("class","layer"); + this.scale = function(params,preview = false) + { + // TODO + // ronin.render.get_layer(); + // ronin.render.context().drawImage(ronin.frame.context().canvas,0,0,w/2,h/2); + } + + this.rotate = function(params, preview = false) + { + if(preview){ ronin.overlay.draw_pointer(params.position()); return; } + if(!params.position()){ return; } + + var position = params.position(); + var angle = params.angle().degrees; + + var w = ronin.frame.settings["size"].width; + var h = ronin.frame.settings["size"].height; + + ronin.render.get_layer().clear(); + ronin.render.context().drawImage(ronin.frame.context().canvas,0,0,w,h); + ronin.frame.active_layer.clear(); + + ronin.frame.context().save(); + ronin.frame.context().translate(position.x,position.y); + ronin.frame.context().rotate(angle*Math.PI/180); + + ronin.frame.context().drawImage(ronin.render.context().canvas, -position.x, -position.y,w,h) + + ronin.frame.context().rotate(-angle*Math.PI/180); + ronin.frame.context().restore(); + ronin.render.get_layer().clear(); + } + this.translate = function(params,preview = false) { - if(!params.position()){ return; } if(preview){ return; } + if(!params.position()){ return; } var data = this.data(); this.clear(); diff --git a/scripts/modules/render.js b/scripts/modules/render.js index 5466e29..a858ae4 100644 --- a/scripts/modules/render.js +++ b/scripts/modules/render.js @@ -4,7 +4,6 @@ function Render(rune) this.collection = {}; - this.collection["rotate"] = new Filter_Rotate(); this.collection["balance"] = new Filter_Balance(); this.collection["grey"] = new Filter_Grey(); this.collection["stencil"] = new Filter_Stencil();