Fixed tab key navigation for some dialogs. Fixes #5371

This commit is contained in:
Pradip Parkale 2020-04-14 13:32:03 +05:30 committed by Akshay Joshi
parent 21cb1a0166
commit a05acb4f99
9 changed files with 83 additions and 61 deletions

View File

@ -46,3 +46,4 @@ Bug fixes
| `Issue #5351 <https://redmine.postgresql.org/issues/5351>`_ - Fixed compilation warnings while building pgAdmin.
| `Issue #5361 <https://redmine.postgresql.org/issues/5361>`_ - Fixes an issue where pgAdmin4 GUI does not display properly in IE 11.
| `Issue #5362 <https://redmine.postgresql.org/issues/5362>`_ - Fixed an issue where the identical packages and sequences visible as different in the schema diff tool.
| `Issue #5371 <https://redmine.postgresql.org/issues/5371>`_ - Fixed tab key navigation for some dialogs.

View File

@ -8,8 +8,8 @@
//////////////////////////////////////////////////////////////
define(['sources/gettext', 'underscore', 'jquery', 'backbone', 'backform',
'backgrid', 'alertify', 'pgadmin.browser.node', 'pgadmin.browser.node.ui',
], function(gettext, _, $, Backbone, Backform, Backgrid, Alertify, pgNode) {
'backgrid', 'alertify', 'pgadmin.browser.node', 'sources/utils', 'pgadmin.browser.node.ui',
], function(gettext, _, $, Backbone, Backform, Backgrid, Alertify, pgNode, commonUtils) {
/**
* Each Privilege, supporeted by an database object, will be represented
* using this Model.
@ -622,11 +622,16 @@ define(['sources/gettext', 'underscore', 'jquery', 'backbone', 'backform',
command = new Backgrid.Command(ev),
coll = this.model.get(this.column.get('name'));
if (ev.key == 'Tab'){
commonUtils.handleKeyNavigation(event);
}
if (command.moveUp() || command.moveDown() || command.save()) {
// backgrid vertical navigation (Up/Down arrow key)
ev.preventDefault();
ev.stopPropagation();
model.trigger('backgrid:edited', model, column, command);
this.model.trigger('backgrid:edited', this.model, this.column, command);
// model.trigger('backgrid:edited', model, column, command);
return;
}
// esc

View File

@ -1555,7 +1555,7 @@ define('pgadmin.browser.node', [
}
let btnGroup = $(panel.$container.find('.pg-prop-btn-group'));
let el = $(btnGroup).find('button:first');
if (panel.$container.find('td.editable:last').is(':visible')){
if (panel.$container.find('.number-cell.editable:last').is(':visible')){
if (event.keyCode === 9 && event.shiftKey) {
if ($(el).is($(event.target))){
$(panel.$container.find('td.editable:last').trigger('click'));

View File

@ -240,61 +240,7 @@ define([
return true;
},
keydownHandler: function(event) {
let wizardHeader = $(event.currentTarget).find('.wizard-header');
let wizardFooter = $(event.currentTarget).find('.wizard-footer');
let gridElement = $(event.currentTarget).find('.select-row-cell:first');
let gridElementLast = $(event.currentTarget).find('.select-row-cell:last');
let firstWizardHeaderButton = $(wizardHeader).find('button:enabled:first');
let lastWizardHeaderButton = $(wizardHeader).find('button:enabled:last');
let lastWizardFooterBtn = $(wizardFooter).find('button:enabled:last');
let firstWizardFooterBtn = $(wizardFooter).find('button:enabled:first');
if (event.shiftKey && event.keyCode === 9) {
// Move backwards
if(firstWizardHeaderButton && $(firstWizardHeaderButton).is($(event.target))) {
if (lastWizardFooterBtn) {
$(lastWizardFooterBtn).focus();
event.preventDefault();
event.stopPropagation();
}
}
else if ($(firstWizardFooterBtn).is($(event.target))){
if ($(gridElement).find('.custom-control-input').is(':visible')){
$(gridElementLast).find('.custom-control-input').focus();
event.preventDefault();
event.stopPropagation();
}else if ($(event.currentTarget).find('.wizard-content').find('.CodeMirror-scroll').is(':visible')){
$(lastWizardHeaderButton).focus();
}
}
} else if (event.keyCode === 9) {
// Move forwards
// If taget is last button then goto first element
if(lastWizardFooterBtn && $(lastWizardFooterBtn).is($(event.target))) {
$(firstWizardHeaderButton).focus();
event.preventDefault();
event.stopPropagation();
}else if (event.target.innerText == 'Name'){
if ($(gridElement).find('.custom-control-input').is(':visible')){
$(gridElement).find('.custom-control-input').focus();
}else {
$(firstWizardFooterBtn).focus();
}
event.preventDefault();
event.stopPropagation();
} else if(event.target.tagName == 'DIV') {
$(event.currentTarget).find('.custom-control-input:first').trigger('focus');
event.preventDefault();
event.stopPropagation();
} else if(event.target.tagName == 'TEXTAREA'){
$(firstWizardFooterBtn).focus();
}
} else if (event.keyCode === 27){
//close the wizard when esc key is pressed
$(wizardHeader).find('button.ajs-close').click();
}
commonUtils.handleKeyNavigation(event);
},
enableDisableNext: function(disable) {
if (typeof(disable) != 'undefined') {

View File

@ -123,7 +123,7 @@ window.onload = function(e){
<li id="mnu_management" class="nav-item active dropdown d-none">
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">{{
_('Management') }} <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu"></ul>
<ul class="dropdown-menu" aria-hidden="true"></ul>
</li>
<li id="mnu_tools" class="nav-item active dropdown d-none">
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">{{

View File

@ -1822,6 +1822,7 @@ define([
/* Check for sql editor preference changes */
let self = this;
this.$el.find('textarea').attr('tabindex', -1);
pgBrowser.onPreferencesChange('sqleditor', function() {
self.reflectPreferences();
});

View File

@ -833,6 +833,12 @@ define([
// go to Next Cell & if Shift is also pressed go to Previous Cell
if (e.keyCode == 9 || e.keyCode == 16) {
gotoCell = e.shiftKey ? self.$el.prev() : self.$el.next();
if (self.$el.next().length == 0){
setTimeout(function() {
self.$el.find('.select2-selection').blur();
}, 100);
}
}
if (gotoCell) {

View File

@ -9,6 +9,8 @@
import _ from 'underscore';
import { getTreeNodeHierarchyFromIdentifier } from 'sources/tree/pgadmin_tree_node';
import $ from 'jquery';
export function parseShortcutValue(obj) {
var shortcut = '';
@ -19,6 +21,64 @@ export function parseShortcutValue(obj) {
return shortcut;
}
export function handleKeyNavigation(event) {
let wizardHeader = $(event.currentTarget).find('.wizard-header');
let wizardFooter = $(event.currentTarget).find('.wizard-footer');
let gridElement = $(event.currentTarget).find('.select-row-cell:first');
let gridElementLast = $(event.currentTarget).find('.select-row-cell:last');
let firstWizardHeaderButton = $(wizardHeader).find('button:enabled:first');
let lastWizardHeaderButton = $(wizardHeader).find('button:enabled:last');
let lastWizardFooterBtn = $(wizardFooter).find('button:enabled:last');
let firstWizardFooterBtn = $(wizardFooter).find('button:enabled:first');
if (event.shiftKey && event.keyCode === 9) {
// Move backwards
if(firstWizardHeaderButton && $(firstWizardHeaderButton).is($(event.target))) {
if (lastWizardFooterBtn) {
$(lastWizardFooterBtn).focus();
event.preventDefault();
event.stopPropagation();
}
}
else if ($(firstWizardFooterBtn).is($(event.target))){
if ($(gridElement).find('.custom-control-input').is(':visible')){
$(gridElementLast).find('.custom-control-input').focus();
event.preventDefault();
event.stopPropagation();
}else if ($(event.currentTarget).find('.wizard-content').find('.CodeMirror-scroll').is(':visible')){
$(lastWizardHeaderButton).focus();
}
}
} else if (event.keyCode === 9) {
// Move forwards
// If taget is last button then goto first element
if(lastWizardFooterBtn && $(lastWizardFooterBtn).is($(event.target))) {
$(firstWizardHeaderButton).focus();
event.preventDefault();
event.stopPropagation();
}else if (event.target.innerText == 'Name'){
if ($(gridElement).find('.custom-control-input').is(':visible')){
$(gridElement).find('.custom-control-input').focus();
}else {
$(firstWizardFooterBtn).focus();
}
event.preventDefault();
event.stopPropagation();
} else if(event.target.tagName == 'DIV') {
$(event.currentTarget).find('.custom-control-input:first').trigger('focus');
event.preventDefault();
event.stopPropagation();
} else if(event.target.tagName == 'TEXTAREA'){
$(firstWizardFooterBtn).focus();
}
} else if (event.keyCode === 27){
//close the wizard when esc key is pressed
$(wizardHeader).find('button.ajs-close').click();
}
}
export function findAndSetFocus(container) {
if (container.length == 0) {
return;

View File

@ -987,6 +987,9 @@ var StringCell = Backgrid.StringCell = Cell.extend({
/** @property */
className: "string-cell",
attributes: {
tabIndex: "0"
},
formatter: StringFormatter