Merge pull request #191 from innogames/servershell_dismiss_by_esc

Dismiss alerts by <ESC> keyboard shortcut

serveradmin/common/static/js/plugins/esc_dismissible.js

@@ -0,0 +1,31 @@
+/*
+ * Dismiss by ESC keyboard shortcut, Copyright (c) 2021 InnoGames GmbH
+ *
+ * Allows to dismiss (delete) HTML elements that have the class dismissible
+ * by pressing escape.
+ */
+$(document).ready(function() {
+    $(document).keydown(function (event) {
+        // ESC
+        if (event.key === "Escape") {
+            let dismissible = $('.dismissible');
+
+            if (dismissible.length < 1) {
+                return;
+            }
+
+            // Pressing ESC on elements such as inputs makes them loose focus.
+            // To avoid this we remember the focused element to restore it.
+            let input = document.activeElement;
+
+            dismissible.remove();
+
+            if (input) {
+                input.focus();
+            }
+
+            event.preventDefault();
+            event.stopPropagation();
+        }
+    });
+});

serveradmin/common/templates/base.html

@@ -79,6 +79,7 @@
 <script src="{{ STATIC_URL }}js/js.cookie.min.js"></script>
 <script src="{{ STATIC_URL }}js/serveradmin.js"></script>
 <script src="{{ STATIC_URL }}js/plugins/terminal_keyboard.js"></script>
+<script src="{{ STATIC_URL }}js/plugins/esc_dismissible.js"></script>
 {% block additional_scripts %}{% endblock %}
 {% endcompress %}
 </body>

serveradmin/servershell/static/js/servershell.js

@@ -216,6 +216,7 @@ servershell.alert = function(text, level, auto_dismiss=5) {
 
     let alert = template.clone();
     alert.removeAttr('id');
+    alert.addClass('dismissible');
     alert.addClass(`alert-${level}`);
     alert.children('.alert-text').text(text);