Added typography tool

index.html

@@ -26,6 +26,7 @@
     <script type="text/javascript" src="scripts/modules/surface.js"></script>
     <script type="text/javascript" src="scripts/modules/surface.layer.js"></script>
     <script type="text/javascript" src="scripts/modules/eye.js"></script>
+    <script type="text/javascript" src="scripts/modules/typographe.js"></script>
     
     <script type="text/javascript" src="scripts/modules/filter.js"></script>
     <script type="text/javascript" src="scripts/modules/filter.saturation.js"></script>

scripts/core/commander.hint.js

@@ -52,7 +52,7 @@ function Hint(element)
     var s = "<span class='module'>Modules</span>";
     
     for (var key in ronin.modules){
-      s += "<span class='param'>"+ronin.modules[key].constructor.name.substr(0,2)+"<span> <span class='value'>"+key+"</span> ";
+      s += "<span> <span class='value'>"+key+"</span> <span class='param'>"+ronin.modules[key].constructor.name.substr(0,2)+" ";
     }
     
     return s;

scripts/core/ronin.js

@@ -16,6 +16,7 @@ function Ronin()
   this.eraser   = new Eraser(".");
   this.surface  = new Surface("#");
   this.eye      = new Eye("*");
+  this.typo     = new Typographe("&");
   
   this.cursor   = new Cursor();
   
@@ -31,6 +32,7 @@ function Ronin()
   this.modules[this.eraser.rune] = this.eraser;
   this.modules[this.surface.rune] = this.surface;
   this.modules[this.eye.rune] = this.eye;
+  this.modules[this.typo.rune] = this.typo;
   
   this.cursors = [];
   
@@ -47,7 +49,6 @@ function Ronin()
   
   this.position_in_window = function(p)
   {
-    console.log(p.x);
     return new Position(p.x + parseInt(this.surface.element.style.marginLeft),p.y + parseInt(this.surface.element.style.marginTop));
   }
   

scripts/modules/typographe.js

@@ -0,0 +1,39 @@
+function Typographe(rune)
+{
+  Module.call(this,rune);
+
+  this.parameters = [Position,Color];
+  this.variables  = {"text" : null};
+
+  this.active = function(cmd)
+  {
+    var target = ronin.surface.active_layer;
+    target.clear();
+    if(cmd.variable("text")){
+      this.add_text(target.context(),cmd);
+    }
+  }
+
+  this.passive = function(cmd)
+  {
+    var target = ronin.overlay;
+    target.clear();
+    if(cmd.variable("text")){
+      this.add_text(target.context(),cmd);
+    }
+  }
+
+  this.add_text = function(context,cmd)
+  {
+    var ctx = context;
+
+    var text = cmd.variable("text").value;
+    var position = cmd.position() ? cmd.position() : new Position(10,10);
+    var color = cmd.color() ? cmd.color() : new Color("#000000");
+    var size = cmd.value() ? cmd.value().int : 20;
+
+    ctx.font = size+"px Georgia";
+    ctx.fillStyle = color.hex; 
+    ctx.fillText(text,position.x,position.y);
+  }
+}