Better button disabling in compose screen

diff --git a/imp/js/DimpBase.js b/imp/js/DimpBase.js
index bbf08c7..f9d8713 100644 (file)
--- a/imp/js/DimpBase.js
+++ b/imp/js/DimpBase.js
@@ -1484,11 +1484,7 @@ var DimpBase = {
     /* Enable/Disable DIMP action buttons as needed. */
     toggleButtons: function()
     {
-        var disable = (this.selectedCount() == 0);
-        $('dimpmain_folder_top').select('DIV.dimpActions A.noselectDisable').each(function(b) {
-            [ b.up() ].invoke(disable ? 'addClassName' : 'removeClassName', 'disabled');
-            DimpCore.DMenu.disable(b.readAttribute('id') + '_img', true, disable);
-        });
+        DimpCore.toggleButtons($('dimpmain_folder_top').select('DIV.dimpActions A.noselectDisable'), this.selectedCount() == 0);
     },
 
     /* Drag/Drop handler. */
@@ -2580,16 +2576,7 @@ var DimpBase = {
 
     loadingImg: function(id, show)
     {
-        var c;
-
-        if (show) {
-            $(id + 'Loading').clonePosition(id == 'viewport' ? 'msgSplitPane' : 'previewPane', { setLeft: false, setTop: true, setHeight: false, setWidth: false }).show();
-            c = 'progress';
-        } else {
-            $(id + 'Loading').fade({ duration: 0.2 });
-            c = 'default';
-        }
-        $(document.body).setStyle({ cursor: c });
+        DimpCore.loadingImg(id + 'Loading', id == 'viewport' ? 'msgSplitPane' : 'previewPane');
     },
 
     // p = (element) Parent element

diff --git a/imp/js/DimpCore.js b/imp/js/DimpCore.js
index 24106a3..016a546 100644 (file)
--- a/imp/js/DimpCore.js
+++ b/imp/js/DimpCore.js
@@ -282,6 +282,30 @@ var DimpCore = {
         }
     },
 
+    loadingImg: function(elt, id, show)
+    {
+        var c;
+
+        if (show) {
+            $(elt).clonePosition(id, { setLeft: false, setTop: true, setHeight: false, setWidth: false }).show();
+            c = 'progress';
+        } else {
+            $(elt).fade({ duration: 0.2 });
+            c = 'default';
+        }
+        $(document.body).setStyle({ cursor: c });
+    },
+
+    toggleButtons: function(elts, disable)
+    {
+        elts.each(function(b) {
+            [ b.up() ].invoke(disable ? 'addClassName' : 'removeClassName', 'disabled');
+            if (this.DMenu) {
+                this.DMenu.disable(b.identify() + '_img', true, disable);
+            }
+        }, this);
+    },
+
     /* Add dropdown menus to addresses. */
     buildAddressLinks: function(alist, elt)
     {

diff --git a/imp/js/compose-dimp.js b/imp/js/compose-dimp.js
index 84250f1..35e59b9 100644 (file)
--- a/imp/js/compose-dimp.js
+++ b/imp/js/compose-dimp.js
@@ -9,10 +9,9 @@
 
 var DimpCompose = {
     // Variables defaulting to empty/false:
-    //   auto_save_interval, button_pressed, compose_cursor, dbtext,
-    //   drafts_mbox, editor_on, is_popup, knl_sm, knl_p, mp_padding, resizebcc,
-    //   resizecc, resizeto, row_height, rte, sbtext, skip_spellcheck,
-    //   spellcheck, uploading
+    //   auto_save_interval, compose_cursor, disabled, drafts_mbox, editor_on,
+    //   is_popup, knl_p, knl_sm, mp_padding, resizebcc, resizecc, resizeto,
+    //   row_height, rte, skip_spellcheck, spellcheck, uploading
     last_msg: '',
 
     confirmCancel: function()
@@ -187,8 +186,7 @@ var DimpCompose = {
 
     uniqueSubmit: function(action)
     {
-        var db, sb,
-            c = $('compose');
+        var c = $('compose');
 
         if (DIMP.SpellCheckerObject &&
             DIMP.SpellCheckerObject.isActive()) {
@@ -197,7 +195,7 @@ var DimpCompose = {
         }
 
         if (action == 'send_message' || action == 'save_draft') {
-            this.button_pressed = true;
+            this.setDisabled(true);
 
             switch (action) {
             case 'send_message':
@@ -213,26 +211,12 @@ var DimpCompose = {
                     DIMP.SpellCheckerObject.spellCheck(this.onNoSpellError.bind(this, action));
                     return;
                 }
-
-                if (!this.sbtext) {
-                    sb = $('send_button');
-                    this.sbtext = sb.getText();
-                    sb.setText(DIMP.text_compose.sending);
-                }
-                break;
-
-            case 'save_draft':
-                if (!this.dbtext) {
-                    db = $('draft_button');
-                    this.dbtext = db.getText();
-                    db.setText(DIMP.text_compose.saving);
-                }
                 break;
             }
 
             // Don't send/save until uploading is completed.
             if (this.uploading) {
-                (function() { if (this.button_pressed) { this.uniqueSubmit(action); } }).bind(this).delay(0.25);
+                (function() { if (this.disabled) { this.uniqueSubmit(action); } }).bind(this).delay(0.25);
                 return;
             }
         }
@@ -275,7 +259,7 @@ var DimpCompose = {
             switch (d.action) {
             case 'auto_save_draft':
             case 'save_draft':
-                this.button_pressed = false;
+                this.setDisabled(false);
 
                 this.updateDraftsMailbox();
 
@@ -291,7 +275,6 @@ var DimpCompose = {
                 break;
 
             case 'send_message':
-                this.button_pressed = false;
                 if (this.is_popup) {
                     if (d.reply_type) {
                         DIMP.baseWindow.DimpBase.flag(d.reply_type == 'reply' ? '\\answered' : '$forwarded', true, { uid: d.uid, mailbox: d.reply_folder, noserver: true });
@@ -322,11 +305,11 @@ var DimpCompose = {
                 if (d.success) {
                     this.addAttach(d.info.number, d.info.name, d.info.type, d.info.size);
                 } else {
-                    this.button_pressed = false;
+                    this.setDisabled(false);
                 }
                 if (DIMP.conf_compose.attach_limit != -1 &&
                     $('attach_list').childElements().size() > DIMP.conf_compose.attach_limit) {
-                    $('upload').writeAttribute('disabled', false);
+                    $('upload').enable();
                     elt = new Element('DIV', [ DIMP.text_compose.atc_limit ]);
                 } else {
                     elt = new Element('INPUT', { type: 'file', name: 'file_1' });
@@ -336,21 +319,20 @@ var DimpCompose = {
                 this.resizeMsgArea();
                 break;
             }
-        } else {
-            this.button_pressed = false;
         }
 
+        this.setDisabled(false);
         $('compose').setStyle({ cursor: null });
+    },
 
-        // Re-enable buttons if needed.
-        if (!this.button_pressed) {
-            if (this.sbtext) {
-                $('send_button').setText(this.sbtext);
-            }
-            if (this.dbtext) {
-                $('draft_button').setText(this.dbtext);
-            }
-            this.dbtext = this.sbtext = null;
+    setDisabled: function(disable)
+    {
+        this.disabled = disable;
+        DimpCore.loadingImg('sendingImg', 'composeMessageParent', disable);
+        DimpCore.toggleButtons($('compose').select('DIV.dimpActions A'), disable);
+        [ $('compose') ].invoke(disable ? 'disable' : 'enable');
+        if (DIMP.SpellCheckerObject) {
+            DIMP.SpellCheckerObject.disable(disable);
         }
     },
 
@@ -743,7 +725,9 @@ var DimpCompose = {
 
             case 'draft_button':
             case 'send_button':
-                this.uniqueSubmit(id == 'send_button' ? 'send_message' : 'save_draft');
+                if (!this.disabled) {
+                    this.uniqueSubmit(id == 'send_button' ? 'send_message' : 'save_draft');
+                }
                 break;
 
             case 'htmlcheckbox':
@@ -836,7 +820,7 @@ var DimpCompose = {
                 onChoose: this.setSentMailLabel.bind(this)
             });
             this.knl_sm.setSelected(this.getIdentity($F('identity'))[3]);
-            $('sent_mail_folder_label').insert({ after: new Element('SPAN', { className: 'popdownImg' }).observe('click', function(e) { this.knl_sm.show(); this.knl_sm.ignoreClick(e); e.stop(); }.bindAsEventListener(this)) });
+            $('sent_mail_folder_label').insert({ after: new Element('SPAN', { className: 'popdownImg' }).observe('click', function(e) { if (!this.disabled) { this.knl_sm.show(); this.knl_sm.ignoreClick(e); e.stop(); } }.bindAsEventListener(this)) });
         }
 
         /* Create priority list. */
@@ -847,7 +831,7 @@ var DimpCompose = {
                 onChoose: this.setPriorityLabel.bind(this)
             });
             this.setPriorityLabel('normal');
-            $('priority_label').insert({ after: new Element('SPAN', { className: 'popdownImg' }).observe('click', function(e) { this.knl_p.show(); this.knl_p.ignoreClick(e); e.stop(); }.bindAsEventListener(this)) });
+            $('priority_label').insert({ after: new Element('SPAN', { className: 'popdownImg' }).observe('click', function(e) { if (!this.disabled) { this.knl_p.show(); this.knl_p.ignoreClick(e); e.stop(); } }.bindAsEventListener(this)) });
         }
 
         $('dimpLoading').hide();

diff --git a/imp/templates/chunks/compose.php b/imp/templates/chunks/compose.php
index 22fb6c5..64a3479 100644 (file)
--- a/imp/templates/chunks/compose.php
+++ b/imp/templates/chunks/compose.php
@@ -142,4 +142,6 @@ $compose_disable = !IMP::canCompose();
 </div>
 </form>
 
+<span id="sendingImg" class="loadingImg" style="display:none"></span>
+
 <iframe name="submit_frame" id="submit_frame" style="display:none" src="javascript:false;"></iframe>

diff --git a/imp/templates/javascript_defs_dimp.php b/imp/templates/javascript_defs_dimp.php
index d56523f..7db58a6 100644 (file)
--- a/imp/templates/javascript_defs_dimp.php
+++ b/imp/templates/javascript_defs_dimp.php
@@ -173,8 +173,6 @@ if ($compose_mode) {
         'fillform' => _("You have already changed the message body, are you sure you want to drop the changes?"),
         'nosubject' => _("The message does not have a Subject entered.") . "\n" . _("Send message without a Subject?"),
         'remove' => _("Remove"),
-        'saving' => _("Saving..."),
-        'sending' => _("Sending..."),
         'toggle_html' => _("Really discard all formatting information? This operation cannot be undone."),
         'uploading' => _("Uploading..."),
     );

diff --git a/imp/themes/screen-dimp.css b/imp/themes/screen-dimp.css
index 8b96a9a..e67bc4e 100644 (file)
--- a/imp/themes/screen-dimp.css
+++ b/imp/themes/screen-dimp.css
@@ -117,7 +117,7 @@ input {
 .mboxheader {
     clear: left;
 }
-#msgLoading, #viewportLoading {
+#msgLoading, #viewportLoading, #sendingImg {
     position: absolute;
     margin: 10px 0 0 10px;
 }
@@ -441,11 +441,11 @@ div.vpRowVert.flagUnseen {
     background-color: transparent;
 }
 .dimpactions .disabled, .dimpActions .disabled a, .dimpActions .disabled a:visited, .dimpActions .disabled a:active, .dimpActions .disabled a:hover {
+    color: silver !important;
     cursor: default;
     text-decoration: none;
-    color: silver;
 }
-.dimpActions .disabled span.iconImg, .dimpActions .disabled span.spellcheckPopdownImg {
+.dimpActions .disabled span.iconImg, .dimpActions .disabled span.spellcheckPopdownImg, .dimpActions .disabled img {
     filter: alpha(opacity=25);
     -moz-opacity: .25;
     opacity: .25;