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

Fixed bugs in the already implemented history states, added state for moving layers

Browse Source 
Since the states were recycling the same functions, a brand new state was saved when redoing, so that undoing was impossible.
This commit is contained in:
unsettledgames 2020-06-24 13:30:24 +02:00
parent 74a8ee0988
commit 3dbd7fbb1a
2 changed files with 39 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
js/_history.js
View File

@ -23,11 +23,23 @@ function HistoryStateDeleteLayer() {
} }
function HistoryStateMoveLayer() { function HistoryStateMoveLayer(layer1, layer2) {
this.layer1 = layer1;
this.layer2 = layer2;
this.undo = function() {
swapLayerEntries(layer1, layer2, false);
redoStates.push(this);
};
this.redo = function() {
swapLayerEntries(layer1, layer2, false);
undoStates.push(this);
};
saveHistoryState(this);
} }
//TODO: finisci
function HistoryStateAddLayer(layerData) { function HistoryStateAddLayer(layerData) {
this.added = layerData; this.added = layerData;
@ -40,8 +52,7 @@ function HistoryStateAddLayer(layerData) {
}; };
this.redo = function() { this.redo = function() {
undoStates.push(this); addLayer(layerData.id, false);
addLayer();
}; };
saveHistoryState(this); saveHistoryState(this);
@ -53,7 +64,6 @@ function HistoryStateEditCanvas () {
this.layerID = currentLayer.id; this.layerID = currentLayer.id;
this.undo = function () { this.undo = function () {
var stateLayer = getLayerByID(this.layerID); var stateLayer = getLayerByID(this.layerID);
var currentCanvas = stateLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]); var currentCanvas = stateLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
stateLayer.context.putImageData(this.canvasState, 0, 0); stateLayer.context.putImageData(this.canvasState, 0, 0);
@ -65,7 +75,7 @@ function HistoryStateEditCanvas () {
}; };
this.redo = function () { this.redo = function () {
console.log("YEET");
var stateLayer = getLayerByID(this.layerID); var stateLayer = getLayerByID(this.layerID);
var currentCanvas = stateLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]); var currentCanvas = stateLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
@ -74,7 +84,7 @@ function HistoryStateEditCanvas () {
this.canvasState = currentCanvas; this.canvasState = currentCanvas;
undoStates.push(this); undoStates.push(this);
currentLayer.updateLayerPreview(); stateLayer.updateLayerPreview();
}; };
//add self to undo array //add self to undo array

26
js/_layer.js
View File

@ -127,6 +127,13 @@ class Layer {
this.context.mozImageSmoothingEnabled = false; this.context.mozImageSmoothingEnabled = false;
} }
setID(id) {
this.id = id;
if (this.menuEntry != null) {
this.menuEntry.id = id;
}
}
layerDragStart(element) { layerDragStart(element) {
layerDragSource = this; layerDragSource = this;
element.dataTransfer.effectAllowed = 'move'; element.dataTransfer.effectAllowed = 'move';
@ -434,8 +441,8 @@ function renameLayer(event) {
isRenamingLayer = true; isRenamingLayer = true;
} }
// Swap two layer entries in the layer menu // Swaps two layer entries in the layer menu
function swapLayerEntries(id1, id2) { function swapLayerEntries(id1, id2, saveHistory = true) {
let entry1 = document.getElementById(id1); let entry1 = document.getElementById(id1);
let entry2 = document.getElementById(id2); let entry2 = document.getElementById(id2);
@ -462,6 +469,10 @@ function swapLayerEntries(id1, id2) {
} else { } else {
parent.appendChild(entry1); parent.appendChild(entry1);
} }
if (saveHistory) {
new HistoryStateMoveLayer(id1, id2);
}
} }
// Finds a layer given its name // Finds a layer given its name
@ -490,7 +501,7 @@ function getLayerByID(id) {
return null; return null;
} }
function addLayer() { function addLayer(id, saveHistory = true) {
// Creating a new canvas // Creating a new canvas
let newCanvas = document.createElement("canvas"); let newCanvas = document.createElement("canvas");
// Setting up the new canvas // Setting up the new canvas
@ -518,5 +529,12 @@ function addLayer() {
// Insert it before the Add layer button // Insert it before the Add layer button
layerList.insertBefore(toAppend, layerList.childNodes[0]); layerList.insertBefore(toAppend, layerList.childNodes[0]);
new HistoryStateAddLayer(newLayer);
if (id != null) {
newLayer.setID(id);
}
// Basically "if I'm not adding a layer because redo() is telling meto do so", then I can save the history
if (saveHistory) {
new HistoryStateAddLayer(newLayer);
}
} }