Folder handling UI improvements in DIMP.

Add Folder Options menu to DIMP.
Add ability to expand/collapse all folders in DIMP.

diff --git a/imp/docs/CHANGES b/imp/docs/CHANGES
index 70b5bba..ac6d0b5 100644 (file)
--- a/imp/docs/CHANGES
+++ b/imp/docs/CHANGES
@@ -2,6 +2,8 @@
 v5.0-git
 --------
 
+[mms] Add ability to expand/collapse all folders in DIMP.
+[mms] Add Folder Options menu to DIMP.
 [mms] Add save link to full message display in DIMP.
 [mms] Allow on-demand filter application (if filter backend supports) in DIMP.
 [mms] Add full IMAP subscription support to DIMP.

diff --git a/imp/js/src/DimpBase.js b/imp/js/src/DimpBase.js
index d39759e..ab3eb9d 100644 (file)
--- a/imp/js/src/DimpBase.js
+++ b/imp/js/src/DimpBase.js
@@ -619,10 +619,9 @@ var DimpBase = {
     _addMouseEvents: function(p, popdown)
     {
         if (popdown) {
-            var bidelt = $(p.id);
-            bidelt.insert({ after: new Element('SPAN', { className: 'iconImg popdownImg popdown', id: p.id + '_img' }) });
+            popdown.insert({ after: new Element('SPAN', { className: 'iconImg popdownImg popdown', id: p.id + '_img' }) });
             p.id += '_img';
-            p.offset = bidelt.up();
+            p.offset = popdown.up();
             p.left = true;
         }
 
@@ -689,6 +688,22 @@ var DimpBase = {
             this.createSubFolder(baseelt);
             break;
 
+        case 'ctx_folderopts_new':
+            this.createBaseFolder();
+            break;
+
+        case 'ctx_folderopts_sub':
+        case 'ctx_folderopts_unsub':
+            this.toggleSubscribed();
+            break;
+
+        case 'ctx_folderopts_expand':
+        case 'ctx_folderopts_collapse':
+            $('normalfolders').select('LI.folder').each(function(f) {
+                this._toggleSubFolder(f, id == 'ctx_folderopts_expand' ? 'exp' : 'col', true);
+            }.bind(this));
+            break;
+
         case 'ctx_message_spam':
         case 'ctx_message_ham':
             this.reportSpam(id == 'ctx_message_spam');
@@ -722,10 +737,6 @@ var DimpBase = {
             this.togglePreviewPane();
             break;
 
-        case 'mboxsubtoggle':
-            this.toggleSubscribed();
-            break;
-
         case 'oa_blacklist':
         case 'oa_whitelist':
             this.blacklist(id == 'oa_blacklist');
@@ -1579,9 +1590,8 @@ var DimpBase = {
                 e.stop();
                 return;
 
-            case 'newfolder':
-                this.createBaseFolder();
-                e.stop();
+            case 'folderopts':
+                DimpCore.DMenu.trigger($('folderopts_img'), true);
                 return;
 
             case 'button_forward':
@@ -1909,20 +1919,12 @@ var DimpBase = {
         }
     },
 
-    _toggleSubFolder: function(base, mode)
+    _toggleSubFolder: function(base, mode, noeffect)
     {
         base = $(base);
 
         var s,
-            id = base.readAttribute('id'),
-            opts = {
-                duration: 0.2,
-                queue: {
-                    position: 'end',
-                    scope: 'subfolder',
-                    limit: 2
-                }
-            };
+            id = base.readAttribute('id');
 
         /* Strip off the specialContainer suffix. */
         if (base.hasClassName('specialContainer')) {
@@ -1936,7 +1938,19 @@ var DimpBase = {
              (mode == 'exp' && !s.visible()) ||
              (mode == 'col' && s.visible()))) {
             base.firstDescendant().toggleClassName('exp').toggleClassName('col');
-            Effect.toggle(s, 'blind', opts);
+
+            if (noeffect) {
+                s.toggle();
+            } else {
+                Effect.toggle(s, 'blind', {
+                    duration: 0.2,
+                    queue: {
+                        limit: 3,
+                        position: 'end',
+                        scope: 'subfolder'
+                    }
+                });
+            }
         }
     },
 
@@ -2114,9 +2128,9 @@ var DimpBase = {
     toggleSubscribed: function()
     {
         this.showunsub = !this.showunsub;
-        $('mboxsubtoggle').setText(this.showunsub ? DIMP.text.hide_unsub : DIMP.text.show_unsub);
         $('foldersLoading').show();
         $('foldersSidebar').hide();
+        $('ctx_folderopts_sub', 'ctx_folderopts_unsub').invoke('toggle');
 
         // TODO - Only do for unsub -> sub switch
         [ $('specialfolders').childElements(), $('dropbase').nextSiblings() ].flatten().each(function(elt) {
@@ -2411,7 +2425,9 @@ var DimpBase = {
         this._setFilterText(true);
 
         /* Add popdown menus. Check for disabled compose at the same time. */
-        this._addMouseEvents({ id: 'button_other', type: 'otheractions' }, true);
+        this._addMouseEvents({ id: 'button_other', type: 'otheractions' }, $('button_other'));
+        this._addMouseEvents({ id: 'folderopts', type: 'folderopts' }, $('folderopts').down(1));
+
         DM.addSubMenu('ctx_message_reply', 'ctx_reply');
         [ 'ctx_message_', 'oa_', 'ctx_draft_' ].each(function(i) {
             if ($(i + 'setflag')) {
@@ -2423,7 +2439,7 @@ var DimpBase = {
         if (DIMP.conf.disable_compose) {
             $('button_reply', 'button_forward').compact().invoke('up', 'SPAN').concat($('button_compose', 'composelink', 'ctx_contacts_new')).compact().invoke('remove');
         } else {
-            this._addMouseEvents({ id: 'button_reply', type: 'reply' }, true);
+            this._addMouseEvents({ id: 'button_reply', type: 'reply' }, $('button_reply'));
             DM.disable('button_reply_img', true, true);
         }
 
@@ -2531,14 +2547,14 @@ DimpBase._folderDragConfig = {
     threshold: 5,
     onDrag: function(d, e) {
         if (!d.wasDragged) {
-            $('newfolder').hide();
+            $('folderopts').hide();
             $('dropbase').show();
             d.ghost.removeClassName('on');
         }
     },
     onEnd: function(d, e) {
         if (d.wasDragged) {
-            $('newfolder').show();
+            $('folderopts').show();
             $('dropbase').hide();
         }
     }

diff --git a/imp/templates/index/index-dimp.inc b/imp/templates/index/index-dimp.inc
index a6d227c..fcf44c6 100644 (file)
--- a/imp/templates/index/index-dimp.inc
+++ b/imp/templates/index/index-dimp.inc
@@ -117,9 +117,9 @@ function _simpleButton($id, $text, $image, $imagedir = null)
     <div class="sepfull" style="width:<?php echo $sidebar_width ?>"></div>
     <div id="myfolders"><?php echo _("My Folders") ?></div>
     <ul class="folderlist" id="normalfolders">
-     <li class="folder" id="newfolder">
-      <div class="iconDiv create"></div>
-      <a title="<?php echo _("New Folder") ?>"><?php echo _("New Folder") ?></a>
+     <li class="folder" id="folderopts">
+      <div class="iconDiv base"></div>
+      <a title="<?php echo _("Folder Options") ?>"><?php echo _("Folder Options") ?></a>
      </li>
      <li class="folder" id="dropbase" style="display:none">
       <div class="iconDiv base"></div>
@@ -352,6 +352,16 @@ function _simpleButton($id, $text, $image, $imagedir = null)
  <a id="ctx_container_rename"><span class="contextImg"></span><?php echo _("Rename Folder") ?></a>
 </div>
 
+<div class="context" id="ctx_folderopts" style="display:none">
+ <a id="ctx_folderopts_new"><span class="contextImg"></span><?php echo _("New Folder") ?></a>
+<?php if ($conf['user']['allow_folders'] && $use_sub): ?>
+ <a id="ctx_folderopts_sub" style="display:none"><span class="contextImg"></span><?php echo _("Hide Unsubscribed") ?></a>
+ <a id="ctx_folderopts_unsub"><span class="contextImg"></span><?php echo _("Show Unsubscribed") ?></a>
+<?php endif; ?>
+ <a id="ctx_folderopts_expand"><span class="contextImg"></span><?php echo _("Expand All") ?></a>
+ <a id="ctx_folderopts_collapse"><span class="contextImg"></span><?php echo _("Collapse All") ?></a>
+</div>
+
 <div class="context" id="ctx_message" style="display:none">
  <a id="ctx_message_reply"><span class="contextImg"></span><?php echo _("Reply") ?></a>
  <a id="ctx_message_forward" class="sep"><span class="contextImg"></span><?php echo _("Forward") ?></a>
@@ -397,9 +407,6 @@ function _simpleButton($id, $text, $image, $imagedir = null)
 
 <div class="context" id="ctx_otheractions" style="display:none">
  <a id="previewtoggle" class="sep"><span class="contextImg"></span><?php echo ($prefs->getValue('dimp_show_preview') ? _("Hide Preview") : _("Show Preview")); ?></a>
-<?php if ($conf['user']['allow_folders'] && $use_sub): ?>
- <a id="mboxsubtoggle" class="sep"><span class="contextImg"></span><?php echo _("Show Unsubscribed") ?></a>
-<?php endif; ?>
 <?php if (!empty($flag_list)): ?>
  <a id="oa_setflag"><span class="contextImg"></span><?php echo _("Mark as") ?></a>
  <a id="oa_unsetflag" class="sep"><span class="contextImg"></span><?php echo _("Unmark as") ?></a>

diff --git a/imp/templates/javascript_defs_dimp.php b/imp/templates/javascript_defs_dimp.php
index a45ab0a..77ab16b 100644 (file)
--- a/imp/templates/javascript_defs_dimp.php
+++ b/imp/templates/javascript_defs_dimp.php
@@ -100,7 +100,6 @@ $code['text'] = array(
     'empty_folder' => _("Permanently delete all messages in %s?"),
     'getmail' => Horde::highlightAccessKey(addslashes(_("_Get Mail")), Horde::getAccessKey(_("_Get Mail"), true)),
     'hide_preview' => _("Hide Preview"),
-    'hide_unsub' => _("Hide Unsubscribed"),
     'hidealog' => _("Hide Alerts Log"),
     'listmsg_wait' => _("The server is still generating the message list."),
     'listmsg_timeout' => _("The server was unable to generate the message list."),
@@ -119,7 +118,6 @@ $code['text'] = array(
     'rename_prompt' => _("Rename folder to:"),
     'search' => _("Search"),
     'show_preview' => _("Show Preview"),
-    'show_unsub' => _("Show Unsubscribed"),
     'showalog' => Horde::highlightAccessKey(addslashes(_("_Alerts Log")), Horde::getAccessKey(_("_Alerts Log"), true)),
     'verify' => _("Verifying..."),
     'vp_empty' => _("There are no messages in this mailbox."),

diff --git a/imp/themes/screen-dimp.css b/imp/themes/screen-dimp.css
index f7209d1..76f0f8b 100644 (file)
--- a/imp/themes/screen-dimp.css
+++ b/imp/themes/screen-dimp.css
@@ -333,18 +333,15 @@ div.vpRow.flagDeleted {
     height: 100%;
     background-repeat: no-repeat;
 }
-#sidebarPanel div.base, #mboxsubtoggle span.contextImg, #ctx_folder_sub span.contextImg, #ctx_folder_unsub span.contextImg {
+#sidebarPanel div.base, #ctx_folder_sub span.contextImg, #ctx_folder_unsub span.contextImg, #ctx_folderopts_sub span.contextImg, #ctx_folderopts_unsub span.contextImg {
     background-image: url("graphics/folder.png");
 }
-#sidebarPanel div.col {
+#sidebarPanel div.col, #ctx_folderopts_collapse span.contextImg {
     background-image: url("graphics/folder_minus.png");
 }
-#sidebarPanel div.exp {
+#sidebarPanel div.exp, #ctx_folderopts_expand span.contextImg {
     background-image: url("graphics/folder_plus.png");
 }
-#sidebarPanel div.create {
-    background-image: url("graphics/folder_create.png");
-}
 #sidebarPanel div.drafts {
     background-image: url("graphics/folder_drafts.png");
 }
@@ -378,6 +375,11 @@ div.vpRow.flagDeleted {
     overflow: hidden;
 }
 
+#folderopts a {
+    display: inline !important;
+    padding-right: 2px;
+}
+
 /* Options */
 .dimpOptions {
     float: right;
@@ -942,7 +944,7 @@ span.dimpactionDrafts {
 #oa_selectall span.contextImg {
     background-image: url("graphics/tick.png");
 }
-#ctx_folder_create span.contextImg, #ctx_container_create span.contextImg {
+#ctx_folder_create span.contextImg, #ctx_container_create span.contextImg, #ctx_folderopts_new span.contextImg {
     background-image: url("graphics/folders/folder_create.png");
 }
 #ctx_folder_rename span.contextImg, #ctx_container_rename span.contextImg {

diff --git a/imp/themes/silver/screen-dimp.css b/imp/themes/silver/screen-dimp.css
index 5e2019f..9e57071 100644 (file)
--- a/imp/themes/silver/screen-dimp.css
+++ b/imp/themes/silver/screen-dimp.css
@@ -1,15 +1,12 @@
-#sidebarPanel div.base, #mboxsubtoggle span.contextImg, #ctx_folder_sub span.contextImg, #ctx_folder_unsub span.contextImg {
+#sidebarPanel div.base, #ctx_folder_sub span.contextImg, #ctx_folder_unsub span.contextImg, #ctx_folderopts_sub span.contextImg, #ctx_folderopts_unsub span.contextImg {
     background-image: url("graphics/folder.png");
 }
-#sidebarPanel div.col {
+#sidebarPanel div.col, #ctx_folderopts_collapse span.contextImg {
     background-image: url("graphics/folder_minus.png");
 }
-#sidebarPanel div.exp {
+#sidebarPanel div.exp, #ctx_folderopts_expand span.contextImg {
     background-image: url("graphics/folder_plus.png");
 }
-#sidebarPanel div.create {
-    background-image: url("graphics/folder_create.png");
-}
 #sidebarPanel div.drafts {
     background-image: url("graphics/folder_drafts.png");
 }
@@ -115,7 +112,7 @@ span.dimpactionDrafts {
 #oa_selectall span.contextImg {
     background-image: url("graphics/tick.png");
 }
-#ctx_folder_create span.contextImg, #ctx_container_create span.contextImg {
+#ctx_folder_create span.contextImg, #ctx_container_create span.contextImg, #ctx_folderopts_new span.contextImg {
     background-image: url("graphics/folders/folder_create.png");
 }
 #ctx_folder_rename span.contextImg, #ctx_container_rename span.contextImg {