Fixed issue with stencil

sources/scripts/filters/stencil.js

@@ -5,17 +5,23 @@ function Filter_Stencil()
 
   this.render = function(cmd)
   {
-    this.draw(this.context(),cmd.angle() ? cmd.angle().degrees : 20);
+    var angle = cmd.angle() ? cmd.angle().degrees : 20;
-    ronin.overlay.clear();
+    var color = cmd.color() ? cmd.color().hex : "#ffffff";
+
+    ronin.render.layer.clear();
+    this.draw(ronin.surface.active_layer.context(),angle,color);
   }
 
   this.preview = function(cmd)
   {
-    ronin.overlay.clear();
+    var angle = cmd.angle() ? cmd.angle().degrees : 20;
-    this.draw(ronin.overlay.context(),cmd.angle() ? cmd.angle().degrees : 20);
+    var color = cmd.color() ? cmd.color().hex : "#ffffff";
+
+    ronin.render.layer.clear();
+    this.draw(ronin.render.layer.context(),angle,color);
   }
 
-  this.draw = function(context = this.context(), angle = 20)
+  this.draw = function(context = this.context(), angle, color)
   {
     var w = ronin.surface.size.width;
     var h = ronin.surface.size.height;
@@ -24,51 +30,51 @@ function Filter_Stencil()
 
     context.rotate(angle*Math.PI/180);
 
-    this.line(context,-w,0,w,0);
+    this.line(context,-w,0,w,0,color);
 
-    this.line(context,w*0.4,-h,w*0.4,h);
+    this.line(context,w*0.4,-h,w*0.4,h,color);
-    this.line(context,-w*0.4,-h,-w*0.4,h);
+    this.line(context,-w*0.4,-h,-w*0.4,h,color);
 
-    this.line(context,-w,h*0.25,w,h*0.25);
+    this.line(context,-w,h*0.25,w,h*0.25,color);
-    this.line(context,-w,-h*0.25,w,-h*0.25);
+    this.line(context,-w,-h*0.25,w,-h*0.25,color);
 
-    this.line(context,w*0.1,0,w*0.1,h);
+    this.line(context,w*0.1,0,w*0.1,h,color);
-    this.line(context,-w*0.1,0,-w*0.1,-h);
+    this.line(context,-w*0.1,0,-w*0.1,-h,color);
 
-    this.circle(context,w*0.4,-h*0.25,w*0.05,1,1.5);
+    this.circle(context,w*0.4,-h*0.25,w*0.05,1,1.5,color);
-    this.circle(context,-w*0.4,h*0.25,w*0.05,0,0.5);
+    this.circle(context,-w*0.4,h*0.25,w*0.05,0,0.5,color);
 
     context.font = "5px Arial";
-    context.fillStyle = "#999"; 
+    context.fillStyle = color; 
     context.fillText("GRID",(w*0.4)+10,10);
 
     context.font = "5px Arial";
-    context.fillStyle = "#999"; 
+    context.fillStyle = color; 
     context.fillText("GRID",(-w*0.4)-20,-10);
 
     context.rotate(-angle*Math.PI/180);
     context.translate(-w/2,-h/2);
   }
 
-  this.line = function(context,x1,x2,y1,y2)
+  this.line = function(context,x1,x2,y1,y2,color)
   {
     context.beginPath();
     context.moveTo(x1,x2);
     context.lineTo(y1,y2);
     context.lineCap="round";
     context.lineWidth = 0.5;
-    context.strokeStyle = "#999";
+    context.strokeStyle = color;
     context.stroke();
     context.closePath();
   }
 
-  this.circle = function(context,x,y,r,c1,c2)
+  this.circle = function(context,x,y,r,c1,c2,color)
   {
     context.beginPath();
     context.arc(x,y,r,c1*Math.PI,c2*Math.PI);
     context.lineCap="round";
     context.lineWidth = 0.5;
-    context.strokeStyle = "#999";
+    context.strokeStyle = color;
     context.stroke();
     context.closePath();
   }

sources/scripts/modules/file.save.js

@@ -11,7 +11,7 @@ function FileSave(rune)
 
   this.install = function()
   {
-    this.layer = new Layer("Export",this);
+    this.layer = new Layer("Save.Export",this);
     ronin.surface.add_layer(this.layer);
   }
 

sources/scripts/modules/overlay.js

@@ -9,7 +9,7 @@ function Overlay(rune)
 
   this.install = function()
   {
-    this.layer = new Layer("Guide",this);
+    this.layer = new Layer("Overlay.Guide",this);
     this.layer.element.setAttribute("style","z-index:9000");
     ronin.surface.add_layer(this.layer);
   }

sources/scripts/modules/render.js

@@ -10,6 +10,15 @@ function Render(rune)
   this.collection["invert"] = new Filter_Invert();
   this.collection["chromatic"] = new Filter_Chromatic();
 
+  this.layer = null;
+
+  this.install = function()
+  {
+    this.layer = new Layer("Render.Preview",this);
+    this.layer.element.setAttribute("style","z-index:9000");
+    ronin.surface.add_layer(this.layer);
+  }
+  
   this.active = function(cmd)
   {
     var name = cmd.content[0];
@@ -29,7 +38,7 @@ function Render(rune)
 	
   this.hint = function(cmd)
   {
-    var input = cmd.content.join(" ");
+    var input = cmd.content.join(" ").trim();
     var s = this.pad(input);
 
     if(this.collection[input]){

sources/scripts/modules/surface.layer.js

@@ -45,7 +45,6 @@ function Layer(name,manager = null)
   this.widget = function()
   {
     var e_name = "";
-    if(this.manager != null){ e_name += this.manager.constructor.name+"."; }
     e_name += this.name;
 
     var e_class = "";

sources/scripts/modules/typographe.js

@@ -9,7 +9,7 @@ function Typographe(rune)
 
   this.install = function()
   {
-    this.layer = new Layer("TextPreview",this);
+    this.layer = new Layer("Typographe.Preview",this);
     this.layer.element.setAttribute("style","z-index:7000");
     ronin.surface.add_layer(this.layer);
   }

sources/scripts/modules/vector.js

@@ -9,7 +9,7 @@ function Vector(rune)
 
   this.install = function()
   {
-    this.layer = new Layer("PathPreview",this);
+    this.layer = new Layer("Vector.Preview",this);
     this.layer.element.setAttribute("style","z-index:8000");
     ronin.surface.add_layer(this.layer);
   }