mirror of
https://github.com/pgadmin-org/pgadmin4.git
synced 2025-02-25 18:55:31 -06:00
Improve network/server activity feedback for the user. Fixes #1751
This commit is contained in:
parent
f9dacc5237
commit
3b4776ab5f
@ -26,9 +26,11 @@ function(_, S, pgAdmin) {
|
||||
'FALSE': "{{ _("False") }}",
|
||||
'NOTE_CTRL_LABEL': "{{ _("Note") }}",
|
||||
'ERR_RETRIEVAL_INFO': "{{ _("Error retrieving the information - %s") }}",
|
||||
'CONNECTION_LOST': "{{ _("Connection to the server has been lost!") }}",
|
||||
'CONNECTION_LOST': "{{ _("Connection to the server has been lost.") }}",
|
||||
'SELECT_ALL': "{{ _("Select All") }}",
|
||||
'UNSELECT_ALL': "{{ _("Unselect All") }}"
|
||||
'UNSELECT_ALL': "{{ _("Unselect All") }}",
|
||||
'LOADING_MESSAGE': "{{ _("Retrieving data from the server...") }}",
|
||||
'LOADING_FAILED': "{{ _("Failed to retrieve data from the server.") }}"
|
||||
};
|
||||
|
||||
{% for key in current_app.messages.keys() %}
|
||||
|
@ -276,8 +276,22 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, pgBrowser, Backform) {
|
||||
|
||||
if (!newModel.isNew()) {
|
||||
// This is definetely not in create mode
|
||||
var msgDiv = '<div class="alert alert-info pg-panel-message pg-panel-properties-message">'+
|
||||
pgBrowser.messages['LOADING_MESSAGE']+'</div>',
|
||||
$msgDiv = $(msgDiv);
|
||||
var timer = setTimeout(function(ctx) {
|
||||
// notify user if request is taking longer than 1 second
|
||||
|
||||
if (!_.isUndefined(ctx)) {
|
||||
$msgDiv.appendTo(ctx);
|
||||
}
|
||||
}, 1000, ctx);
|
||||
newModel.fetch()
|
||||
.success(function(res, msg, xhr) {
|
||||
// clear timeout and remove message
|
||||
clearTimeout(timer);
|
||||
$msgDiv.addClass('hidden');
|
||||
|
||||
// We got the latest attributes of the
|
||||
// object. Render the view now.
|
||||
view.render();
|
||||
@ -934,7 +948,7 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, pgBrowser, Backform) {
|
||||
'pg-prop-footer'
|
||||
).appendTo(j);
|
||||
// Create a view to show the properties in fieldsets
|
||||
view = that.getView(item, 'properties', content, data, 'fieldset');
|
||||
view = that.getView(item, 'properties', content, data, 'fieldset', undefined, j);
|
||||
if (view) {
|
||||
// Save it for release it later
|
||||
j.data('obj-view', view);
|
||||
@ -1135,7 +1149,13 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, pgBrowser, Backform) {
|
||||
// Save the changes
|
||||
btn.click(function() {
|
||||
var m = view.model,
|
||||
d = m.toJSON(true);
|
||||
d = m.toJSON(true),
|
||||
|
||||
// Generate a timer for the request
|
||||
timer = setTimeout(function(){
|
||||
$('.obj_properties').addClass('show_progress');
|
||||
}, 1000);
|
||||
|
||||
if (d && !_.isEmpty(d)) {
|
||||
m.save({}, {
|
||||
attrs: d,
|
||||
@ -1143,6 +1163,10 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, pgBrowser, Backform) {
|
||||
cache: false,
|
||||
success: function() {
|
||||
onSaveFunc.call();
|
||||
// Hide progress cursor
|
||||
$('.obj_properties').removeClass('show_progress');
|
||||
clearTimeout(timer);
|
||||
|
||||
// Removing the node-prop property of panel
|
||||
// so that we show updated data on panel
|
||||
var pnlProperties = pgBrowser.docker.findPanels('properties')[0],
|
||||
@ -1169,6 +1193,10 @@ function($, _, S, pgAdmin, Menu, Backbone, Alertify, pgBrowser, Backform) {
|
||||
"{{ _("Error saving properties: %s") }}"
|
||||
).sprintf(jqxhr.statusText).value()
|
||||
);
|
||||
|
||||
// Hide progress cursor
|
||||
$('.obj_properties').removeClass('show_progress');
|
||||
clearTimeout(timer);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
define([
|
||||
'underscore', 'underscore.string', 'jquery', 'pgadmin.browser',
|
||||
'alertify', 'pgadmin.alertifyjs'
|
||||
'alertify', 'pgadmin.alertifyjs', 'pgadmin.browser.messages',
|
||||
], function(_, S, $, pgBrowser, Alertify) {
|
||||
|
||||
if (pgBrowser.ShowNodeDepends)
|
||||
@ -234,13 +234,31 @@ define([
|
||||
this.dependentGrid.columns.models[2].set({'label': 'Restriction'});
|
||||
}
|
||||
|
||||
// Hide the message container and show the grid container.
|
||||
// Hide message container and show grid container.
|
||||
$msgContainer.addClass('hidden');
|
||||
$gridContainer.removeClass('hidden');
|
||||
|
||||
var timer = setTimeout(function(){
|
||||
// notify user if request is taking longer than 1 second
|
||||
|
||||
$msgContainer.text(pgBrowser.messages['LOADING_MESSAGE']);
|
||||
$msgContainer.removeClass('hidden');
|
||||
if ($gridContainer) {
|
||||
$gridContainer.addClass('hidden');
|
||||
}
|
||||
}, 1000);
|
||||
|
||||
// Set the url, fetch the data and update the collection
|
||||
collection.url = url;
|
||||
collection.fetch({
|
||||
reset: true,
|
||||
success: function() {
|
||||
clearTimeout(timer);
|
||||
$gridContainer.removeClass('hidden');
|
||||
if (!$msgContainer.hasClass('hidden')) {
|
||||
$msgContainer.addClass('hidden');
|
||||
}
|
||||
},
|
||||
error: function(coll, xhr, error, message) {
|
||||
var _label = treeHierarchy[n_type].label;
|
||||
pgBrowser.Events.trigger(
|
||||
@ -261,6 +279,8 @@ define([
|
||||
}
|
||||
);
|
||||
}
|
||||
// show failed message.
|
||||
$msgContainer.text(pgBrowser.messages['LOADING_FAILED']);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
define([
|
||||
'underscore', 'underscore.string', 'jquery', 'pgadmin.browser',
|
||||
'alertify', 'pgadmin.alertifyjs'
|
||||
'alertify', 'pgadmin.alertifyjs', 'pgadmin.browser.messages',
|
||||
], function(_, S, $, pgBrowser, Alertify) {
|
||||
|
||||
pgBrowser.ShowNodeSQL = pgBrowser.ShowNodeSQL || {};
|
||||
@ -84,15 +84,25 @@ define([
|
||||
if (node.hasSQL) {
|
||||
|
||||
sql = '';
|
||||
var url = node.generate_url(item, 'sql', data, true);
|
||||
var url = node.generate_url(item, 'sql', data, true),
|
||||
timer;
|
||||
|
||||
$.ajax({
|
||||
url: url,
|
||||
type:'GET',
|
||||
beforeSend: function(jqXHR, settings) {
|
||||
// Generate a timer for the request
|
||||
timer = setTimeout(function(){
|
||||
// notify user if request is taking longer than 1 second
|
||||
|
||||
pgAdmin.Browser.editor.setValue(pgBrowser.messages['LOADING_MESSAGE']);
|
||||
}, 1000);
|
||||
},
|
||||
success: function(res) {
|
||||
if (pgAdmin.Browser.editor.getValue() != res) {
|
||||
pgAdmin.Browser.editor.setValue(res);
|
||||
}
|
||||
clearTimeout(timer);
|
||||
},
|
||||
error: function(xhr, error, message) {
|
||||
var _label = treeHierarchy[n_type].label;
|
||||
|
@ -1,6 +1,6 @@
|
||||
define([
|
||||
'underscore', 'underscore.string', 'jquery', 'pgadmin.browser', 'backgrid',
|
||||
'alertify', 'wcdocker', 'pgadmin.backgrid', 'pgadmin.alertifyjs'
|
||||
'alertify', 'wcdocker', 'pgadmin.backgrid', 'pgadmin.alertifyjs', 'pgadmin.browser.messages',
|
||||
], function(_, S, $, pgBrowser, Backgrid, Alertify) {
|
||||
|
||||
if (pgBrowser.NodeStatistics)
|
||||
@ -175,17 +175,28 @@ define([
|
||||
$(panel[0]).data('node-prop', treeHierarchy);
|
||||
|
||||
if (node.hasStatistics) {
|
||||
/* Set the message because ajax request may take time to
|
||||
* fetch the information from the server.
|
||||
*/
|
||||
msg = '';
|
||||
$msgContainer.text(msg);
|
||||
|
||||
var timer;
|
||||
// Set the url, fetch the data and update the collection
|
||||
$.ajax({
|
||||
url: url,
|
||||
type:'GET',
|
||||
beforeSend: function(jqXHR, settings) {
|
||||
// Generate a timer for the request
|
||||
timer = setTimeout(function(){
|
||||
// notify user if request is taking longer than 1 second
|
||||
|
||||
$msgContainer.text(pgBrowser.messages['LOADING_MESSAGE']);
|
||||
$msgContainer.removeClass('hidden');
|
||||
if (self.grid) {
|
||||
self.grid.remove();
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
success: function(res) {
|
||||
// clear timer and reset message.
|
||||
clearTimeout(timer);
|
||||
$msgContainer.text('');
|
||||
if (res.data) {
|
||||
var data = res.data;
|
||||
if (node.hasCollectiveStatistics || data['rows'].length > 1) {
|
||||
@ -241,6 +252,8 @@ define([
|
||||
}
|
||||
);
|
||||
}
|
||||
// show failed message.
|
||||
$msgContainer.text(pgBrowser.messages['LOADING_FAILED']);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
@ -760,3 +760,9 @@ lgg-el-container[el=md] .pg-el-lg-8,
|
||||
.pgadmin-controls > textarea.form-control {
|
||||
padding: 3px 6px;
|
||||
}
|
||||
.pg-panel-properties-message {
|
||||
margin-top: 50px !important;
|
||||
}
|
||||
.show_progress {
|
||||
cursor: progress;
|
||||
}
|
||||
|
@ -266,6 +266,10 @@ define(
|
||||
$.ajax({
|
||||
url: baseUrl,
|
||||
method: 'GET',
|
||||
beforeSend: function(jqXHR, settings) {
|
||||
// set cursor to progress before every poll.
|
||||
$('.debugger-container').addClass('show_progress');
|
||||
},
|
||||
success: function(res) {
|
||||
if (res.data.status === 'Success') {
|
||||
// If no result then poll again to wait for results.
|
||||
@ -313,6 +317,8 @@ define(
|
||||
self.GetStackInformation(trans_id);
|
||||
}
|
||||
|
||||
// remove progress cursor
|
||||
$('.debugger-container').removeClass('show_progress');
|
||||
// Enable all the buttons as we got the results
|
||||
self.enable('stop', true);
|
||||
self.enable('step_over', true);
|
||||
|
Loading…
Reference in New Issue
Block a user