Fixed undo for move tool

js-lib/common.js

@@ -12,6 +12,8 @@ goog.provide('ascii');
 /** @const */ var SPECIAL_LINE_H = '\u2014';
 /** @const */ var SPECIAL_LINE_V = '|';
 
+/** @const */ var ERASE_CHAR = '\u2009';
+
 /** @const */ var DRAG_LATENCY = 130; // Milliseconds.
 /** @const */ var DRAG_ACCURACY = 3; // Pixels.
 
@@ -111,6 +113,11 @@ ascii.Cell.prototype.hasScratch = function() {
   return this.scratchValue != null;
 };
 
+/** @return {boolean} */
+ascii.Cell.prototype.isErase = function() {
+  return this.scratchValue == ERASE_CHAR;
+};
+
 /**
  * The context for a cell, i.e. the status of the cells around it.
  *

js-lib/draw.js

@@ -236,7 +236,7 @@ ascii.DrawErase.prototype.move = function(position) {
 
   for (var i = startX; i <= endX; i++) {
     for (var j = startY; j <= endY; j++) {
-      this.state.drawValue(new ascii.Vector(i, j), ' ');
+      this.state.drawValue(new ascii.Vector(i, j), ERASE_CHAR);
     }
   }
 };
@@ -255,10 +255,12 @@ ascii.DrawErase.prototype.handleKey = function(value) {};
  */
 ascii.DrawMove = function(state) {
   this.state = state;
+  this.startPosition = null;
   this.ends = null;
 };
 
 ascii.DrawMove.prototype.start = function(position) {
+  this.startPosition = position;
   var context = this.state.getContext(position);
   var directions = [
     new ascii.Vector(1, 0),
@@ -303,18 +305,17 @@ ascii.DrawMove.prototype.start = function(position) {
     }
   }
   this.ends = ends;
-
-  // Clear all the lines so we can draw them afresh.
-  for (var i in ends) {
-    drawLine(this.state, position, ends[i].position, ends[i].clockwise, ' ');
-  }
-  this.state.commitDraw();
   // Redraw the new lines after we have cleared the existing ones.
   this.move(position);
 };
 
 ascii.DrawMove.prototype.move = function(position) {
   this.state.clearDraw();
+  // Clear all the lines so we can draw them afresh.
+  for (var i in this.ends) {
+    drawLine(this.state, this.startPosition, this.ends[i].position,
+        this.ends[i].clockwise, ' ');
+  }
   for (var i in this.ends) {
     drawLine(this.state, position, this.ends[i].position,
         this.ends[i].clockwise);

js-lib/state.js

@@ -129,20 +129,19 @@ ascii.State.prototype.commitDraw = function(opt_skipSave) {
     oldValues.push(new ascii.MappedValue(position, cell.value != null ? cell.value : ' '));
 
     var newValue = cell.getRawValue();
-    // Cheeky little hack for making erase play nicely.
+    if (newValue == ERASE_CHAR) {
-    if (newValue == ' ') {
       newValue = null;
     }
     cell.scratchValue = null;
     cell.value = newValue;
   }
 
-  // If we have too many undo states, clear one out.
-  if(this.undoStates.length > MAX_UNDO) {
-    this.undoStates.shift();
-  }
   // Don't save a new state if we are undoing an old one.
   if (!opt_skipSave && oldValues.length > 0) {
+    // If we have too many undo states, clear one out.
+    if(this.undoStates.length > MAX_UNDO) {
+      this.undoStates.shift();
+    }
     this.undoStates.push(oldValues);
   }
 };

js-lib/view.js

@@ -90,7 +90,8 @@ ascii.View.prototype.render = function() {
   for (var i = startOffset.x; i < endOffset.x; i++) {
     for (var j = startOffset.y; j < endOffset.y; j++) {
       var cell = this.state.getCell(new ascii.Vector(i, j));
-      if (cell.hasScratch() || cell.isSpecial()) {
+      // Highlight the cell if it is special (grey) or it is part of a visible edit (blue).
+      if (cell.isSpecial() || (cell.hasScratch() && cell.getRawValue() != ' ')) {
         this.context.fillStyle = cell.hasScratch() ? '#DEF' : '#F5F5F5';
         context.fillRect(
             i * CHAR_PIXELS_H - this.offset.x,