Fixed visibility of canvas before canvas generation.

css/pixel-editor.scss

@@ -50,6 +50,7 @@ canvas {
   width: 400px;
   height: 400px;
   position: fixed;
+  display:none;
   box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.64);
 }
 

js/_canvas.js

@@ -2,6 +2,7 @@ function Canvas(width, height, canvas) {
     this.canvasSize = [width, height],
     this.canvas = canvas,
     this.context = this.canvas.getContext("2d"),
+    // Initializes the canvas
     this.initialize = function() {
         var maxHorizontalZoom = Math.floor(window.innerWidth/this.canvasSize[0]*0.75);
         var maxVerticalZoom = Math.floor(window.innerHeight/this.canvasSize[1]*0.75);
@@ -29,6 +30,7 @@ function Canvas(width, height, canvas) {
         this.canvas.style.width = newWidth;
         this.canvas.style.height = newHeight;
     },
+    // Copies the otherCanvas' position and size
     this.copyData = function(otherCanvas) {
         this.canvas.style.width = otherCanvas.canvas.style.width;
         this.canvas.style.height = otherCanvas.canvas.style.height;

js/_mouseEvents.js

@@ -229,9 +229,11 @@ canvasView.addEventListener("wheel", function(mouseEvent){
 			mode = 'out';
         }
 
+        // Changing zoom and position of the first layer
         changeZoom(layers[0], mode, getCursorPosition(mouseEvent))
 
         for (let i=1; i<layers.length; i++) {
+			// Copying first layer's data into the other layers
             layers[i].copyData(layers[0]);
 		}
 	}