Progress with Type

index.html

@@ -26,7 +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/type.js"></script>
     <script type="text/javascript" src="scripts/modules/render.js"></script>
     <script type="text/javascript" src="scripts/modules/magnet.js"></script>
     

scripts/core/ronin.js

@@ -12,7 +12,7 @@ function Ronin()
   this.eye      = new Eye("*");
   this.render   = new Render("%");
   this.path     = new Path("+");
-  this.typo     = new Typographe("&");
+  this.type     = new Type("&");
   this.cursor   = new Cursor(".");
   this.terminal = new Terminal(">");
   this.magnet   = new Magnet("^");
@@ -23,7 +23,7 @@ function Ronin()
   this.modules[this.render.rune]   = this.render;
   this.modules[this.brush.rune]    = this.brush;
   this.modules[this.eye.rune]      = this.eye;
-  this.modules[this.typo.rune]     = this.typo;
+  this.modules[this.type.rune]     = this.type;
   this.modules[this.path.rune]     = this.path;
   this.modules[this.terminal.rune] = this.terminal;
   this.modules[this.overlay.rune]  = this.overlay;

scripts/modules/surface.layer.js

@@ -3,6 +3,7 @@ function Layer(name,manager = null)
   Module.call(this,"#");
 
   this.name = name;
+  this.rune = "#";
   this.manager = manager;
   this.element = document.createElement("canvas");
   this.element.setAttribute("id","_"+name);

scripts/modules/type.js

@@ -0,0 +1,59 @@
+function Type(rune)
+{
+  Module.call(this,rune);
+
+  this.add_method(new Method("write",["Position","Text"],"Add position"));
+
+  this.settings = {"color":"#ffffff","size":"10","font":"Din"};
+
+  this.write = function(params,preview = false)
+  {
+    if(!this.layer){ this.create_layer(); this.layer.is_blinking = true; }
+
+    var command = new Command(params);
+
+    this.layer.clear();
+
+    var text = "Hello there.".replace("_"," ");
+    var position = command.position() ? command.position() : new Position(40,80);
+    var color = new Color("#ffffff");
+    var size = 40;
+    var font = "Georgia";
+
+    this.layer.context().font = size+"px "+font;
+    this.layer.context().fillStyle = color.hex; 
+    this.layer.context().fillText(text,position.x,position.y);
+  }
+
+  // Mouse
+
+  this.mouse_mode = function()
+  {
+    return "Type";
+  }
+
+  this.mouse_down = function(position)
+  {
+    ronin.terminal.input_element.value = "type."+ronin.terminal.method_name+" "+position.render();
+    ronin.terminal.passive();
+  }
+  
+  this.mouse_move = function(position,rect)
+  {
+    ronin.terminal.input_element.value = "type."+ronin.terminal.method_name+" "+position.render();
+    ronin.terminal.passive();
+  }
+  
+  this.mouse_up = function(position)
+  {
+    ronin.terminal.input_element.value = "type."+ronin.terminal.method_name+" "+position.render();
+    ronin.terminal.passive();
+  }
+
+  this.key_escape = function()
+  {
+    if(this.layer){ this.layer.remove(this); }
+    ronin.terminal.input_element.value = "";
+    ronin.terminal.passive();
+  }
+}

scripts/modules/typographe.js

@@ -1,76 +0,0 @@
-function Typographe(rune)
-{
-  Module.call(this,rune);
-
-  this.settings = {"color":new Color("#ffffff"),"size":new Value(10)};
-  this.methods = {"draw":new Method("draw",["text","position","font"])}
-
-  this.active = function(cmd)
-  {
-    if(this.layer){ this.layer.remove(this); }
-
-    if(cmd.setting("text")){
-      this.add_text(ronin.surface.active_layer.context(),cmd);
-    }
-  }
-
-  this.passive = function(cmd)
-  {
-    if(!this.layer){ this.create_layer(); this.layer.is_blinking = true; }
-
-    if(cmd.setting("text")){
-      this.layer.clear();
-      this.add_text(this.layer.context(),cmd);
-    }
-  }
-
-  this.add_text = function(context,cmd)
-  {
-    var ctx = context;
-
-    var text = cmd.setting("text").value.replace("_"," ");
-    var position = cmd.position() ? cmd.position() : new Position(20,40);
-    var color = cmd.color() ? cmd.color() : new Color("#000000");
-    var size = cmd.value() ? cmd.value().int : 40;
-    var font = cmd.setting("font") ? cmd.setting("font").value : "Georgia";
-
-    ctx.font = size+"px "+font;
-    ctx.fillStyle = color.hex; 
-    ctx.fillText(text,position.x,position.y);
-  }
-
-  // Mouse
-
-  this.mouse_mode = function()
-  {
-    return "Typographe";
-  }
-
-  this.mouse_down = function(position)
-  {
-    ronin.overlay.draw(position);
-    ronin.terminal.input_element.value = "& "+position.render()+" ";
-    ronin.terminal.update_hint();
-  }
-  
-  this.mouse_move = function(position,rect)
-  {
-    if(!this.mouse_held){ return; }
-
-    ronin.overlay.draw(position);
-    ronin.terminal.input_element.value = "& "+position.render()+" ";
-    ronin.terminal.update_hint();
-  }
-  
-  this.mouse_up = function(position)
-  {
-    ronin.overlay.draw(position);
-    ronin.terminal.input_element.value = "& "+position.render()+" ";
-    ronin.terminal.update_hint();
-  }
-
-  this.key_escape = function()
-  {
-    if(this.layer){ this.layer.remove(this); }
-  }
-}