mirror of
https://github.com/lospec/pixel-editor.git
synced 2023-08-10 21:12:51 +03:00
Apply eslint --fix and fix indentation
This commit is contained in:
Theo Cavignac
committed by
Théo (Lattay) Cavignac
Théo (Lattay) Cavignac
parent
4123c069e2
commit
6f84b5dfc8
328
js/_history.js
328
js/_history.js
@@ -5,194 +5,194 @@ const undoLogStyle = 'background: #87ff1c; color: black; padding: 5px;';
|
||||
|
||||
//prototype for undoing canvas changes
|
||||
function HistoryStateEditCanvas () {
|
||||
this.canvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
|
||||
this.undo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
redoStates.push(this);
|
||||
}
|
||||
|
||||
this.redo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
undoStates.push(this);
|
||||
}
|
||||
|
||||
//add self to undo array
|
||||
saveHistoryState(this);
|
||||
this.canvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
|
||||
this.undo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
redoStates.push(this);
|
||||
};
|
||||
|
||||
this.redo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
undoStates.push(this);
|
||||
};
|
||||
|
||||
//add self to undo array
|
||||
saveHistoryState(this);
|
||||
}
|
||||
|
||||
//prototype for undoing added colors
|
||||
function HistoryStateAddColor (colorValue) {
|
||||
this.colorValue = colorValue;
|
||||
|
||||
this.undo = function () {
|
||||
redoStates.push(this);
|
||||
deleteColor(this.colorValue);
|
||||
}
|
||||
|
||||
this.redo = function () {
|
||||
addColor(this.colorValue);
|
||||
undoStates.push(this);
|
||||
}
|
||||
|
||||
//add self to undo array
|
||||
saveHistoryState(this);
|
||||
this.colorValue = colorValue;
|
||||
|
||||
this.undo = function () {
|
||||
redoStates.push(this);
|
||||
deleteColor(this.colorValue);
|
||||
};
|
||||
|
||||
this.redo = function () {
|
||||
addColor(this.colorValue);
|
||||
undoStates.push(this);
|
||||
};
|
||||
|
||||
//add self to undo array
|
||||
saveHistoryState(this);
|
||||
}
|
||||
|
||||
//prototype for undoing deleted colors
|
||||
function HistoryStateDeleteColor (colorValue) {
|
||||
this.colorValue = colorValue;
|
||||
this.canvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
|
||||
this.undo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
addColor(this.colorValue);
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
redoStates.push(this);
|
||||
}
|
||||
|
||||
this.redo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
deleteColor(this.colorValue);
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
undoStates.push(this);
|
||||
}
|
||||
|
||||
//add self to undo array
|
||||
saveHistoryState(this);
|
||||
this.colorValue = colorValue;
|
||||
this.canvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
|
||||
this.undo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
addColor(this.colorValue);
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
redoStates.push(this);
|
||||
};
|
||||
|
||||
this.redo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
deleteColor(this.colorValue);
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
undoStates.push(this);
|
||||
};
|
||||
|
||||
//add self to undo array
|
||||
saveHistoryState(this);
|
||||
}
|
||||
|
||||
//prototype for undoing colors edits
|
||||
function HistoryStateEditColor (newColorValue, oldColorValue) {
|
||||
this.newColorValue = newColorValue;
|
||||
this.oldColorValue = oldColorValue;
|
||||
this.canvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
|
||||
this.undo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
//find new color in palette and change it back to old color
|
||||
var colors = document.getElementsByClassName('color-button');
|
||||
for (var i = 0; i < colors.length; i++) {
|
||||
console.log(newColorValue, '==', colors[i].jscolor.toString())
|
||||
if (newColorValue == colors[i].jscolor.toString()) {
|
||||
colors[i].jscolor.fromString(oldColorValue);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
redoStates.push(this);
|
||||
}
|
||||
|
||||
this.redo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
//find old color in palette and change it back to new color
|
||||
var colors = document.getElementsByClassName('color-button');
|
||||
for (var i = 0; i < colors.length; i++) {
|
||||
console.log(oldColorValue, '==', colors[i].jscolor.toString())
|
||||
if (oldColorValue == colors[i].jscolor.toString()) {
|
||||
colors[i].jscolor.fromString(newColorValue);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
undoStates.push(this);
|
||||
}
|
||||
|
||||
//add self to undo array
|
||||
saveHistoryState(this);
|
||||
this.newColorValue = newColorValue;
|
||||
this.oldColorValue = oldColorValue;
|
||||
this.canvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
|
||||
this.undo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
//find new color in palette and change it back to old color
|
||||
var colors = document.getElementsByClassName('color-button');
|
||||
for (var i = 0; i < colors.length; i++) {
|
||||
console.log(newColorValue, '==', colors[i].jscolor.toString());
|
||||
if (newColorValue == colors[i].jscolor.toString()) {
|
||||
colors[i].jscolor.fromString(oldColorValue);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
redoStates.push(this);
|
||||
};
|
||||
|
||||
this.redo = function () {
|
||||
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
|
||||
currentLayer.context.putImageData(this.canvas, 0, 0);
|
||||
|
||||
//find old color in palette and change it back to new color
|
||||
var colors = document.getElementsByClassName('color-button');
|
||||
for (var i = 0; i < colors.length; i++) {
|
||||
console.log(oldColorValue, '==', colors[i].jscolor.toString());
|
||||
if (oldColorValue == colors[i].jscolor.toString()) {
|
||||
colors[i].jscolor.fromString(newColorValue);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.canvas = currentCanvas;
|
||||
undoStates.push(this);
|
||||
};
|
||||
|
||||
//add self to undo array
|
||||
saveHistoryState(this);
|
||||
}
|
||||
|
||||
|
||||
//rename to add undo state
|
||||
function saveHistoryState (state) {
|
||||
console.log('%csaving history state', undoLogStyle)
|
||||
console.log(state)
|
||||
console.log('%csaving history state', undoLogStyle);
|
||||
console.log(state);
|
||||
|
||||
//get current canvas data and save to undoStates array
|
||||
undoStates.push(state);
|
||||
|
||||
//limit the number of states to settings.numberOfHistoryStates
|
||||
if (undoStates.length > settings.numberOfHistoryStates) {
|
||||
undoStates = undoStates.splice(-settings.numberOfHistoryStates, settings.numberOfHistoryStates);
|
||||
}
|
||||
|
||||
//there is now definitely at least 1 undo state, so the button shouldnt be disabled
|
||||
document.getElementById('undo-button').classList.remove('disabled');
|
||||
|
||||
//there should be no redoStates after an undoState is saved
|
||||
redoStates = [];
|
||||
|
||||
console.log(undoStates)
|
||||
console.log(redoStates)
|
||||
//get current canvas data and save to undoStates array
|
||||
undoStates.push(state);
|
||||
|
||||
//limit the number of states to settings.numberOfHistoryStates
|
||||
if (undoStates.length > settings.numberOfHistoryStates) {
|
||||
undoStates = undoStates.splice(-settings.numberOfHistoryStates, settings.numberOfHistoryStates);
|
||||
}
|
||||
|
||||
//there is now definitely at least 1 undo state, so the button shouldnt be disabled
|
||||
document.getElementById('undo-button').classList.remove('disabled');
|
||||
|
||||
//there should be no redoStates after an undoState is saved
|
||||
redoStates = [];
|
||||
|
||||
console.log(undoStates);
|
||||
console.log(redoStates);
|
||||
}
|
||||
|
||||
function undo () {
|
||||
console.log('%cundo', undoLogStyle);
|
||||
|
||||
//if there are any states saved to undo
|
||||
if (undoStates.length > 0) {
|
||||
console.log('%cundo', undoLogStyle);
|
||||
|
||||
document.getElementById('redo-button').classList.remove('disabled');
|
||||
|
||||
//get state
|
||||
var undoState = undoStates[undoStates.length-1];
|
||||
console.log(undoState);
|
||||
|
||||
//restore the state
|
||||
undoState.undo();
|
||||
|
||||
//remove from the undo list
|
||||
undoStates.splice(undoStates.length-1,1);
|
||||
|
||||
//if theres none left to undo, disable the option
|
||||
if (undoStates.length == 0)
|
||||
document.getElementById('undo-button').classList.add('disabled');
|
||||
}
|
||||
|
||||
console.log(undoStates)
|
||||
console.log(redoStates)
|
||||
//if there are any states saved to undo
|
||||
if (undoStates.length > 0) {
|
||||
|
||||
document.getElementById('redo-button').classList.remove('disabled');
|
||||
|
||||
//get state
|
||||
var undoState = undoStates[undoStates.length-1];
|
||||
console.log(undoState);
|
||||
|
||||
//restore the state
|
||||
undoState.undo();
|
||||
|
||||
//remove from the undo list
|
||||
undoStates.splice(undoStates.length-1,1);
|
||||
|
||||
//if theres none left to undo, disable the option
|
||||
if (undoStates.length == 0)
|
||||
document.getElementById('undo-button').classList.add('disabled');
|
||||
}
|
||||
|
||||
console.log(undoStates);
|
||||
console.log(redoStates);
|
||||
}
|
||||
|
||||
function redo () {
|
||||
console.log('%credo', undoLogStyle);
|
||||
console.log('%credo', undoLogStyle);
|
||||
|
||||
if (redoStates.length > 0) {
|
||||
if (redoStates.length > 0) {
|
||||
|
||||
//enable undo button
|
||||
document.getElementById('undo-button').classList.remove('disabled');
|
||||
|
||||
//get state
|
||||
var redoState = redoStates[redoStates.length-1];
|
||||
console.log(redoState);
|
||||
|
||||
//restore the state
|
||||
redoState.redo();
|
||||
|
||||
//remove from redo array
|
||||
redoStates.splice(redoStates.length-1,1);
|
||||
|
||||
//if theres none left to redo, disable the option
|
||||
if (redoStates.length == 0)
|
||||
document.getElementById('redo-button').classList.add('disabled');
|
||||
}
|
||||
console.log(undoStates)
|
||||
console.log(redoStates)
|
||||
}
|
||||
//enable undo button
|
||||
document.getElementById('undo-button').classList.remove('disabled');
|
||||
|
||||
//get state
|
||||
var redoState = redoStates[redoStates.length-1];
|
||||
console.log(redoState);
|
||||
|
||||
//restore the state
|
||||
redoState.redo();
|
||||
|
||||
//remove from redo array
|
||||
redoStates.splice(redoStates.length-1,1);
|
||||
|
||||
//if theres none left to redo, disable the option
|
||||
if (redoStates.length == 0)
|
||||
document.getElementById('redo-button').classList.add('disabled');
|
||||
}
|
||||
console.log(undoStates);
|
||||
console.log(redoStates);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user