Added correct cursor to move tool

Added _move.js to handle the selection movement, added cursor managemente for that tool. Found a bug in the imagedata part, it is currently blank.

js/_mouseEvents.js

@@ -1,6 +1,9 @@
+var currentMouseEvent;
 
 //mousedown - start drawing
 window.addEventListener("mousedown", function (mouseEvent) {
+	// Saving the event in case something else needs it
+	currentMouseEvent = mouseEvent;
 	
 	//if no document has been created yet, or this is a dialog open
 	if (!documentCreated || dialogueOpen) return;
@@ -44,6 +47,8 @@ window.addEventListener("mousedown", function (mouseEvent) {
 
 //mouseup - end drawing
 window.addEventListener("mouseup", function (mouseEvent) {
+	// Saving the event in case something else needs it
+	currentMouseEvent = mouseEvent;
 
 	closeMenu();
 	
@@ -125,6 +130,9 @@ window.addEventListener("mouseup", function (mouseEvent) {
 //mouse is moving on canvas		
 window.addEventListener("mousemove", draw, false);
 function draw (mouseEvent) {
+	// Saving the event in case something else needs it
+	currentMouseEvent = mouseEvent;
+
 	var cursorLocation = getCursorPosition(mouseEvent);
 	
 	//if a document hasnt yet been created, exit this function
@@ -247,6 +255,11 @@ function draw (mouseEvent) {
     		updateRectSelection(mouseEvent);
     	}
     }
+    else if (currentTool == 'moveselection') {
+    	console.log("Aggiorno il cursore");
+    	updateCursor();
+    	updateMovePreview();
+    }
 }
 
 //mousewheel scrroll

js/_move.js

@@ -1 +1,5 @@
 var imageDataToMove;
+
+function updateMovePreview() {
+	
+}

js/_rectSelect.js

@@ -1,6 +1,8 @@
 var isRectSelecting = false;
 let startX;
 let startY;
+let endX;
+let endY;
 let workingLayer;
 let imageData;
 
@@ -29,13 +31,24 @@ function updateRectSelection(mouseEvent) {
 function endRectSelection(mouseEvent) {
 	// Getting the end position
 	let currentPos = getCursorPosition(mouseEvent);
-	let x = currentPos[0] / zoom;
+	endX = currentPos[0] / zoom;
-	let y = currentPos[1] / zoom;
+	endY = currentPos[1] / zoom;
 
 	// Putting the vfx layer behind everything
 	isRectSelecting = false;
 	// Getting the selected pixels
-	imageData = currentLayer.context.createImageData(x - startX, y - startY);
+	imageData = currentLayer.context.createImageData(endX - startX, endY - startY);
+
+	// Selecting the move tool
+	currentTool = 'moveselection';
+	currentToolTemp = currentTool;
+	// Updating the cursor 
+	updateCursor();
+
+	// TODO: find out why the imagedata is blank
+	for (i=0; i<imageData.data.length; i++) {
+		console.log("rgba(" + imageData.data[i] + ',' + imageData.data[i + 1] + ',' + imageData.data[i + 2] + ','  + imageData.data[i + 3] + ')');
+	}
 
 	// NOW
 	// Select the move tool
@@ -48,7 +61,7 @@ function endRectSelection(mouseEvent) {
 			// the image data must be copied to a temporary layer
 			// the image data is added to the original layer when the move tool is disabled
 
-	workingLayer.context.putImageData(imageData, startX, startY);
+	currentLayer.context.putImageData(imageData, startX, startY);
 }
 
 function drawRect(x, y) {
@@ -73,3 +86,26 @@ function drawRect(x, y) {
 function applyChanges() {
 	VFXCanvas.style.zIndex = MIN_Z_INDEX;
 }
+
+// Checks whether the pointer is inside the selected area or not
+function cursorInSelectedArea() {
+	let cursorPos = getCursorPosition(currentMouseEvent);
+	let x = cursorPos[0] / zoom;
+	let y = cursorPos[1] / zoom;
+
+	let leftX = Math.min(startX, endX);
+	let rightX = Math.max(startX, endX);
+	let topY = Math.max(startY, endY);
+	let bottomY = Math.min(startY, endY);
+
+	// ISSUE: is it <= or <? test it
+	if (leftX <= x && x <= rightX) {
+		if (bottomY <= y && y <= topY) {
+			return true;
+		}
+
+		return false;
+	}
+
+	return false;
+}

js/_updateCursor.js

@@ -11,7 +11,18 @@ function updateCursor () {
         brushPreview.style.display = 'block';
         brushPreview.style.width = eraserSize * zoom + 'px';
         brushPreview.style.height = eraserSize * zoom + 'px';
-	} else
+	} else if (currentTool == 'moveselection') {
+		if (cursorInSelectedArea()) {
+			canvasView.style.cursor = 'move';
+			brushPreview.style.display = 'none';
+		}
+		else {
+			canvasView.style.cursor = 'crosshair';
+		}
+	}
+	else if (currentTool == 'rectselect')
+		canvasView.style.cursor = 'crosshair';
+	else
 		brushPreview.style.display = 'none';
 	
 	if (currentTool == 'eyedropper') {
@@ -33,6 +44,4 @@ function updateCursor () {
 		
 	if (currentTool == 'resize-brush' || currentTool == 'resize-eraser')
 		canvasView.style.cursor = 'default';
-	if (currentTool == 'rectselect')
-		canvasView.style.cursor = 'crosshair';
 }