diff --git a/js/EditorState.js b/js/EditorState.js index 54d78c1..56f16db 100644 --- a/js/EditorState.js +++ b/js/EditorState.js @@ -10,6 +10,9 @@ const EditorState = (() => { } function switchMode(newMode) { + if (!firstFile && newMode == "Basic" && !confirm('Switching to basic mode will flatten all the visible layers. Are you sure you want to continue?')) { + return; + } //switch to advanced mode if (newMode == 'Advanced') { Events.emit("switchedToAdvanced"); diff --git a/js/LayerList.js b/js/LayerList.js index f1b48b9..66a0b13 100644 --- a/js/LayerList.js +++ b/js/LayerList.js @@ -28,9 +28,6 @@ const LayerList = (() => { } function hideMenu() { if (EditorState.documentCreated()) { - if (!confirm('Switching to basic mode will flatten all the visible layers. Are you sure you want to continue?')) { - return; - } // Selecting the current layer currFile.currentLayer.selectLayer(); // Flatten the layers diff --git a/js/Startup.js b/js/Startup.js index 2888880..999bb0a 100644 --- a/js/Startup.js +++ b/js/Startup.js @@ -103,6 +103,7 @@ const Startup = (() => { // Adding the checkerboard behind it currFile.checkerBoard = new Checkerboard(width, height, null); // Pixel grid + console.log("CREATED GRID"); currFile.pixelGrid = new PixelGrid(width, height, "pixel-grid"); // Creating the vfx layer on top of everything diff --git a/js/layers/PixelGrid.js b/js/layers/PixelGrid.js index 1a830a3..77153e3 100644 --- a/js/layers/PixelGrid.js +++ b/js/layers/PixelGrid.js @@ -12,14 +12,14 @@ class PixelGrid extends Layer { constructor(width, height, canvas, menuEntry) { super(width, height, canvas, menuEntry); this.initialize(); + Events.onCustom("refreshPixelGrid", this.fillPixelGrid.bind(this)); + Events.onCustom("switchedToAdvanced", this.togglePixelGrid.bind(this)); + Events.onCustom("switchedToBasic", this.togglePixelGrid.bind(this)); } initialize() { super.initialize(); this.fillPixelGrid(); - Events.onCustom("refreshPixelGrid", this.fillPixelGrid.bind(this)); - Events.onCustom("switchedToAdvanced", this.disablePixelGrid.bind(this)); - Events.onCustom("switchedToBasic", this.enablePixelGrid.bind(this)); } disablePixelGrid() { @@ -28,10 +28,25 @@ class PixelGrid extends Layer { } enablePixelGrid() { + if (!this.pixelGridVisible) + return; this.pixelGridEnabled = true; this.canvas.style.display = "inline-block"; } + hidePixelGrid() { + let button = document.getElementById("toggle-pixelgrid-button"); + this.pixelGridVisible = false; + button.innerHTML = "Show pixel grid"; + this.canvas.style.display = "none"; + } + showPixelGrid() { + let button = document.getElementById("toggle-pixelgrid-button"); + this.pixelGridVisible = true; + button.innerHTML = "Hide pixel grid"; + this.canvas.style.display = "inline-block"; + } + repaintPixelGrid(factor) { this.lineDistance += factor; this.fillPixelGrid(); @@ -42,24 +57,16 @@ class PixelGrid extends Layer { * */ togglePixelGrid(newState) { - // Getting the button because I have to change its text - let button = document.getElementById("toggle-pixelgrid-button"); - //Set the state based on the passed newState variable, otherwise just toggle it - if (newState == 'on') this.pixelGridVisible = true; - else if (newState == 'off') this.pixelGridVisible = false; - else this.pixelGridVisible = !this.pixelGridVisible; - - // If it was visible, I hide it - if (this.pixelGridVisible) { - button.innerHTML = "Hide pixel grid"; - this.canvas.style.display = "inline-block"; - } - // Otherwise, I show it - else { - button.innerHTML = "Show pixel grid"; - this.canvas.style.display = "none"; - } + if (newState == 'on') + this.showPixelGrid(); + else if (newState == 'off') + this.hidePixelGrid(); + else + if (this.pixelGridVisible) + this.hidePixelGrid(); + else + this.showPixelGrid(); } /** Fills the pixelGridCanvas with the pixelgrid diff --git a/refactor_dependencies b/refactor_dependencies deleted file mode 100644 index 1799cd8..0000000 --- a/refactor_dependencies +++ /dev/null @@ -1,8 +0,0 @@ -Input <- Startup, LayerList, TopMenuModule: Could be resolved by using custom events - -FileManager <- LayerList, File, Startup, EditorState, ColorModule - -Startup <- ColorModule, ToolManager, LayerList, EditorState, Layer(++) - -TopMenuModule -> Startup -