mirror of
https://github.com/lospec/pixel-editor.git
synced 2023-08-10 21:12:51 +03:00
Removed all Layer-related global variables
This commit is contained in:
parent
7084988de4
commit
e4415a5358
@ -47,11 +47,13 @@ const Input = (() => {
|
||||
*/
|
||||
function KeyPress(e) {
|
||||
var keyboardEvent = window.event? event : e;
|
||||
console.log("pressed key");
|
||||
|
||||
//if the user is typing in an input field or renaming a layer, ignore these hotkeys, unless it's an enter key
|
||||
if (document.activeElement.tagName == 'INPUT' || isRenamingLayer) {
|
||||
if (document.activeElement.tagName == 'INPUT' || LayerList.isRenamingLayer) {
|
||||
if (e.keyCode == 13) {
|
||||
currentLayer.closeOptionsMenu();
|
||||
console.log("here");
|
||||
LayerList.closeOptionsMenu();
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
35
js/Layer.js
35
js/Layer.js
@ -1,16 +1,5 @@
|
||||
// TODO: add undo for layer drag n drop
|
||||
|
||||
// REFACTOR: Put it somewhere
|
||||
let oldLayerName = null;
|
||||
|
||||
// REFACTOR: LayerMenu
|
||||
// HTML element that contains the layer entries
|
||||
|
||||
|
||||
// Is the user currently renaming a layer?
|
||||
// REFACTOR: this one's tricky, might be part of EditorState
|
||||
let isRenamingLayer = false;
|
||||
|
||||
/** Handler class for a single canvas (a single layer)
|
||||
*
|
||||
* @param width Canvas width
|
||||
@ -40,8 +29,8 @@ class Layer {
|
||||
this.isSelected = false;
|
||||
this.isVisible = true;
|
||||
this.isLocked = false;
|
||||
|
||||
console.log("here dude");
|
||||
|
||||
this.oldLayerName = null;
|
||||
|
||||
if (typeof menuEntry == "string")
|
||||
this.menuEntry = document.getElementById("layers-menu").firstElementChild;
|
||||
@ -99,6 +88,26 @@ class Layer {
|
||||
this.context.mozImageSmoothingEnabled = false;
|
||||
}
|
||||
|
||||
rename() {
|
||||
this.menuEntry.getElementsByTagName("p")[0].setAttribute("contenteditable", false);
|
||||
|
||||
if (this.oldLayerName != null) {
|
||||
let name = this.menuEntry.getElementsByTagName("p")[0].innerHTML;
|
||||
|
||||
for (let i=0; i<layers.length; i++) {
|
||||
if (name === layers[i].name) {
|
||||
name += ' (1)';
|
||||
i = 0;
|
||||
}
|
||||
}
|
||||
this.name = name;
|
||||
this.menuEntry.getElementsByTagName("p")[0].innerHTML = name;
|
||||
|
||||
new HistoryState().RenameLayer(this.oldLayerName, name, currentLayer);
|
||||
this.oldLayerName = null;
|
||||
}
|
||||
}
|
||||
|
||||
hover() {
|
||||
// Hides all the layers but the current one
|
||||
for (let i=1; i<layers.length - nAppLayers; i++) {
|
||||
|
@ -2,6 +2,7 @@ const LayerList = (() => {
|
||||
|
||||
let layerList = document.getElementById("layers-menu");
|
||||
let layerListEntry = layerList.firstElementChild;
|
||||
let renamingLayer = false;
|
||||
let dragStartLayer;
|
||||
|
||||
// Binding the right click menu
|
||||
@ -157,18 +158,17 @@ const LayerList = (() => {
|
||||
return null;
|
||||
}
|
||||
|
||||
function renameLayer(event) {
|
||||
function startRenamingLayer(event) {
|
||||
let p = currentLayer.menuEntry.getElementsByTagName("p")[0];
|
||||
|
||||
oldLayerName = p.innerHTML;
|
||||
currentLayer.oldLayerName = p.innerHTML;
|
||||
|
||||
p.setAttribute("contenteditable", true);
|
||||
p.classList.add("layer-name-editable");
|
||||
p.focus();
|
||||
|
||||
Events.simulateInput(65, true, false, false);
|
||||
|
||||
isRenamingLayer = true;
|
||||
renamingLayer = true;
|
||||
}
|
||||
|
||||
function duplicateLayer(event, saveHistory = true) {
|
||||
@ -371,33 +371,30 @@ const LayerList = (() => {
|
||||
|
||||
function closeOptionsMenu(event) {
|
||||
Layer.layerOptions.style.visibility = "hidden";
|
||||
currentLayer.menuEntry.getElementsByTagName("p")[0].setAttribute("contenteditable", false);
|
||||
isRenamingLayer = false;
|
||||
|
||||
if (this.oldLayerName != null) {
|
||||
let name = this.menuEntry.getElementsByTagName("p")[0].innerHTML;
|
||||
this.name = name;
|
||||
|
||||
new HistoryState().RenameLayer(this.oldLayerName, name, currentLayer);
|
||||
this.oldLayerName = null;
|
||||
}
|
||||
currentLayer.rename();
|
||||
renamingLayer = false;
|
||||
}
|
||||
|
||||
function getLayerListEntries() {
|
||||
return layerList;
|
||||
}
|
||||
|
||||
function isRenamingLayer() {
|
||||
return renamingLayer;
|
||||
}
|
||||
|
||||
return {
|
||||
addLayer,
|
||||
mergeLayers,
|
||||
getLayerByID,
|
||||
getLayerByName,
|
||||
renameLayer,
|
||||
renameLayer: startRenamingLayer,
|
||||
duplicateLayer,
|
||||
deleteLayer,
|
||||
merge,
|
||||
flatten,
|
||||
closeOptionsMenu,
|
||||
getLayerListEntries
|
||||
getLayerListEntries,
|
||||
isRenamingLayer
|
||||
}
|
||||
})();
|
Loading…
Reference in New Issue
Block a user