diff --git a/js/_editorMode.js b/js/_editorMode.js index 9879c5d..0181f0c 100644 --- a/js/_editorMode.js +++ b/js/_editorMode.js @@ -30,6 +30,9 @@ function switchMode(mustConfirm = true) { document.querySelector('#sp-quickstart-container .mode-switcher').classList.add('advanced-mode'); pixelEditorMode = 'Advanced'; + + //turn pixel grid off + togglePixelGrid('off'); } //switch to basic mode else { @@ -64,6 +67,7 @@ function switchMode(mustConfirm = true) { document.querySelector('#sp-quickstart-container .mode-switcher').classList.remove('advanced-mode'); pixelEditorMode = 'Basic'; + togglePixelGrid('on'); } } diff --git a/js/_pixelGrid.js b/js/_pixelGrid.js index 2e16b6f..2385434 100644 --- a/js/_pixelGrid.js +++ b/js/_pixelGrid.js @@ -2,8 +2,8 @@ let pixelGridColor = "#000000"; // Distance between one line and another in HTML pixels let lineDistance = 12; -// The grid is not visible at the beginning -let pixelGridVisible = false; +// The grid is visible by default +let pixelGridVisible = true; // Saving the canvas containing the pixel grid pixelGridCanvas = document.getElementById("pixel-grid"); @@ -11,12 +11,15 @@ pixelGridCanvas = document.getElementById("pixel-grid"); * (triggered by the show pixel grid button in the top menu) * */ -function togglePixelGrid(event) { +function togglePixelGrid(newState) { + console.log('toggling pixel grid', newState) // Getting the button because I have to change its text let button = document.getElementById("toggle-pixelgrid-button"); - // Toggling the state - pixelGridVisible = !pixelGridVisible; + //Set the state based on the passed newState variable, otherwise just toggle it + if (newState == 'on') pixelGridVisible = true; + else if (newState == 'off') pixelGridVisible = false; + else pixelGridVisible = !pixelGridVisible; // If it was visible, I hide it if (pixelGridVisible) {