From 0b36d151572e050b51d82e7429fee847ebb33e22 Mon Sep 17 00:00:00 2001 From: Aleksander Machniak Date: Thu, 20 Nov 2014 06:03:22 -0500 Subject: Add method to display operation (uploading) progress in UI message --- program/include/rcmail.php | 2 +- program/js/app.js | 64 +++++++++++++++++++++++++++++++++++++++------- 2 files changed, 56 insertions(+), 10 deletions(-) (limited to 'program') diff --git a/program/include/rcmail.php b/program/include/rcmail.php index 527b74e39..f0c363131 100644 --- a/program/include/rcmail.php +++ b/program/include/rcmail.php @@ -439,7 +439,7 @@ class rcmail extends rcube // add some basic labels to client $this->output->add_label('loading', 'servererror', 'connerror', 'requesttimedout', - 'refreshing', 'windowopenerror'); + 'refreshing', 'windowopenerror', 'uploadingmany'); return $this->output; } diff --git a/program/js/app.js b/program/js/app.js index 984dddf14..fd0d2e12f 100644 --- a/program/js/app.js +++ b/program/js/app.js @@ -556,7 +556,7 @@ function rcube_webmail() // show message if (this.pending_message) - this.display_message(this.pending_message[0], this.pending_message[1], this.pending_message[2]); + this.display_message.apply(this, this.pending_message); // init treelist widget if (this.gui_objects.folderlist && window.rcube_treelist_widget) { @@ -6347,7 +6347,7 @@ function rcube_webmail() }; // display a system message, list of types in common.css (below #message definition) - this.display_message = function(msg, type, timeout) + this.display_message = function(msg, type, timeout, key) { // pass command to parent window if (this.is_framed()) @@ -6356,18 +6356,34 @@ function rcube_webmail() if (!this.gui_objects.message) { // save message in order to display after page loaded if (type != 'loading') - this.pending_message = [msg, type, timeout]; + this.pending_message = [msg, type, timeout, key]; return 1; } - type = type ? type : 'notice'; + if (!type) + type = 'notice'; - var key = this.html_identifier(msg), - date = new Date(), + if (!key) + key = this.html_identifier(msg); + + var date = new Date(), id = type + date.getTime(); - if (!timeout) - timeout = this.message_time * (type == 'error' || type == 'warning' ? 2 : 1); + if (!timeout) { + switch (type) { + case 'error': + case 'warning': + timeout = this.message_time * 2; + break; + + case 'uploading': + timeout = 0; + break; + + default: + timeout = this.message_time; + } + } if (type == 'loading') { key = 'loading'; @@ -6400,7 +6416,7 @@ function rcube_webmail() if (type == 'loading') { this.messages[key].labels = [{'id': id, 'msg': msg}]; } - else { + else if (type != 'uploading') { obj.click(function() { return ref.hide_message(obj); }) .attr('role', 'alert'); } @@ -6409,6 +6425,7 @@ function rcube_webmail() if (timeout > 0) setTimeout(function() { ref.hide_message(id, type != 'loading'); }, timeout); + return id; }; @@ -6487,6 +6504,35 @@ function rcube_webmail() this.messages = {}; }; + // display uploading message with progress indicator + // data should contain: name, total, current, percent, text + this.display_progress = function(data) + { + if (!data || !data.name) + return; + + var msg = this.messages['progress' + data.name]; + + if (!data.label) + data.label = this.get_label('uploadingmany'); + + if (!msg) { + if (!data.percent || data.percent < 100) + this.display_message(data.label, 'uploading', 0, 'progress' + data.name); + return; + } + + if (!data.total || data.percent >= 100) { + this.hide_message(msg.obj); + return; + } + + if (data.text) + data.label += ' ' + data.text; + + msg.obj.text(data.label); + }; + // open a jquery UI dialog with the given content this.show_popup_dialog = function(content, title, buttons, options) { -- cgit v1.2.3