Added eraser resize when right clicking while having the eraser tool selected.

Signed-off-by: npalomba <nicola.palomba@studenti.galileilivorno.gov.it>
This commit is contained in:
npalomba 2019-04-02 19:42:28 +02:00
parent f6b1e3ce5b
commit 46bd6a8adb
3 changed files with 35 additions and 13 deletions

View File

@ -27,7 +27,11 @@ window.addEventListener("mousedown", function (mouseEvent) {
} }
else if (currentTool == 'pencil' && mouseEvent.which == 3) { else if (currentTool == 'pencil' && mouseEvent.which == 3) {
currentTool = 'resize-brush'; currentTool = 'resize-brush';
prevBrushSize=brushSize; prevBrushSize = brushSize;
}
else if (currentTool == 'eraser' && mouseEvent.which == 3) {
currentTool = 'resize-eraser';
prevEraserSize = eraserSize;
} }
if (currentTool == 'eyedropper' && mouseEvent.target == currentLayer.canvas) if (currentTool == 'eyedropper' && mouseEvent.target == currentLayer.canvas)
@ -214,6 +218,23 @@ function draw (mouseEvent) {
brushPreview.style.left = lastPos[0] + currentLayer.canvas.offsetLeft - brushSize * zoom / 2 + 'px'; brushPreview.style.left = lastPos[0] + currentLayer.canvas.offsetLeft - brushSize * zoom / 2 + 'px';
brushPreview.style.top = lastPos[1] + currentLayer.canvas.offsetTop - brushSize * zoom / 2 + 'px'; brushPreview.style.top = lastPos[1] + currentLayer.canvas.offsetTop - brushSize * zoom / 2 + 'px';
updateCursor();
}
else if (currentTool == 'resize-eraser' && dragging) {
//get new brush size based on x distance from original clicking location
var distanceFromClick = cursorLocation[0] - lastPos[0];
//var roundingAmount = 20 - Math.round(distanceFromClick/10);
//this doesnt work in reverse... because... it's not basing it off of the brush size which it should be
var eraserSizeChange = Math.round(distanceFromClick/10);
var newEraserSizeChange = prevEraserSize + eraserSizeChange;
//set the brush to the new size as long as its bigger than 1
eraserSize = Math.max(1,newEraserSizeChange);
//fix offset so the cursor stays centered
brushPreview.style.left = lastPos[0] + currentLayer.canvas.offsetLeft - eraserSize * zoom / 2 + 'px';
brushPreview.style.top = lastPos[1] + currentLayer.canvas.offsetTop - eraserSize * zoom / 2 + 'px';
updateCursor(); updateCursor();
} }
} }

View File

@ -6,7 +6,7 @@ function updateCursor () {
brushPreview.style.display = 'block'; brushPreview.style.display = 'block';
brushPreview.style.width = brushSize * zoom + 'px'; brushPreview.style.width = brushSize * zoom + 'px';
brushPreview.style.height = brushSize * zoom + 'px'; brushPreview.style.height = brushSize * zoom + 'px';
} else if (currentTool == 'eraser') { } else if (currentTool == 'eraser' || currentTool == 'resize-eraser') {
// Size management for the eraser // Size management for the eraser
console.log("Eraser size: " + eraserSize); console.log("Eraser size: " + eraserSize);
canvasView.style.cursor = 'crosshair'; canvasView.style.cursor = 'crosshair';
@ -33,6 +33,6 @@ function updateCursor () {
if (currentTool == 'zoom') if (currentTool == 'zoom')
canvasView.style.cursor = "url('/pixel-editor/zoom-in.png'), auto"; canvasView.style.cursor = "url('/pixel-editor/zoom-in.png'), auto";
if (currentTool == 'resize-brush') if (currentTool == 'resize-brush' || currentTool == 'resize-eraser')
canvasView.style.cursor = 'default'; canvasView.style.cursor = 'default';
} }

View File

@ -7,6 +7,7 @@ var currentToolTemp = 'pencil';
var brushSize = 1; var brushSize = 1;
var eraserSize = 1; var eraserSize = 1;
var prevBrushSize = 1; var prevBrushSize = 1;
var prevEraserSize = 1;
var dialogueOpen = false; var dialogueOpen = false;
var documentCreated = false; var documentCreated = false;