Starting to build save/load and guides.

scripts/commander.js

@@ -21,8 +21,8 @@ function Commander(element,element_input)
     
     // Canvas
     if(parts[0] == ":@"){
-      canvas.style.width = parts[1]+"px";
-      canvas.style.height = parts[2]+"px";
+      canvas.setAttribute('width',parts[1]+"px");
+      canvas.setAttribute('height',parts[2]+"px");
     }
     
     // Brush
@@ -35,10 +35,45 @@ function Commander(element,element_input)
       brush.remove(parts);
     }
     
+    // Save
+    if(parts[0] == ":$"){
+      var d=canvas.toDataURL("image/png");
+      var w=window.open('about:blank','image from canvas');
+      w.document.write("<title>"+parts[1]+"</title><img src='"+d+"' alt='from canvas'/>");
+    }
+    
+    // Load
+    if(parts[0] == ":/"){
+      base_image = new Image();
+      base_image.src = 'img/base.png';
+      base_image.onload = function(){
+        context.drawImage(base_image, 100, 100);
+      }
+    }
+    
+    // Guides
+    if(parts[0] == ":|"){
+      console.log("!!");
+    }
     this.hide();
   }
   
   this.passive = function()
   {
+    var parts = this.element_input.value.split(" ");
+    
+    // Guides
+    if(parts[0] == ":|"){
+      console.log("!!");
+    }
+    
+    // Draw
+    if(parts[0] == ":/"){
+      base_image = new Image();
+      base_image.src = 'img/base.png';
+      base_image.onload = function(){
+        context.drawImage(base_image, 100, 100);
+      }
+    }
   }
 }

scripts/main.js

@@ -1,3 +1,4 @@
+var ronin = new Ronin();
 
 var canvas = document.getElementById('myCanvas');
 var context = canvas.getContext('2d');
@@ -10,6 +11,7 @@ canvas.addEventListener('mousemove', function(e) {
 }, false);
 
 canvas.addEventListener('mousedown', function(e) {
+  if(e.which != 1){ return; }
   brush.draw_start(e);
 }, false);
 
@@ -20,13 +22,12 @@ canvas.addEventListener('mouseup', function(e) {
 var keyboard = new Keyboard();
 document.onkeydown = function myFunction(){ keyboard.listen(event); };
 
+/* brush experiments
+
 var mirror_test = new Pointer();
 mirror_test.mirror = new Position(200,10);
 brush.add_pointer(mirror_test);
 
-/* brush experiments
-
-
 var mirror_test2 = new Pointer(new Position(0,10));
 mirror_test2.mirror = new Position(200,0);
 brush.add_pointer(mirror_test2);

scripts/pointer.js

@@ -23,7 +23,7 @@ function Pointer(offset = new Position(), color = new Color('000000'))
   this.thickness = function()
   {
     var v = 100 - ((this.position().distance_to(this.position_prev)));
-    var t = v/20;
+    var t = v/40;
     return t < 1 ? 1 : t;
   }
   

scripts/ronin.js

@@ -0,0 +1,3 @@
+function Ronin()
+{
+}