Continued cut -> paste implementation

There's only a bug, when pasting consecutively, every time it cuts the area again. There's probably some weird cut call somewhere.

js/_copyPaste.js

@@ -1,19 +1,66 @@
 let clipboardData;
+let isPasting = false;
+
+let copiedStartX;
+let copiedStartY;
+let copiedEndX;
+let copiedEndY;
 
 function copySelection() {
+	/*
+	copiedEndX = endX;
+	copiedEndY = endY;
 
+	copiedStartX = startX;
+	copiedStartY = startY;
+*/
+	// Getting the selected pixels
+	clipboardData = currentLayer.context.getImageData(startX, startY, endX - startX + 1, endY - startY + 1);
 }
 
 function pasteSelection() {
+	isPasting = true;
+	// Putting the image data on the tmp layer
+	TMPLayer.context.putImageData(clipboardData, copiedStartX, copiedStartY);
+
+	// Setting up the move tool to move the pasted value
+	selectionCanceled = false;
 	imageDataToMove = clipboardData;
-	updateMovePreview();
+	firstTimeMove = false;
+	isRectSelecting = false;
+
+	// Switching to the move tool
+	tool.moveselection.switchTo();
+	// Updating the rectangle preview
+	moveSelection(
+		copiedStartX + (copiedEndX - copiedStartX) / 2, 
+		copiedStartY + (copiedEndY - copiedStartY) / 2, 
+		imageDataToMove.width, imageDataToMove.height); 
+	//drawRect(copiedStartX, copiedEndX, copiedStartY, copiedEndY);
 }
 
 function cutSelectionTool() {
-	// Getting the selected pixels
+	// Saving the canvas
-	clipBoardData = currentLayer.context.getImageData(startX, startY, endX - startX + 1, endY - startY + 1);
+    new HistoryStateEditCanvas();
+
+	copiedEndX = endX;
+	copiedEndY = endY;
+
+	copiedStartX = startX;
+	copiedStartY = startY;
+
+	// Getting the selected pixels
+	if (imageDataToMove !== undefined) {
+		clipboardData = imageDataToMove;
+		TMPLayer.context.clearRect(0, 0, TMPLayer.canvas.width, TMPLayer.canvas.height);
+		imageDataToMove = undefined;
+	}
+	else {
+		clipboardData = currentLayer.context.getImageData(startX, startY, endX - startX + 1, endY - startY + 1);
+		currentLayer.context.clearRect(startX - 0.5, startY - 0.5, endX - startX + 1, endY - startY + 1);
+	}
+
 	
-	currentLayer.context.clearRect(startX - 0.5, startY - 0.5, endX - startX + 1, endY - startY + 1);
 	// Moving those pixels from the current layer to the tmp layer
 	//TMPLayer.context.putImageData(imageDataToMove, startX + 1, startY);
 

js/_hotkeyListener.js

@@ -7,13 +7,14 @@ var spacePressed = false;
 		- Pressing ctrl+v ends the current selection and copies the clipboard in the tmp layer:
 			the editor enters move mode and lets the user move the copied selection around.
 			Pressing ctrl+v while moving a copy has the same effect of pressing ctrl+v after a ctrl+c
-		- Pressing ctrl+x cuts the selection and stores it in the clipboard
 		- The behaviour of ctrl+v is the same and doesn't depend on how the selected area was obtained
 			(with ctrl+c or with ctrl+v)
 		- Selecting a different tool while moving the copied or cut selection has the same effect of selecting 
 			a different tool while moving a standard selection
-		- You can't paste while dragging
 		- You can paste at any other time
+
+	BUGS:
+		- 
 */ 
 
 function KeyPress(e) {
@@ -30,7 +31,6 @@ function KeyPress(e) {
 	//
 	if (e.key === "Escape") {
 		if (!selectionCanceled) {
-			endSelection();
 			tool.pencil.switchTo();
 		}
 	}
@@ -83,7 +83,6 @@ function KeyPress(e) {
 				console.log("Cutting");
 				if (keyboardEvent.ctrlKey && !dragging && currentTool.name == 'moveselection') {
 					cutSelectionTool();
-					endSelection();
 					tool.pencil.switchTo();
 				}
 				break;
@@ -94,14 +93,12 @@ function KeyPress(e) {
 			  if (keyboardEvent.altKey && keyboardEvent.ctrlKey)
 			    redo();
 				if (!selectionCanceled) {
-			    		endSelection();
 			    		tool.pencil.switchTo()
 			    	}
 			  //CTRL+Z undo
 			  else if (keyboardEvent.ctrlKey) {
 			    	undo();
 			    	if (!selectionCanceled) {
-			    		endSelection();
 			    		tool.pencil.switchTo()
 			    	}
 			    }

js/_move.js

@@ -63,10 +63,14 @@ function endSelection() {
                 Math.round(lastMovePos[0] / zoom - imageDataToMove.width / 2), 
                 Math.round(lastMovePos[1] / zoom - imageDataToMove.height / 2));
         }
+        else {
+            undo();
+        }
     }
 
     selectionCanceled = true;
     isRectSelecting = false;
     firstTimeMove = true;
     imageDataToMove = undefined;
+    isPasting = false;
 }

js/_rectSelect.js

@@ -76,7 +76,6 @@ function cutSelection(mousePosition) {
 	console.log("Coordinate: start x, y: " + startX + ", " + startY + " end x, y: " + endX + ", " + endY);
 	// Getting the selected pixels
 	imageDataToMove = currentLayer.context.getImageData(startX, startY, endX - startX + 1, endY - startY + 1);
-    clipBoardData = imageDataToMove;
     
 	currentLayer.context.clearRect(startX - 0.5, startY - 0.5, endX - startX + 1, endY - startY + 1);
 	// Moving those pixels from the current layer to the tmp layer

js/_tools.js

@@ -58,8 +58,11 @@ class Tool {
 		    tools[i].classList.remove("selected");
 		}
 
-	    //give the button of the selected tool the .selected class
+		let buttonNode = document.getElementById(this.name + "-button");
-		document.getElementById(this.name+"-button").parentNode.classList.add("selected");
+	    //give the button of the selected tool the .selected class if the tool has a button
+	    if(buttonNode != null && buttonNode.parentNode != null) {
+			document.getElementById(this.name+"-button").parentNode.classList.add("selected");
+		}
 
 		//change cursor
 		this.updateCursor();