public inbox for [email protected]  

help / color / mirror / Atom feed

From: Nagesh Dhope <[email protected]>
To: pgadmin-hackers <[email protected]>
Subject: [pgAdmin][RM4930] [Accessibility] Main window tan navigation
Date: Wed, 13 Nov 2019 17:00:28 +0530
Message-ID: <CAA3zdZpg6iUGPavFDAYo1qKM7QFBJ18HvXeJrHxcNPzN7b-57A@mail.gmail.com> (raw)

Hi Hackers,
Please find a patch for following accessibility issues on the main window.

   1. Dashboard -> Server Activity grid: terminate the session, cancel
   active button not navigable using tab key
   2. SQL -> If the focus inside code mirror control tab navigation not
   working

Along with this, there is a minor shadow color fix for the refresh button
on the Server activity grid's refresh button. Note: Currently search text
field has a primary-color shadow and the refresh button has a
secondary-color shadow.

-- 
Thanks,
Nagesh


Attachments:

  [application/octet-stream] RM-4930.patch (2.4K, 3-RM-4930.patch)
  download | inline diff:
diff --git a/web/pgadmin/browser/static/js/keyboard.js b/web/pgadmin/browser/static/js/keyboard.js
index ba1a780..dd1b5fe 100644
--- a/web/pgadmin/browser/static/js/keyboard.js
+++ b/web/pgadmin/browser/static/js/keyboard.js
@@ -133,7 +133,7 @@ _.extend(pgBrowser.keyboardNavigation, {
   bindRightPanel: function(event, combo) {
     let allPanels = pgAdmin.Browser.docker.findPanels();
     let activePanel = 0;
-    let nextPanel = allPanels.length;
+    let nextPanel = allPanels.length - 1;
     let prevPanel = 1;
     let activePanelId = 0;
     let activePanelFlag = false;
diff --git a/web/pgadmin/dashboard/static/js/dashboard.js b/web/pgadmin/dashboard/static/js/dashboard.js
index 39132dd..42d2eca 100644
--- a/web/pgadmin/dashboard/static/js/dashboard.js
+++ b/web/pgadmin/dashboard/static/js/dashboard.js
@@ -52,6 +52,13 @@ define('pgadmin.dashboard', [
           '\'></i>'
         );
       }
+      this.$el.attr('tabindex', 0);
+      this.$el.on('keydown', function(e) {
+        // terminating session or cancel the active query.
+        if (e.keyCode == 32) {
+          self.$el.click();
+        }
+      }),
       this.delegateEvents();
       return this;
     },
diff --git a/web/pgadmin/static/bundle/codemirror.js b/web/pgadmin/static/bundle/codemirror.js
index b77c259..614fdc3 100644
--- a/web/pgadmin/static/bundle/codemirror.js
+++ b/web/pgadmin/static/bundle/codemirror.js
@@ -26,4 +26,16 @@ import 'codemirror/addon/comment/comment';
 import 'sources/codemirror/addon/fold/pgadmin-sqlfoldcode';
 import 'sources/codemirror/extension/centre_on_line';
 
+var cmds = CodeMirror.commands;
+cmds.focusOut = function(){
+  event.stopPropagation();
+  document.activeElement.blur();
+  if(event.currentTarget.parents().find('.sql-code-control')) {
+    // for code mirror in dialogs
+    event.currentTarget.parents().find('.sql-code-control').focus();
+  }
+};
+
+CodeMirror.keyMap.default['Esc'] = 'focusOut';
+
 export default CodeMirror;
diff --git a/web/pgadmin/static/scss/_pgadmin.style.scss b/web/pgadmin/static/scss/_pgadmin.style.scss
index c87fa4d..e6e4dab 100644
--- a/web/pgadmin/static/scss/_pgadmin.style.scss
+++ b/web/pgadmin/static/scss/_pgadmin.style.scss
@@ -626,6 +626,10 @@ fieldset.inline-fieldset > div {
     height: 100%;
   }
 
+  & .btn-secondary:focus {
+    box-shadow: $input-btn-focus-box-shadow;
+  }
+
   & .input-group {
     & .input-group-text {
       background: $input-bg;

view thread (2+ messages)  latest in thread

reply

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Reply to all the recipients using the --to and --cc options:
  reply via email

  To: [email protected]
  Cc: [email protected]
  Subject: Re: [pgAdmin][RM4930] [Accessibility] Main window tan navigation
  In-Reply-To: <CAA3zdZpg6iUGPavFDAYo1qKM7QFBJ18HvXeJrHxcNPzN7b-57A@mail.gmail.com>

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox