Implemented history for renaming layers

This commit is contained in:
unsettledgames 2020-06-24 22:34:21 +02:00
parent 3dbd7fbb1a
commit b694483f40
2 changed files with 44 additions and 7 deletions

View File

@ -15,12 +15,38 @@ function HistoryStateFlattenAll() {
} }
function HistoryStateRenameLayer() { function HistoryStateRenameLayer(oldName, newName, layer) {
this.edited = layer;
this.oldName = oldName;
this.newName = newName;
this.undo = function() {
layer.menuEntry.getElementsByTagName("p")[0].innerHTML = oldName;
redoStates.push(this);
};
this.redo = function() {
layer.menuEntry.getElementsByTagName("p")[0].innerHTML = newName;
undoStates.push(this);
};
saveHistoryState(this);
} }
function HistoryStateDeleteLayer() { function HistoryStateDeleteLayer(layerData) {
this.deleted = layerData;
this.undo = function() {
redoStates.push(this);
};
this.redo = function() {
undoStates.push(this);
};
saveHistoryState(this);
} }
function HistoryStateMoveLayer(layer1, layer2) { function HistoryStateMoveLayer(layer1, layer2) {
@ -45,7 +71,7 @@ function HistoryStateAddLayer(layerData) {
this.undo = function() { this.undo = function() {
redoStates.push(this); redoStates.push(this);
// un po' brutale onestamente
this.added.selectLayer(); this.added.selectLayer();
deleteLayer(); deleteLayer();

View File

@ -55,6 +55,7 @@ let idToDelete;
let layerOptions = document.getElementById("layer-properties-menu"); let layerOptions = document.getElementById("layer-properties-menu");
let isRenamingLayer = false; let isRenamingLayer = false;
let oldLayerName = null;
on('click',"add-layer-button", addLayer, false); on('click',"add-layer-button", addLayer, false);
@ -75,13 +76,14 @@ class Layer {
this.menuEntry = menuEntry; this.menuEntry = menuEntry;
let id = unusedIDs.pop(); let id = unusedIDs.pop();
console.log("id creato: " + id);
if (id == null) { if (id == null) {
id = currentID; id = currentID;
currentID++; currentID++;
} }
this.id = "layer" + id; this.id = "layer" + id;
if (menuEntry != null) { if (menuEntry != null) {
menuEntry.id = "layer" + id; menuEntry.id = "layer" + id;
@ -220,6 +222,11 @@ class Layer {
layerOptions.style.visibility = "hidden"; layerOptions.style.visibility = "hidden";
currentLayer.menuEntry.getElementsByTagName("p")[0].setAttribute("contenteditable", false); currentLayer.menuEntry.getElementsByTagName("p")[0].setAttribute("contenteditable", false);
isRenamingLayer = false; isRenamingLayer = false;
if (oldLayerName != null) {
new HistoryStateRenameLayer(oldLayerName, this.menuEntry.getElementsByTagName("p")[0].innerHTML, currentLayer);
oldLayerName = null;
}
} }
selectLayer(layer) { selectLayer(layer) {
@ -398,13 +405,14 @@ function merge(event) {
} }
function deleteLayer(event) { function deleteLayer() {
// Cannot delete all the layers // Cannot delete all the layers
if (layers.length != 4) { if (layers.length != 4) {
let layerIndex = layers.indexOf(currentLayer); let layerIndex = layers.indexOf(currentLayer);
let toDelete = layers[layerIndex]; let toDelete = layers[layerIndex];
// Adding the ids to the unused ones // Adding the ids to the unused ones
unusedIDs.push(currentLayer.id); console.log("id cancellato: " + toDelete.id);
unusedIDs.push(toDelete.id);
// Selecting the next layer // Selecting the next layer
if (layerIndex != (layers.length - 3)) { if (layerIndex != (layers.length - 3)) {
@ -432,6 +440,8 @@ function renameLayer(event) {
let toRename = currentLayer; let toRename = currentLayer;
let p = currentLayer.menuEntry.getElementsByTagName("p")[0]; let p = currentLayer.menuEntry.getElementsByTagName("p")[0];
oldLayerName = p.innerHTML;
p.setAttribute("contenteditable", true); p.setAttribute("contenteditable", true);
p.classList.add("layer-name-editable"); p.classList.add("layer-name-editable");
p.focus(); p.focus();
@ -530,7 +540,8 @@ function addLayer(id, saveHistory = true) {
// 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]);
if (id != null) { if (id != null && typeof(id) == "string") {
console.log("imposto");
newLayer.setID(id); newLayer.setID(id);
} }
// Basically "if I'm not adding a layer because redo() is telling meto do so", then I can save the history // Basically "if I'm not adding a layer because redo() is telling meto do so", then I can save the history