public inbox for [email protected]  
help / color / mirror / Atom feed
From: Pradip Parkale <[email protected]>
To: pgadmin-hackers <[email protected]>
Subject: [Accessibility] RM4608 Few issues in the dialogs.
Date: Thu, 19 Mar 2020 14:26:11 +0530
Message-ID: <CAJ9T6Sv7Dd75Rx4BqsWBAhdJa4eV2raJ+o7Hi6gmkEx3WVDSig@mail.gmail.com> (raw)

Hi Hackers,

Please find the patch for accessibility errors in some of the dialogs.


-- 
Thanks & Regards,
Pradip Parkale
QMG, EnterpriseDB Corporation


Attachments:

  [application/octet-stream] RM4608.patch (8.6K, 3-RM4608.patch)
  download | inline diff:
diff --git a/web/pgadmin/browser/server_groups/servers/databases/schemas/fts_configurations/static/js/fts_configuration.js b/web/pgadmin/browser/server_groups/servers/databases/schemas/fts_configurations/static/js/fts_configuration.js
index b38ee2cab..ab4838ea5 100644
--- a/web/pgadmin/browser/server_groups/servers/databases/schemas/fts_configurations/static/js/fts_configuration.js
+++ b/web/pgadmin/browser/server_groups/servers/databases/schemas/fts_configurations/static/js/fts_configuration.js
@@ -212,7 +212,7 @@ define('pgadmin.node.fts_configuration', [
           '   </div>',
           '   <div class="col-6" header="token"></div>',
           '   <div class="col-2">',
-          '     <button class="btn btn-sm-sq btn-secondary add fa fa-plus" <%=canAdd ? "" : "disabled=\'disabled\'"%> ></button>',
+          '     <button class="btn btn-sm-sq btn-secondary add fa fa-plus" <%=canAdd ? "" : "disabled=\'disabled\'"%> ><span class="sr-only">Add Token</span></button>',
           '   </div>',
           '  </div>',
           ' </div>',
diff --git a/web/pgadmin/browser/server_groups/servers/templates/servers/password.html b/web/pgadmin/browser/server_groups/servers/templates/servers/password.html
index a41b3f0b1..afdfbfe96 100644
--- a/web/pgadmin/browser/server_groups/servers/templates/servers/password.html
+++ b/web/pgadmin/browser/server_groups/servers/templates/servers/password.html
@@ -1,9 +1,9 @@
 <form name="frmPassword" id="frmPassword" style="height: 100%; width: 100%" onsubmit="return false;">
     <div>
-        <div><label class="font-weight-bold" for="password">{{ _('Please enter the password for the user \'{0}\' to connect the server - "{1}"').format(username,
-            server_label) }}</label></div>
+        <div><span class="font-weight-bold" >{{ _('Please enter the password for the user \'{0}\' to connect the server - "{1}"').format(username,
+            server_label) }}</span></div>
         <div class="input-group row py-2">
-            <span class="col-sm-2 col-form-label" aria-hidden="true">Password</span>
+            <label for="password" class="col-sm-2 col-form-label" aria-hidden="true">Password</label>
             <div class="col-sm-10">
               <input id="password" class="form-control" name="password" type="password">
             </div>
diff --git a/web/pgadmin/static/js/backform.pgadmin.js b/web/pgadmin/static/js/backform.pgadmin.js
index a1c898890..a44d1a83a 100644
--- a/web/pgadmin/static/js/backform.pgadmin.js
+++ b/web/pgadmin/static/js/backform.pgadmin.js
@@ -1581,7 +1581,7 @@ define([
     showGridControl: function(data) {
       var self = this,
         gridHeader = ['<div class=\'subnode-header\'>',
-          '  <label class=\'control-label pg-el-sm-10\'>' + data.label + '</label>',
+          '  <span class=\'control-label pg-el-sm-10\'>' + data.label + '</span>',
           '  <button aria-label="' + _('Add') + '" class=\'btn btn-sm-sq btn-secondary add fa fa-plus\' title=\'' + _('Add new row') + '\'></button>',
           '</div>',
         ].join('\n'),
@@ -2890,41 +2890,40 @@ define([
       },
 
       down: function() {
+        let $el = this.$el.find('.datetimepicker-input');
+        let currdate = $el.data('datetimepicker').date().clone();
         if (this.$el.find('.datepicker').is(':visible')) {
-          let $el = this.$el.find('.datetimepicker-input');
-          let currdate = $el.data('datetimepicker').date().clone();
           $el.datetimepicker('date', currdate.add(7, 'd'));
         } else {
-          let $el = this.$el.find('.datetimepicker-input');
-          let currdate = $el.data('datetimepicker').date().clone();
           $el.datetimepicker('date', currdate.subtract(1, 'm'));
         }
       },
 
       up: function() {
+        let $el = this.$el.find('.datetimepicker-input');
+        let currdate = $el.data('datetimepicker').date().clone();
+
         if (this.$el.find('.datepicker').is(':visible')) {
-          let $el = this.$el.find('.datetimepicker-input');
-          let currdate = $el.data('datetimepicker').date().clone();
           $el.datetimepicker('date', currdate.subtract(7, 'd'));
         } else {
-          let $el = this.$el.find('.datetimepicker-input');
-          let currdate = $el.data('datetimepicker').date().clone();
           $el.datetimepicker('date', currdate.add(1, 'm'));
         }
       },
 
       left: function() {
+        let $el = this.$el.find('.datetimepicker-input');
+        let currdate = $el.data('datetimepicker').date().clone();
+
         if (this.$el.find('.datepicker').is(':visible')) {
-          let $el = this.$el.find('.datetimepicker-input');
-          let currdate = $el.data('datetimepicker').date().clone();
           $el.datetimepicker('date', currdate.subtract(1, 'd'));
         }
       },
 
       right: function() {
+        let $el = this.$el.find('.datetimepicker-input');
+        let currdate = $el.data('datetimepicker').date().clone();
+
         if (this.$el.find('.datepicker').is(':visible')) {
-          let $el = this.$el.find('.datetimepicker-input');
-          let currdate = $el.data('datetimepicker').date().clone();
           $el.datetimepicker('date', currdate.add(1, 'd'));
         }
       },
@@ -3193,7 +3192,7 @@ define([
     template: _.template([
       '<label class="<%=Backform.controlLabelClassName%> keyboard-shortcut-label"><%=label%></label>',
       '<div class="<%=Backform.controlsClassName%>">',
-      '  <input type="<%=type%>" class="<%=Backform.controlClassName%> <%=extraClasses.join(\' \')%>" name="<%=name%>" oncopy="return false; oncut="return false; onpaste="return false;" maxlength="<%=maxlength%>" value="<%-value%>" placeholder="<%-placeholder%>" <%=disabled ? "disabled" : ""%> <%=required ? "required" : ""%> />',
+      '  <input aria-label="<%=name%>" type="<%=type%>" class="<%=Backform.controlClassName%> <%=extraClasses.join(\' \')%>" name="<%=name%>" oncopy="return false; oncut="return false; onpaste="return false;" maxlength="<%=maxlength%>" value="<%-value%>" placeholder="<%-placeholder%>" <%=disabled ? "disabled" : ""%> <%=required ? "required" : ""%> />',
       '  <% if (helpMessage && helpMessage.length) { %>',
       '    <span class="<%=Backform.helpMessageClassName%>"><%=helpMessage%></span>',
       '  <% } %>',
diff --git a/web/pgadmin/static/js/backgrid.pgadmin.js b/web/pgadmin/static/js/backgrid.pgadmin.js
index e82da8bec..a64897b20 100644
--- a/web/pgadmin/static/js/backgrid.pgadmin.js
+++ b/web/pgadmin/static/js/backgrid.pgadmin.js
@@ -698,6 +698,7 @@ define([
         $('<input>', {
           tabIndex: 0,
           type: 'checkbox',
+          'aria-label': gettext('data toggle'),
         }).prop('checked', rawValue).prop('disabled', !editable).attr('data-toggle', 'toggle')
           .attr('data-size', options.size).attr('data-on', options.onText).attr('data-off', options.offText)
           .attr('data-width', options.width).attr('data-height', options.height)
diff --git a/web/pgadmin/tools/maintenance/static/js/maintenance.js b/web/pgadmin/tools/maintenance/static/js/maintenance.js
index 6cebd3c07..4f1508233 100644
--- a/web/pgadmin/tools/maintenance/static/js/maintenance.js
+++ b/web/pgadmin/tools/maintenance/static/js/maintenance.js
@@ -6,7 +6,6 @@
 // This software is released under the PostgreSQL Licence
 //
 //////////////////////////////////////////////////////////////
-
 define([
   'sources/gettext', 'sources/url_for', 'jquery', 'underscore',
   'pgadmin.alertifyjs', 'sources/pgadmin', 'pgadmin.browser', 'backbone',
@@ -277,6 +276,7 @@ define([
                     type: 'button',
                     url: 'maintenance.html',
                     label: gettext('Maintenance'),
+                    'aria-label': gettext('Object Help'),
                   },
                 }, {
                   text: '',
@@ -417,7 +417,6 @@ define([
             prepare: function() {
               // Main maintenance tool dialog container
               var $container = $('<div class=\'maintenance_dlg\'></div>');
-
               var t = pgBrowser.tree,
                 i = t.selected(),
                 d = i && i.length == 1 ? t.itemData(i) : undefined,
diff --git a/web/pgadmin/tools/restore/static/js/restore_dialog_wrapper.js b/web/pgadmin/tools/restore/static/js/restore_dialog_wrapper.js
index 396eab0fe..712d70cbc 100644
--- a/web/pgadmin/tools/restore/static/js/restore_dialog_wrapper.js
+++ b/web/pgadmin/tools/restore/static/js/restore_dialog_wrapper.js
@@ -38,6 +38,7 @@ export class RestoreDialogWrapper extends DialogWrapper {
           type: 'button',
           url: 'backup.html',
           label: gettext('Restore'),
+          'aria-label': gettext('Object Help'),
         },
       }, {
         text: '',


view thread (4+ 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: [Accessibility] RM4608 Few issues in the dialogs.
  In-Reply-To: <CAJ9T6Sv7Dd75Rx4BqsWBAhdJa4eV2raJ+o7Hi6gmkEx3WVDSig@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