Dialog keyboard behavior

https://fedorahosted.org/freeipa/ticket/3904

1 files changed, 35 insertions, 1 deletions

diff --git a/install/ui/src/freeipa/dialog.js b/install/ui/src/freeipa/dialog.js
index 29f480c5..337d2e61 100644
--- a/install/ui/src/freeipa/dialog.js
+++ b/install/ui/src/freeipa/dialog.js
@@ -224,7 +224,8 @@ IPA.dialog = function(spec) {
         }
 
         that.dom_node = $('<div/>', {
-            'class': 'rcue-dialog-background'
+            'class': 'rcue-dialog-background',
+            keydown: that.on_key_down
         });
 
         var container_node = $('<div/>', {
@@ -362,6 +363,39 @@ IPA.dialog = function(spec) {
     };
 
     /**
+     * Default keyboard behavior
+     *
+     * - close on escape if enabled by `close_on_escape`
+     * - makes sure that tabbing doesn't leave the dialog
+     */
+    that.on_key_down = function(event) {
+
+        if ( that.close_on_escape && !event.isDefaultPrevented() && event.keyCode &&
+            event.keyCode === $.ui.keyCode.ESCAPE ) {
+            event.preventDefault();
+            that.close();
+            return;
+        }
+
+        // prevent tabbing out of dialogs
+        if ( event.keyCode !== $.ui.keyCode.TAB ) {
+            return;
+        }
+
+        var tabbables = that.dom_node.find(":tabbable"),
+        first = tabbables.filter(":first"),
+        last = tabbables.filter(":last");
+
+        if ( ( event.target === last[0] || event.target === that.dialog_node[0] ) && !event.shiftKey ) {
+            first.focus( 1 );
+            event.preventDefault();
+        } else if ( ( event.target === first[0] || event.target === that.dialog_node[0] ) && event.shiftKey ) {
+            last.focus( 1 );
+            event.preventDefault();
+        }
+    };
+
+    /**
      * Show message in dialog's message container
      * @param {string} message
      */