feat: ultra mega giga fast undo

Author: HarshKhandeparkar

README.md

@@ -102,6 +102,10 @@ e.g.: `RealRenderer.draw().reset().startRender()`
 
 - `toggleRender()`: Toggles the rendering.
 
+- `getData()`: Returns a 3D array of the pixel values.
+
+- `loadData()`: Returns a 3D array of the pixels.
+
 - `resetTime()`: Resets the internal time value to `0`.
 
 - `reset()`: Resets the pixels on the graph to a blank graph with the coordinate axes.

dist/gpujs-real-renderer-browser.js

@@ -113,14 +113,11 @@
 	function getLoadDataKernel(gpu, dimensions) {
 	    return gpu.createKernel(function (graphPixels) {
 	        return [
-	            graphPixels[this.thread.y * this.output.x * 3 + this.thread.x * 3 + 0],
-	            graphPixels[this.thread.y * this.output.x * 3 + this.thread.x * 3 + 1],
-	            graphPixels[this.thread.y * this.output.x * 3 + this.thread.x * 3 + 2]
+	            graphPixels[this.thread.y][this.thread.x][0],
+	            graphPixels[this.thread.y][this.thread.x][1],
+	            graphPixels[this.thread.y][this.thread.x][2]
 	        ];
 	    }, {
-	        argumentTypes: {
-	            graphPixels: 'Array'
-	        },
 	        output: dimensions,
 	        pipeline: true
 	    });
@@ -263,16 +260,7 @@
 	        return this;
 	    };
 	    RealRenderer.prototype.getData = function () {
-	        var returnedArray = this.graphPixels.toArray();
-	        var outArr = [];
-	        for (var i = 0; i < returnedArray.length; i++) {
-	            for (var j = 0; j < returnedArray[0].length; j++) {
-	                for (var k = 0; k < returnedArray[0][0].length; k++) {
-	                    outArr[i * returnedArray[0].length * returnedArray[0][0].length + j * returnedArray[0][0].length + k] = returnedArray[i][j][k];
-	                }
-	            }
-	        }
-	        return outArr;
+	        return this.graphPixels.toArray();
 	    };
 	    RealRenderer.prototype.loadData = function (pixels) {
 	        this.graphPixels = this._loadData(pixels);

dist/gpujs-real-renderer-browser.min.js

@@ -1,7 +1,7 @@
 // Draw Board
 const drawBoardOptions = {
   canvas: document.getElementById('drawboard-canvas'),
-  dimensions: [420, 360],
+  dimensions: [1000, 1000],
 
   xScaleFactor: 1,
   yScaleFactor: 1,

example/examples/drawboard.js

@@ -12,15 +12,12 @@ export function getLoadDataKernel(
   return gpu.createKernel(
     function(graphPixels) {
       return [
-        graphPixels[this.thread.y * this.output.x * 3 + this.thread.x * 3 + 0],
-        graphPixels[this.thread.y * this.output.x * 3 + this.thread.x * 3 + 1],
-        graphPixels[this.thread.y * this.output.x * 3 + this.thread.x * 3 + 2]
+        graphPixels[this.thread.y][this.thread.x][0],
+        graphPixels[this.thread.y][this.thread.x][1],
+        graphPixels[this.thread.y][this.thread.x][2]
       ]
     },
     {
-      argumentTypes: {
-        graphPixels: 'Array'
-      },
       output: dimensions,
       pipeline: true
     }

src/kernels/loadData.ts

@@ -39,8 +39,8 @@ export class RealDrawBoard extends RealRenderer {
   eraserSize: number;
   tool: Tool = RealDrawBoardDefaults.tool;
   _isDrawing: boolean = false;
-  _isStroking: boolean = false; // If a tool is drawing a stroke
-  _snapshots: number[][] = []; // Undo snapshots
+  _isStroking: boolean = false; // If a tool is drawing a strwoke
+  _snapshots: (number[][][])[] = []; // Undo snapshots
   _currentSnapshotIndex = 0; // Current snapshot
   _maxSnapshots: number;
   _plotKernel: IKernelRunShortcut;

src/renderers/RealDrawBoard/RealDrawBoard.ts

@@ -146,21 +146,10 @@ export class RealRenderer {
   }
 
   getData() {
-    let returnedArray: number[][][] = <number[][][]>this.graphPixels.toArray();
-    let outArr: number[] = [];
-
-    for (let i = 0; i < returnedArray.length; i++) {
-      for (let j = 0; j < returnedArray[0].length; j++) {
-        for (let k = 0; k < returnedArray[0][0].length; k++) {
-          outArr[i * returnedArray[0].length * returnedArray[0][0].length + j * returnedArray[0][0].length + k] = returnedArray[i][j][k];
-        }
-      }
-    }
-
-    return outArr;
+    return <number[][][]>this.graphPixels.toArray();
   }
 
-  loadData(pixels: number[]) {
+  loadData(pixels: number[][][]) {
     this.graphPixels = <Texture>this._loadData(pixels);
     this._display(this.graphPixels);
   }