toggle sprite editor visibility

index.html

@@ -55,6 +55,10 @@
                     <div>
                         <button id="run-button">🏃 Run</button>
                     </div>
+
+                    <div>
+                        <button id="toggle-sprite-editor-button">🖼️ Toggle sprite editor</button>
+                    </div>
                 </div>
 
                 <section>
@@ -112,7 +116,7 @@ lib.startGameLoop(loop);
                 </section>
             </div>
 
-            <div class="column">
+            <div class="column" id="sprite-editor-container">
                 <section id="sprite-editor">
                     <div class="section-header">
                         Sprite editor

js/index.js

@@ -22,6 +22,7 @@ const saveButton = document.querySelector("#save-button");
 const saveDropdown = document.querySelector("#save-dropdown");
 const saveJsButton = document.querySelector("#save-js");
 const saveHtmlButton = document.querySelector("#save-html");
+const toggleSpriteEditorButton = document.querySelector("#toggle-sprite-editor-button");
 
 const sessionSaveDebounce = new Debounce(1000);
 editor.addEventListener("change", (ev) => {
@@ -123,3 +124,13 @@ ${js}
 
     downloadFile(html, "text/html", ".html");
 };
+
+toggleSpriteEditorButton.addEventListener("click", () => {
+    const cont = document.querySelector("#sprite-editor-container");
+    console.log(cont.style.getPropertyValue("display"));
+    if (cont.style.getPropertyValue("display") === "none") {
+        cont.style.removeProperty("display");
+    } else {
+        cont.style.setProperty("display", "none");
+    }
+});