Added eraser.

README.md

@@ -120,4 +120,4 @@ rate=10                           ; variable: rate = 10
 > 2,2;> 4,4;> 6,6;> 8,8
 # Symmetric Light
 > 1,1 600x;> 2,2 600x;> 3,3 600x;> 4,4 600x
-```
+```

index.html

@@ -23,6 +23,7 @@
     <script type="text/javascript" src="scripts/modules/file.save.js"></script>
     <script type="text/javascript" src="scripts/modules/help.js"></script>
     <script type="text/javascript" src="scripts/modules/history.js"></script>
+    <script type="text/javascript" src="scripts/modules/eraser.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/cursor.js

@@ -7,7 +7,7 @@ function Cursor()
   {
     if(event.ctrlKey === true){ this.set_mode(ronin.overlay); }
     else if(event.altKey === true){ this.set_mode(ronin.canvas); }
-    else if(event.shiftKey === true){ this.set_mode(ronin.brush);  }
+    else if(event.shiftKey === true){ this.set_mode(ronin.eraser);  }
     else{ this.set_mode(ronin.brush); }
   }
   

scripts/core/ronin.js

@@ -15,6 +15,7 @@ function Ronin()
   this.vector   = new Vector("+");
   this.help     = new Help("?");
   this.history  = new History("^");
+  this.eraser   = new Eraser(".");
   
   this.cursor   = new Cursor();
   
@@ -28,6 +29,7 @@ function Ronin()
   this.modules[this.vector.rune] = this.vector;
   this.modules[this.help.rune] = this.help;
   this.modules[this.history.rune] = this.history;
+  this.modules[this.eraser.rune] = this.eraser;
   
   this.cursors = [];
   

scripts/core/widget.js

@@ -10,7 +10,7 @@ function Widget()
       s += ronin.modules[key].widget();
     }
   
-    s += "<span class='cursor'>"+ronin.cursor.mode.constructor.name+"</span>";
+    s += "<span class='cursor'>"+ronin.cursor.mode.widget_cursor()+"</span>";
     
     this.element.innerHTML = s;
   }

scripts/modules/brush.js

@@ -65,6 +65,11 @@ function Brush(rune)
     return "> "+this.size+" <span>"+this.color.render()+"</span> ";
   }
   
+  this.widget_cursor = function()
+  {
+    return "Brush "+this.size;
+  }
+  
   // Cursor
 
   this.is_drawing = false;

scripts/modules/brush.pointer.js

@@ -16,6 +16,8 @@ function Pointer(offset = new Position(), color = new Color('000000'))
     this.distance += position.distance_to(this.position_prev);
     
     ronin.canvas.context().beginPath();
+    
+    ronin.canvas.context().globalCompositeOperation="source-over";
     ronin.canvas.context().moveTo(this.position_prev.x,this.position_prev.y);
     ronin.canvas.context().lineTo(position.x,position.y);
     ronin.canvas.context().lineCap="round";

scripts/modules/canvas.js

@@ -68,6 +68,11 @@ function Canvas(rune)
     return "@ "+this.element.width+"x"+this.element.height+" ";
   }
   
+  this.widget_cursor = function()
+  {
+    return "Drag";
+  }
+  
   // Cursor
   
   this.drag_from = null;

scripts/modules/eraser.js

@@ -0,0 +1,79 @@
+function Eraser(rune)
+{
+  Module.call(this,rune);
+  
+  this.parameters = [Value];
+  this.size = 5;
+  
+  // Module
+  
+  this.position_prev = null;
+  
+  this.draw = function()
+  {
+    if(!this.position_prev){this.position_prev = ronin.cursor.position; }
+    if(ronin.brush.size < 0){ this.erase(); return; }
+    
+    var position = ronin.cursor.position;
+    
+    this.distance += position.distance_to(this.position_prev);
+    
+    ronin.canvas.context().beginPath();
+    ronin.canvas.context().globalCompositeOperation="destination-out";
+    ronin.canvas.context().moveTo(this.position_prev.x,this.position_prev.y);
+    ronin.canvas.context().lineTo(position.x,position.y);
+    ronin.canvas.context().lineCap="round";
+    ronin.canvas.context().lineWidth = 10;
+    ronin.canvas.context().strokeStyle = new Color("#ff0000").rgba();
+    ronin.canvas.context().stroke();
+    ronin.canvas.context().closePath();
+    
+    this.position_prev = position;
+  }
+  
+  this.active = function(cmd)
+  {
+    if(cmd.value()){
+      this.size = cmd.value().float;
+    }
+  }
+  
+  this.passive = function(cmd)
+  {
+    
+  }
+
+  this.widget_cursor = function()
+  {
+    return "Eraser "+this.size;
+  }
+  
+  // Cursor
+
+  this.is_drawing = false;
+  
+  this.mouse_down = function(position)
+  {
+    this.is_drawing = true;
+    this.position_prev = null;
+    
+    ronin.stroke.new_stroke();
+  }
+  
+  this.mouse_move = function(position)
+  {
+    if(this.is_drawing === false){ return; }
+  
+    this.draw();
+    
+    ronin.stroke.append_stroke(position);
+  }
+  
+  this.mouse_up = function(position)
+  {
+    this.is_drawing = false;
+    this.position_prev = null;
+    
+    ronin.stroke.save_stroke();
+  }
+}

scripts/modules/module.js

@@ -25,6 +25,10 @@ function Module(rune)
     return "";
   }
   
+  this.widget_cursor = function()
+  {
+    return "Missing";
+  }
   
   this.mouse_down = function(position)
   {

scripts/modules/overlay.js

@@ -152,4 +152,11 @@ function Overlay(rune)
     this.live_draw_from = null;
     commander.element_input.focus();
   }
+  
+  // Widget
+  
+  this.widget_cursor = function()
+  {
+    return "Guide";
+  }
 }