Close some div by esc pressing too

From now closing: - AlbumCoverViewer div. - About div. - ErrorDialog div.
rafael-santiago · Nov 15, 2024 · 36c8a89 · 36c8a89
1 parent 59da49f
commit 36c8a89
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 2 deletions.
diff --git a/src/internal/renders/test-data/expected-eutherpe.html b/src/internal/renders/test-data/expected-eutherpe.html
@@ -28,7 +28,7 @@ <h2 class="info-banner">&#x1F9A5; Wait... &#x23F3;</h2>
     </div>
     <div id="ErrorDialog" class="configcontent" style="text-align: center; padding: 5%; display:none;">
         <p class="info-banner" id="messageBuffer" style="font-size: 20px;"></p><br><br>
-        <input class="eutherpeBUTTON" type="button" value="Ok" onclick="openConfig('');">
+        <input class="eutherpeBUTTON" type="button" value="Ok" id="closeErrorBtn" onclick="openConfig('');">
     </div>
     <div id="QueryDialog" class="configcontent" style="text-align: center; padding: 5%; display:none;">
         <p class="info-banner" id="queryBuffer" style="font-size: 20px;"></p><br><br>

diff --git a/src/web/html/eutherpe.html b/src/web/html/eutherpe.html
@@ -28,7 +28,7 @@ <h2 class="info-banner">&#x1F9A5; Wait... &#x23F3;</h2>
     </div>
     <div id="ErrorDialog" class="configcontent" style="text-align: center; padding: 5%; display:none;">
         <p class="info-banner" id="messageBuffer" style="font-size: 20px;"></p><br><br>
-        <input class="eutherpeBUTTON" type="button" value="Ok" onclick="openConfig('{{.CURRENT-CONFIG}}');">
+        <input class="eutherpeBUTTON" type="button" value="Ok" id="closeErrorBtn" onclick="openConfig('{{.CURRENT-CONFIG}}');">
     </div>
     <div id="QueryDialog" class="configcontent" style="text-align: center; padding: 5%; display:none;">
         <p class="info-banner" id="queryBuffer" style="font-size: 20px;"></p><br><br>

diff --git a/src/web/js/eutherpe.js b/src/web/js/eutherpe.js
@@ -871,6 +871,19 @@ function installKeyShortcuts() {
     installEnterEscKeyShortcuts(document.getElementById("hostName"),
                                 setHostName,
                                 function(){});
+    // INFO(Rafael): The document as whole.
+    document.onkeydown = function(e) {
+        e = e || e.event;
+        if (e.keyCode == 27) {
+            if (document.getElementById("AlbumCoverViewer").style.display === "block") {
+                closeAlbumCoverViewer();
+            } else if (document.getElementById("About").style.display === "block") {
+                closeAbout();
+            } else if (document.getElementById("ErrorDialog").style.display === "block") {
+                document.getElementById("closeErrorBtn").click();
+            }
+        }
+    };
 }
 
 function openConfig(configName) {