From a0cbaf84fd86fc91cba892a7a19b0ade7c017a3c Mon Sep 17 00:00:00 2001 From: Duda Dornelles Date: Sat, 20 Dec 2014 09:25:44 -0200 Subject: #82: adding "loading..." message to sinalize an ajax call has been made --- web-ui/app/index.html | 5 ++- web-ui/app/js/helpers/monitored_ajax.js | 69 ++++++++++++++++++--------------- web-ui/app/scss/_alerts.scss | 2 +- 3 files changed, 42 insertions(+), 34 deletions(-) diff --git a/web-ui/app/index.html b/web-ui/app/index.html index 16521d37..7e3189a2 100644 --- a/web-ui/app/index.html +++ b/web-ui/app/index.html @@ -15,8 +15,9 @@
-
-
+
+
+
Loading...
diff --git a/web-ui/app/js/helpers/monitored_ajax.js b/web-ui/app/js/helpers/monitored_ajax.js index 3f5ff2fe..0ec92901 100644 --- a/web-ui/app/js/helpers/monitored_ajax.js +++ b/web-ui/app/js/helpers/monitored_ajax.js @@ -16,36 +16,43 @@ */ /*global _ */ -define( - ['page/events', - 'views/i18n'], - function(events, i18n) { - - 'use strict'; - - function monitoredAjax(on, url, config) { - if (config) { - config.timeout = 60*1000; +define(['page/events', 'views/i18n'], function (events, i18n) { + + 'use strict'; + + var messages = { + timeout: 'a timeout occurred', + error: 'problems talking to server', + parseerror: 'got invalid response from server' + }; + + function monitoredAjax(on, url, config) { + config = config || {}; + config.timeout = 60 * 1000; + + var originalBeforeSend = config.beforeSend; + config.beforeSend = function () { + $('#loading').show(); + if (originalBeforeSend) { + originalBeforeSend(); + } + }; + + var originalComplete = config.complete; + config.complete = function () { + $('#loading').hide(); + if (originalComplete) { + originalComplete(); } - return $.ajax(url, config).fail(function(xmlhttprequest, textstatus, message) { - var msg = ''; - switch (textstatus) { - case 'timeout': - msg = 'a timeout occurred'; - break; - case 'error': - msg = 'problems talking to server'; - break; - case 'parseerror': - msg = 'got invalid response from server'; - break; - default: - msg = 'unexpected problem while talking to server'; - } - on.trigger(document, events.ui.userAlerts.displayMessage, { message: i18n(msg) }); - }.bind(this)); - } - - return monitoredAjax; + }; + + return $.ajax(url, config).fail(function (xmlhttprequest, textstatus, message) { + var msg = messages[textstatus] || 'unexpected problem while talking to server'; + on.trigger(document, events.ui.userAlerts.displayMessage, { message: i18n(msg) }); + }.bind(this)); + } -); + + return monitoredAjax; + +}); diff --git a/web-ui/app/scss/_alerts.scss b/web-ui/app/scss/_alerts.scss index 16171fd7..bd1210df 100644 --- a/web-ui/app/scss/_alerts.scss +++ b/web-ui/app/scss/_alerts.scss @@ -1,4 +1,4 @@ -#user-alerts { +.message-panel { width: 100%; margin: 10px auto; position: fixed; -- cgit v1.2.3