Fixed accessibility issue where few dialogs are not rendering properly

when we zoomed in browser window 200% and screen resolution is low.

Fixes #5662
This commit is contained in:
Murtuza Zabuawala 2020-07-09 18:18:15 +05:30 committed by Akshay Joshi
parent 3c08e618bd
commit 2db9242f5c
9 changed files with 61 additions and 10 deletions

View File

@ -34,3 +34,4 @@ Bug fixes
| `Issue #5630 <https://redmine.postgresql.org/issues/5630>`_ - Fixed an issue where installation of pgadmin4 not working on 32-bit Windows.
| `Issue #5631 <https://redmine.postgresql.org/issues/5631>`_ - Fixed 'cant execute empty query' issue when remove the value of 'USING' or 'WITH CHECK' option of RLS Policy.
| `Issue #5633 <https://redmine.postgresql.org/issues/5633>`_ - Ensure that create RLS Policy menu should not be visible for catalog objects.
| `Issue #5662 <https://redmine.postgresql.org/issues/5662>`_ - Fixed accessibility issue where few dialogs are not rendering properly when we zoomed in browser window 200% and screen resolution is low.

View File

@ -171,12 +171,41 @@ define('pgadmin.browser', [
md: 700,
lg: 900,
default: 500,
// If you change above values then make sure to update
// calc method logic
calc: () => {
let iw = window.innerWidth;
if (iw > pgAdmin.Browser.stdW.lg)
return pgAdmin.Browser.stdW.lg;
else if (iw > pgAdmin.Browser.stdW.md)
return pgAdmin.Browser.stdW.md;
else if (iw > pgAdmin.Browser.stdW.sm)
return pgAdmin.Browser.stdW.sm;
else
// if avilable screen resolution is still
// less then return the width value as it
return iw;
},
},
stdH: {
sm: 200,
md: 400,
lg: 550,
default: 550,
// If you change above values then make sure to update
// calc method logic
calc: () => {
// We are excluding sm as it is too small for dialog
let ih = window.innerHeight;
if (ih > pgAdmin.Browser.stdH.lg)
return pgAdmin.Browser.stdH.lg;
else if (ih > pgAdmin.Browser.stdH.md)
return pgAdmin.Browser.stdH.md;
else
// if avilable screen resolution is still
// less then return the height value as it
return ih;
},
},
// Default panels
panels: {

View File

@ -37,10 +37,12 @@ define('misc.file_manager', [
},
// Call dialogs subject to dialog_type param
show_dialog: function(params) {
let dialogWidth = pgAdmin.Browser.stdW.calc();
let dialogHeight = pgAdmin.Browser.stdH.calc();
if (params.dialog_type == 'create_file') {
Alertify.createModeDlg(params).resizeTo(pgAdmin.Browser.stdW.md,pgAdmin.Browser.stdH.lg);
Alertify.createModeDlg(params).resizeTo(dialogWidth, dialogHeight);
} else {
Alertify.fileSelectionDlg(params).resizeTo(pgAdmin.Browser.stdW.md,pgAdmin.Browser.stdH.lg);
Alertify.fileSelectionDlg(params).resizeTo(dialogWidth, dialogHeight);
}
},
};

View File

@ -29,7 +29,6 @@ module.exports = Alertify.dialog('fileSelectionDlg', function() {
this.set('title', params['dialog_title']);
this.params = JSON.stringify(params);
this.elements.dialog.style.minWidth = '630px';
this.show();
},

View File

@ -512,7 +512,7 @@ define('pgadmin.preferences', [
},
show: function() {
Alertify.preferencesDlg(true).resizeTo(pgAdmin.Browser.stdW.lg,pgAdmin.Browser.stdH.lg);
Alertify.preferencesDlg(true).resizeTo(pgAdmin.Browser.stdW.calc(),pgAdmin.Browser.stdH.calc());
},
};

View File

@ -650,7 +650,7 @@ define([
alertify,
BackupModel
);
dialog.draw(action, item, {'globals': true}, pgBrowser.stdW.md, pgBrowser.stdH.md);
dialog.draw(action, item, {'globals': true}, pgBrowser.stdW.calc(), pgBrowser.stdH.calc());
},
start_backup_server: function(action, item) {
let dialog = new globalBackupDialog.BackupDialog(
@ -659,7 +659,7 @@ define([
alertify,
BackupObjectModel
);
dialog.draw(action, item, {'server': true}, pgBrowser.stdW.md, pgBrowser.stdH.md);
dialog.draw(action, item, {'server': true}, pgBrowser.stdW.calc(), pgBrowser.stdH.calc());
},
// Callback to draw Backup Dialog for objects
backup_objects: function(action, treeItem) {
@ -669,7 +669,7 @@ define([
alertify,
BackupObjectModel
);
dialog.draw(action, treeItem, null, pgBrowser.stdW.md, pgBrowser.stdH.md);
dialog.draw(action, treeItem, null, pgBrowser.stdW.calc(), pgBrowser.stdH.calc());
},
};
return pgBrowser.Backup;

View File

@ -424,7 +424,7 @@ define('tools.restore', [
let dialog = new restoreDialog.RestoreDialog(
pgBrowser, $, alertify, RestoreObjectModel
);
dialog.draw(action, treeItem, pgBrowser.stdW.md, pgBrowser.stdH.md);
dialog.draw(action, treeItem, pgBrowser.stdW.calc(), pgBrowser.stdH.calc());
},
};
return pgBrowser.Restore;

View File

@ -82,7 +82,7 @@ define([
alertify,
{},
);
dialog.draw(action, item, {}, pgBrowser.stdW.md, pgBrowser.stdH.lg);
dialog.draw(action, item, {}, pgBrowser.stdW.calc(), pgBrowser.stdH.calc());
},
};

View File

@ -23,12 +23,32 @@ describe('fileSelectDialog', function () {
md: 700,
lg: 900,
default: 500,
calc: () => {
let iw = window.innerWidth;
if (iw > pgAdmin.Browser.stdW.lg)
return pgAdmin.Browser.stdW.lg;
else if (iw > pgAdmin.Browser.stdW.md)
return pgAdmin.Browser.stdW.md;
else if (iw > pgAdmin.Browser.stdW.sm)
return pgAdmin.Browser.stdW.sm;
else
return iw;
},
},
stdH: {
sm: 200,
md: 400,
lg: 550,
default: 550,
calc: () => {
let ih = window.innerHeight;
if (ih > pgAdmin.Browser.stdH.lg)
return pgAdmin.Browser.stdH.lg;
else if (ih > pgAdmin.Browser.stdH.md)
return pgAdmin.Browser.stdH.md;
else
return ih;
},
},
};