Fixed a horrible bug that happened when moving layers

js/_checkerboard.js

@@ -10,9 +10,6 @@ function fillCheckerboard() {
     var context = checkerBoard.context;
     context.clearRect(0, 0, canvasSize[0], canvasSize[1]);
 
-    console.log(canvasSize);
-    console.log(checkerBoardSquareSize);
-
     // Cycling through the canvas (using it as a matrix)
     for (var i=0; i<canvasSize[0] / checkerBoardSquareSize; i++) {
         nSquaresFilled = 0;

js/_layer.js

@@ -183,7 +183,6 @@ class Layer {
     }
 
     layerDragDrop(element) {
-        console.log("Elemento: " + element.dataTransfer.getData('text/html'));
         if (element.stopPropagation) {
             element.stopPropagation(); // Stops some browsers from redirecting.
         }
@@ -193,7 +192,6 @@ class Layer {
             let toDropID = element.dataTransfer.getData('text/html');
             let thisID = this.id;
             
-            console.log("ID di quello spostato: " + toDropID + ", di quello su cui metterlo: " + thisID);
             swapLayerEntries(toDropID, thisID);
         }
 
@@ -204,7 +202,6 @@ class Layer {
     }
 
     layerDragEnd(element) {
-        console.log(currentLayer);
         this.classList.remove('layerdragover');
     }    
 
@@ -237,18 +234,14 @@ class Layer {
 
     toggleLock() {
         if (this.isLocked) {
-            console.log("unlocked");
             this.unlock();
         }
         else {
-            console.log("locked");
             this.lock();
         }
     }
 
     toggleVisibility() {
-        console.log(this);
-
         if (this.isVisible) {
             this.hide();
         }
@@ -330,11 +323,8 @@ function swapLayerEntries(id1, id2) {
     let entry1 = document.getElementById(id1);
     let entry2 = document.getElementById(id2);
 
-    console.log("id1: " + id1);
+    console.log("entry 1: " + id1);
-    console.log("id2: " + id2);
+    console.log("entry 2: " + id2);
-
-    console.log("entry1: " + entry1);
-    console.log("entry2: " + entry2);
 
     let layer1 = getLayerByID(id1);
     let layer2 = getLayerByID(id2);
@@ -343,19 +333,30 @@ function swapLayerEntries(id1, id2) {
     let after2 = entry2.nextSibling;
     let parent = entry1.parentNode;
 
+    console.log("prima: " + layer1.canvas.style.zIndex);
+    console.log("prima: " + layer2.canvas.style.zIndex);
+
+    tmpZIndex = layer1.canvas.style.zIndex;
+    layer1.canvas.style.zIndex = layer2.canvas.style.zIndex;
+    layer2.canvas.style.zIndex = tmpZIndex;
+
+    console.log("fatto");
+
     parent.insertBefore(entry2, entry1);
 
     if (after2) {
-        parent.insertBefore(entry1, after2);
+        if (after2 == entry1) {
+            parent.prepend(entry1);
+        }
+        else {
+            parent.insertBefore(entry1, after2);
+        }
     } else {
        parent.appendChild(entry1);
     }
 
-    tmpZIndex = layer1.canvas.style.zIndex;
+    console.log("dopo: " + layer1.canvas.style.zIndex);
-    console.log("1: " + layer1.canvas.style.zIndex);
+    console.log("dopo: " + layer2.canvas.style.zIndex);
-    console.log("2: " + layer2.canvas.style.zIndex);
-    layer1.canvas.style.zIndex = layer2.canvas.style.zIndex;
-    layer2.canvas.style.zIndex = tmpZIndex;
 }
 
 // Finds a layer given its name

js/_mouseEvents.js

@@ -36,8 +36,6 @@ window.addEventListener("mousedown", function (mouseEvent) {
 
 		currentTool.updateCursor();
 
-		console.log(currentLayer.isLocked);
-
 		if (!currentLayer.isLocked && canDraw) {
 			draw(mouseEvent);
 		}
@@ -47,7 +45,6 @@ window.addEventListener("mousedown", function (mouseEvent) {
 		tool.pencil.previousBrushSize = tool.pencil.brushSize;
 	}
 	else if (currentTool.name == 'eraser' && mouseEvent.which == 3) {
-		console.log('resize eraser')
 	    currentTool = tool.resizeeraser;
 	    tool.eraser.previousBrushSize = tool.eraser.brushSize;
     }
@@ -87,12 +84,9 @@ window.addEventListener("mouseup", function (mouseEvent) {
 
 		var colors = document.getElementsByClassName('color-button');
 	    for (var i = 0; i < colors.length; i++) {
-	      console.log(colors[i].jscolor.toString());
 
 	      //if picked color matches this color
 	      if (newColor == colors[i].jscolor.toString()) {
-	        console.log('color found');
-
 	        //remove current color selection
 	        var selectedColor = document.querySelector("#colors-menu li.selected")
 	        if (selectedColor) selectedColor.classList.remove("selected");
@@ -111,7 +105,6 @@ window.addEventListener("mouseup", function (mouseEvent) {
 	    }
 	}
 	else if (currentTool.name == 'fill' && mouseEvent.target.className == 'drawingCanvas') {
-	  	//console.log('filling')
 
 		//get cursor postion
 		var cursorLocation = getCursorPosition(mouseEvent);
@@ -341,7 +334,6 @@ function draw (mouseEvent) {
     else if (currentTool.name == 'rectselect') {
     	if (dragging && !isRectSelecting && mouseEvent.target.className == 'drawingCanvas') {
     		isRectSelecting = true;
-    		console.log("cominciata selezione su " + mouseEvent.target.className);
     		startRectSelection(mouseEvent);
     	}
     	else if (dragging && isRectSelecting) {