mirror/pixel-editor
1
0
Fork 0
mirror of https://github.com/lospec/pixel-editor.git synced 2023-08-10 21:12:51 +03:00
Code Issues Projects Releases Wiki Activity

Removed global dragging variable

Browse Source 
The "dragging" variable is now handled in Input.js
This commit is contained in:
unsettledgames
2021-07-22 15:21:48 +02:00
parent b959a70f55
commit 0d7a00c62f
3 changed files with 17 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
js/_mouseEvents.js
View File

@ -14,7 +14,6 @@ window.addEventListener("mousedown", function (mouseEvent) {
lastMouseClickPos = getCursorPosition(mouseEvent); lastMouseClickPos = getCursorPosition(mouseEvent);
dragging = true;
//left or right click ? //left or right click ?
if (mouseEvent.which == 1) { if (mouseEvent.which == 1) {
if (Input.spacePressed()) if (Input.spacePressed())
@ -169,7 +168,6 @@ window.addEventListener("mouseup", function (mouseEvent) {
currentLayer.updateLayerPreview(); currentLayer.updateLayerPreview();
} }
dragging = false;
currentTool = currentToolTemp; currentTool = currentToolTemp;
currentTool.updateCursor(); currentTool.updateCursor();
@ -229,7 +227,7 @@ function draw (mouseEvent) {
brushPreview.style.visibility = 'hidden'; brushPreview.style.visibility = 'hidden';
//draw line to current pixel //draw line to current pixel
if (dragging) { if (Input.isDragging()) {
if (mouseEvent.target.className == 'drawingCanvas' || mouseEvent.target.className == 'drawingCanvas') { if (mouseEvent.target.className == 'drawingCanvas' || mouseEvent.target.className == 'drawingCanvas') {
line(Math.floor(lastMouseClickPos[0]/zoom), line(Math.floor(lastMouseClickPos[0]/zoom),
Math.floor(lastMouseClickPos[1]/zoom), Math.floor(lastMouseClickPos[1]/zoom),
@ -260,7 +258,7 @@ function draw (mouseEvent) {
brushPreview.style.visibility = 'hidden'; brushPreview.style.visibility = 'hidden';
//draw line to current pixel //draw line to current pixel
if (dragging) { if (Input.isDragging()) {
if (mouseEvent.target.className == 'drawingCanvas' || mouseEvent.target.className == 'drawingCanvas') { if (mouseEvent.target.className == 'drawingCanvas' || mouseEvent.target.className == 'drawingCanvas') {
line(Math.floor(lastMouseClickPos[0]/zoom),Math.floor(lastMouseClickPos[1]/zoom),Math.floor(cursorLocation[0]/zoom),Math.floor(cursorLocation[1]/zoom), currentTool.brushSize); line(Math.floor(lastMouseClickPos[0]/zoom),Math.floor(lastMouseClickPos[1]/zoom),Math.floor(cursorLocation[0]/zoom),Math.floor(cursorLocation[1]/zoom), currentTool.brushSize);
lastMouseClickPos = cursorLocation; lastMouseClickPos = cursorLocation;
@ -277,10 +275,10 @@ function draw (mouseEvent) {
else else
brushPreview.style.visibility = 'hidden'; brushPreview.style.visibility = 'hidden';
if (!isDrawingRect && dragging) { if (!isDrawingRect && Input.isDragging()) {
startRectDrawing(mouseEvent); startRectDrawing(mouseEvent);
} }
else if (dragging){ else if (Input.isDragging()){
updateRectDrawing(mouseEvent); updateRectDrawing(mouseEvent);
} }
} }
@ -292,14 +290,14 @@ function draw (mouseEvent) {
else else
brushPreview.style.visibility = 'hidden'; brushPreview.style.visibility = 'hidden';
if (!isDrawingEllipse && dragging) { if (!isDrawingEllipse && Input.isDragging()) {
startEllipseDrawing(mouseEvent); startEllipseDrawing(mouseEvent);
} }
else if (dragging){ else if (Input.isDragging()){
updateEllipseDrawing(mouseEvent); updateEllipseDrawing(mouseEvent);
} }
} }
else if (currentTool.name == 'pan' && dragging) { else if (currentTool.name == 'pan' && Input.isDragging()) {
// Setting first layer position // Setting first layer position
layers[0].setCanvasOffset(layers[0].canvas.offsetLeft + (cursorLocation[0] - lastMouseClickPos[0]), layers[0].canvas.offsetTop + (cursorLocation[1] - lastMouseClickPos[1])); layers[0].setCanvasOffset(layers[0].canvas.offsetLeft + (cursorLocation[0] - lastMouseClickPos[0]), layers[0].canvas.offsetTop + (cursorLocation[1] - lastMouseClickPos[1]));
// Copying that position to the other layers // Copying that position to the other layers
@ -310,7 +308,7 @@ function draw (mouseEvent) {
lastMouseMovePos = getCursorPosition(mouseEvent); lastMouseMovePos = getCursorPosition(mouseEvent);
cursorLocation = lastMouseMovePos; cursorLocation = lastMouseMovePos;
} }
else if (currentTool.name == 'eyedropper' && dragging && mouseEvent.target.className == 'drawingCanvas') { else if (currentTool.name == 'eyedropper' && Input.isDragging() && mouseEvent.target.className == 'drawingCanvas') {
const selectedColor = getEyedropperColor(cursorLocation); const selectedColor = getEyedropperColor(cursorLocation);
const rgbColor = {r:selectedColor[0],g:selectedColor[1],b:selectedColor[2]}; const rgbColor = {r:selectedColor[0],g:selectedColor[1],b:selectedColor[2]};
@ -327,7 +325,7 @@ function draw (mouseEvent) {
if (colorLightness>127) eyedropperPreview.classList.remove('dark'); if (colorLightness>127) eyedropperPreview.classList.remove('dark');
else eyedropperPreview.classList.add('dark'); else eyedropperPreview.classList.add('dark');
} }
else if (currentTool.name == 'resizebrush' && dragging) { else if (currentTool.name == 'resizebrush' && Input.isDragging()) {
//get new brush size based on x distance from original clicking location //get new brush size based on x distance from original clicking location
var distanceFromClick = cursorLocation[0] - lastMouseClickPos[0]; var distanceFromClick = cursorLocation[0] - lastMouseClickPos[0];
//var roundingAmount = 20 - Math.round(distanceFromClick/10); //var roundingAmount = 20 - Math.round(distanceFromClick/10);
@ -342,7 +340,7 @@ function draw (mouseEvent) {
tool.pencil.moveBrushPreview(lastMouseClickPos); tool.pencil.moveBrushPreview(lastMouseClickPos);
currentTool.updateCursor(); currentTool.updateCursor();
} }
else if (currentTool.name == 'resizeeraser' && dragging) { else if (currentTool.name == 'resizeeraser' && Input.isDragging()) {
//get new brush size based on x distance from original clicking location //get new brush size based on x distance from original clicking location
var distanceFromClick = cursorLocation[0] - lastMouseClickPos[0]; var distanceFromClick = cursorLocation[0] - lastMouseClickPos[0];
//var roundingAmount = 20 - Math.round(distanceFromClick/10); //var roundingAmount = 20 - Math.round(distanceFromClick/10);
@ -357,7 +355,7 @@ function draw (mouseEvent) {
tool.eraser.moveBrushPreview(lastMouseClickPos); tool.eraser.moveBrushPreview(lastMouseClickPos);
currentTool.updateCursor(); currentTool.updateCursor();
} }
else if (currentTool.name == 'resizerectangle' && dragging) { else if (currentTool.name == 'resizerectangle' && Input.isDragging()) {
//get new brush size based on x distance from original clicking location //get new brush size based on x distance from original clicking location
var distanceFromClick = cursorLocation[0] - lastMouseClickPos[0]; var distanceFromClick = cursorLocation[0] - lastMouseClickPos[0];
//var roundingAmount = 20 - Math.round(distanceFromClick/10); //var roundingAmount = 20 - Math.round(distanceFromClick/10);
@ -375,7 +373,7 @@ function draw (mouseEvent) {
tool.rectangle.moveBrushPreview(lastMouseClickPos); tool.rectangle.moveBrushPreview(lastMouseClickPos);
currentTool.updateCursor(); currentTool.updateCursor();
} }
else if (currentTool.name == 'resizeline' && dragging) { else if (currentTool.name == 'resizeline' && Input.isDragging()) {
//get new brush size based on x distance from original clicking location //get new brush size based on x distance from original clicking location
var distanceFromClick = cursorLocation[0] - lastMouseClickPos[0]; var distanceFromClick = cursorLocation[0] - lastMouseClickPos[0];
//var roundingAmount = 20 - Math.round(distanceFromClick/10); //var roundingAmount = 20 - Math.round(distanceFromClick/10);
@ -391,11 +389,11 @@ function draw (mouseEvent) {
currentTool.updateCursor(); currentTool.updateCursor();
} }
else if (currentTool.name == 'rectselect') { else if (currentTool.name == 'rectselect') {
if (dragging && !isRectSelecting && mouseEvent.target.className == 'drawingCanvas') { if (Input.isDragging() && !isRectSelecting && mouseEvent.target.className == 'drawingCanvas') {
isRectSelecting = true; isRectSelecting = true;
startRectSelection(mouseEvent); startRectSelection(mouseEvent);
} }
else if (dragging && isRectSelecting) { else if (Input.isDragging() && isRectSelecting) {
updateRectSelection(mouseEvent); updateRectSelection(mouseEvent);
} }
else if (isRectSelecting) { else if (isRectSelecting) {
@ -407,7 +405,7 @@ function draw (mouseEvent) {
currentTool.updateCursor(); currentTool.updateCursor();
// If I'm dragging, I move the preview // If I'm dragging, I move the preview
if (dragging && cursorInSelectedArea()) { if (Input.isDragging() && cursorInSelectedArea()) {
updateMovePreview(getCursorPosition(mouseEvent)); updateMovePreview(getCursorPosition(mouseEvent));
} }
} }
@ -417,7 +415,7 @@ function draw (mouseEvent) {
} else { } else {
brushPreview.style.visibility = 'hidden'; brushPreview.style.visibility = 'hidden';
} }
if (dragging) { if (Input.isDragging()) {
if (mouseEvent.target.className == 'drawingCanvas' || mouseEvent.target.className == 'drawingCanvas') { if (mouseEvent.target.className == 'drawingCanvas' || mouseEvent.target.className == 'drawingCanvas') {
diagLine(lastMouseClickPos, zoom, cursorLocation); diagLine(lastMouseClickPos, zoom, cursorLocation);
} }

1
js/_variables.js
View File

@ -1,7 +1,6 @@
//init variables //init variables
var canvasSize; // REFACTOR: Canvas class / getCanvasSize method var canvasSize; // REFACTOR: Canvas class / getCanvasSize method
var zoom = 7; // REFACTOR: EditorState class/IIFE? var zoom = 7; // REFACTOR: EditorState class/IIFE?
var dragging = false; // REFACTOR: Input IIFE via getter?
var lastMouseClickPos = [0,0]; // REFACTOR: Input IIFE via getter? var lastMouseClickPos = [0,0]; // REFACTOR: Input IIFE via getter?
var documentCreated = false; // REFACTOR: EditorState var documentCreated = false; // REFACTOR: EditorState

2
js/tools/_all.js
View File

@ -24,7 +24,7 @@ new Tool('resizeline', {
new Tool('pan', { new Tool('pan', {
cursor: function () { cursor: function () {
if (dragging) return 'url(\'/pixel-editor/pan-held.png\'), auto'; if (Input.isDragging()) return 'url(\'/pixel-editor/pan-held.png\'), auto';
else return 'url(\'/pixel-editor/pan.png\'), auto'; else return 'url(\'/pixel-editor/pan.png\'), auto';
}, },
}); });