Added image load/save.

_notes.txt

@@ -15,6 +15,9 @@
 >
 < Prev Laye
 
+  Background
+* ff00ff                          ; Fill background with color
+
   Files
 $ new_name.jpg
 / file_name.jpg
@@ -41,3 +44,9 @@ $ new_name.jpg
   Eraser
 
   Right click should not draw
+
+  Fill background
+
+  Image
+
+  Eraser

scripts/commander.js

@@ -44,11 +44,14 @@ function Commander(element,element_input)
     
     // Load
     if(parts[0] == "/"){
-      base_image = new Image();
-      base_image.src = 'img/base.png';
-      base_image.onload = function(){
-        context.drawImage(base_image, 100, 100);
+      parts.shift();
+      ronin.load_image(parts);
     }
+    
+    // Fill
+    if(parts[0] == "*"){
+      parts.shift();
+      ronin.fill(parts);
     }
     
     // Guides
@@ -71,11 +74,9 @@ function Commander(element,element_input)
     
     // Draw
     if(parts[0] == "/"){
-      base_image = new Image();
-      base_image.src = 'img/base.png';
-      base_image.onload = function(){
-        context.drawImage(base_image, 100, 100);
-      }
+      parts.shift();
+      parts.shift();
+      ronin.guide(parts);
     }
   }
 }

scripts/ronin.js

@@ -1,10 +1,44 @@
 function Ronin()
 {
   this.element = null;
+  
+  this.load_image = function(p)
+  {
+    base_image = new Image();
+    base_image.src = p[0]; // media/logo.png
+    base_image.onload = function(){
+      context.drawImage(base_image, parseFloat(p[1]), parseFloat(p[2]), parseFloat(p[3]), parseFloat(p[4]));
+    }
+    this.draw_guides();
+  }
+  
+  this.fill = function(p)
+  {
+    cvSave = canvas.toDataURL("image/png");
+    
+    context.beginPath();
+    context.rect(0, 0, canvas.width, canvas.height);
+    context.fillStyle = "#"+p[0];
+    context.fill();
+    
+    var imgObj = new Image();
+    imgObj.src = cvSave;
+
+    context.drawImage(imgObj,0,0);
+  }
+  
+  // Guides
+  
   this.guides_element = null;
   this.guides_context = null;
   this.guides = [];
   
+  this.clear_guides = function()
+  {
+    this.guides = [];
+    this.draw_guides();
+  }
+  
   this.draw_guides = function()
   {
     this.guides_context.clearRect(0, 0, canvas.width, canvas.height);
@@ -17,6 +51,7 @@ function Ronin()
   this.guide = function(p)
   {
     this.guides_context.clearRect(0, 0, canvas.width, canvas.height);
+    this.draw_guides();
     
     var x = p[0] ? p[0] : 0 ;
     var y = p[1] ? p[1] : 0 ;
@@ -30,6 +65,8 @@ function Ronin()
   
   this.add_guide = function(p)
   {
+    if(p == "-"){ this.clear_guides(); return; }
+    
     var x = p[0] ? p[0] : 0 ;
     var y = p[1] ? p[1] : 0 ;
     var w = p[2] ? p[2] : 0 ;