Started canvas trimming

js/_pixelEditorUtility.js

@@ -183,3 +183,11 @@ function resizeImageData (image, width, height, algorithm) {
   
 	return result
   }
+
+  function getPixelPosition(index) {
+	  let linearIndex = index / 4;
+	  let y = linearIndex / layers[0].canvasSize[0];
+	  let x = linearIndex - y * layers[0].canvasSize[0];
+
+	  return [x, y];
+  }

js/_resizeCanvas.js

@@ -166,6 +166,48 @@ function resizeCanvas(event, size) {
     closeDialogue();
 }
 
+function trimCanvas() {
+    let minX, minY = Infinity;
+    let maxX, maxY = -Infinity;
+
+    rcPivot = "middle";
+    console.log("trimmo");
+
+    for (let i=1; i<nAppLayers; i++) {
+        let imageData = layers[i].context.getImageData(0, 0, layers[0].canvasSize[0], layers[0].canvasSize[1]);
+        let pixelPosition;
+
+        for (let i=0; i<imageData.length; i+=4) {
+            if (!isPixelEmpty([imageData[i], imageData[i + 1], imageData[i + 2], imageData[i + 3]])) {
+                pixelPosition = getPixelPosition(i);        
+
+                if (pixelPosition.x > maxX) {
+                    maxX = pixelPosition[0];
+                }
+                else if (pixelPosition.x < minX) {
+                    minX = pixelPosition[0];
+                }
+
+                if (pixelPosition.y > maxY) {
+                    maxY = pixelPosition[1];
+                }
+                else if (pixelPosition.y < minY) {
+                    minY = pixelPosition[1];
+                }
+            }
+        }
+    }
+
+    console.log(maxX + ", " + minX + ", " + maxY + ", " + minY);
+
+    borders.right = maxX - layers[0].canvasSize[0];
+    borders.left = -minX;
+    borders.top = maxY - layers[0].canvasSize[1];
+    borders.bottom = minY;
+
+    resizeCanvas(null);
+}
+
 function rcUpdateBorders() {
     // Getting input
     borders.left = document.getElementById("rc-border-left").value;

views/pixel-editor.hbs

@@ -54,6 +54,7 @@
             <ul>
                 <li><button id="resize-canvas-button" onclick = "openResizeCanvasWindow()">Resize canvas</button></li>
                 <li><button id="resize-sprite-button" onclick = "openResizeSpriteWindow()">Scale sprite</button></li>
+                <li><button onclick = "trimCanvas()">Trim canvas</button></li>
                 <li><button id="undo-button" class="disabled">Undo</button></li>
                 <li><button id="redo-button" class="disabled">Redo</button></li>
             </ul>