ISurface and NESBank updated to handle undo/redo history. Fixed a base64 issue in NESBank.

app/js/ifaces/ISurface.js

 export default class ISurface extends EventCaller{
   constructor(){
     super();
+    this.__historyLength = 10;
   }
 
   get width(){return 0;}
   get height(){return 0;}
   get length(){return 0;}
+  get historyLength(){return this.__historyLength;}
+  get undos(){return 0;}
+  get redos(){return 0;}
 
   get coloridx(){
     return new Proxy(this, {
   copy(b){return this;}
   clone(){return new ISurface();}
 
+  snapshot(){return this;}
+  undo(){return this;}
+  redo(){return this;}
+  clearUndos(){return this;}
+  clearRedos(){return this;}
+  clearHistory(){
+    return this.clearUndos().clearRedos();
+  }
+
   getColor(x, y){
     return this.__default_pi[4];
   }

app/js/models/NESBank.js

     this.__AccessMode = NESBank.ACCESSMODE_8K;
     this.__AccessOffset = 0;
 
+    this.__undos = []; // Holds Base64 snapshots of the bank.
+    this.__redos = []; // Holds Base64 snapshots of work undone.
+
     this.__emitsEnabled = true;
+    this.snapshot = Utils.debounce(this.snapshot.bind(this), 250);
 
     var handle_datachanged = Utils.debounce((function(side, idx){
       var sendEmit = false;
     if (b.length !== 8192){
       throw new Error("Base64 string contains invalid byte count.");
     }
+    b = new Uint8Array(b.split("").map(function(c){
+      return c.charCodeAt(0);
+    }));
     this.chr = b; 
   }
 
   }
   get length(){return this.width * this.height;}
 
+  get undos(){return this.__undos.length;}
+  get redos(){return this.__redos.length;}
+
+
   get coloridx(){
     return new Proxy(this, {
       get:function(obj, prop){
     }
     return this;
   }
+
+
+  snapshot(){
+    var snap = this.base64;
+    if (this.__undos.length === this.__historyLength){
+      this.__undos.pop();
+    }
+    this.__undos.splice(0,0,snap);
+    return this;
+  }
+
+  undo(){
+    if (this.__undos.length > 0){
+      var usnap = this.__undos.splice(0, 1)[0];
+      var rsnap = this.base64;
+      this.base64 = usnap;
+      if (this.__redos.length === this.__historyLength){
+        this.__redos.pop();
+      }
+      this.__redos.splice(0,0,rsnap); 
+    }
+    return this;
+  }
+
+  redo(){
+    if (this.__redos.length > 0){
+      var rsnap = this.__redos.splice(0,1)[0];
+      var usnap = this.base64;
+      this.base64 = rsnap;
+      if (this.__undos.length === this.__historyLength){
+        this.__undos.pop();
+      }
+      this.__undos.splice(0,0,usnap);
+    }
+    return this;
+  }
+
+  clearUndos(){
+    this.__undos = [];
+    return this;
+  }
+
+  clearRedos(){
+    this.__redos = [];
+    return this;
+  }
 }