mirror of
https://github.com/lospec/pixel-editor.git
synced 2023-08-10 21:12:51 +03:00
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.
This commit is contained in:
parent
944cf1fbed
commit
12e43e0449
@ -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
|
||||
clipBoardData = currentLayer.context.getImageData(startX, startY, endX - startX + 1, endY - startY + 1);
|
||||
// Saving the canvas
|
||||
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);
|
||||
}
|
||||
|
||||
|
||||
// Moving those pixels from the current layer to the tmp layer
|
||||
//TMPLayer.context.putImageData(imageDataToMove, startX + 1, startY);
|
||||
|
||||
|
@ -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()
|
||||
}
|
||||
}
|
||||
|
@ -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;
|
||||
}
|
@ -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
|
||||
|
@ -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");
|
||||
//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();
|
||||
|
Loading…
Reference in New Issue
Block a user