From 66233b76c83b8e31bc1ff301352393299130a18c Mon Sep 17 00:00:00 2001
From: Aleksander Machniak <alec@alec.pl>
Date: Fri, 8 Aug 2014 12:52:26 +0200
Subject: Added folder searching in Folder Manager

---
 skins/classic/common.css             | 19 +++++++++++++++++++
 skins/classic/functions.js           | 35 +++++++++++++++++++++++++++++++++++
 skins/classic/settings.css           | 10 ++++++++++
 skins/classic/templates/folders.html | 12 +++++++++++-
 4 files changed, 75 insertions(+), 1 deletion(-)

(limited to 'skins/classic')

diff --git a/skins/classic/common.css b/skins/classic/common.css
index 74de5e407..1edc1fa16 100644
--- a/skins/classic/common.css
+++ b/skins/classic/common.css
@@ -1010,6 +1010,25 @@ div.searchbox > input
   width: 97%;
 }
 
+.listsearchbox
+{
+  border-bottom: solid 1px #ddd;
+  padding: 2px 4px 1px;
+  display: none;
+  background-color: #f2f2f2;
+}
+
+.listsearchbox a.iconbutton.reset
+{
+  background: url(images/icons/reset.gif) no-repeat 0 0;
+  width: 13px;
+  height: 13px;
+  text-indent: 50000px;
+  position: absolute;
+  top: 3px;
+  left: 165px;
+  overflow: hidden;
+}
 
 /***** roundcube webmail pre-defined classes *****/
 
diff --git a/skins/classic/functions.js b/skins/classic/functions.js
index b521be3bb..f17f393c2 100644
--- a/skins/classic/functions.js
+++ b/skins/classic/functions.js
@@ -636,6 +636,36 @@ enable_command: function(p)
     var label = rcmail.gettext(p.status ? 'replylist' : 'replyall');
     $('a.button.replyAll').attr('title', label);
   }
+},
+
+folder_search_init: function(container)
+{
+  // animation to unfold list search box
+  $('.boxtitle a.search', container).click(function(e) {
+    var title = $('.boxtitle', container),
+      box = $('.listsearchbox', container),
+      dir = box.is(':visible') ? -1 : 1;
+
+    box.slideToggle({
+      duration: 160,
+      progress: function(animation, progress) {
+        if (dir < 0) progress = 1 - progress;
+          $('.boxlistcontent', container).css('top', (title.outerHeight() + 24 * progress) + 'px');
+      },
+      complete: function() {
+        box.toggleClass('expanded');
+        if (box.is(':visible')) {
+          box.find('input[type=text]').focus();
+        }
+        else {
+          $('a.reset', box).click();
+        }
+        // TODO: save state in cookie
+      }
+    });
+
+    return false;
+  });
 }
 
 };
@@ -1012,5 +1042,10 @@ function rcube_init_mail_ui()
       rcmail.addEventListener('afterupload-photo', function(){ rcmail_ui.show_popup('uploadform', false); })
         .gui_object('dragmenu', 'dragmenu');
     }
+    else if (rcmail.env.task == 'settings') {
+      if (rcmail.env.action == 'folders') {
+        rcmail_ui.folder_search_init($('#folder-manager'));
+      }
+    }
   });
 }
diff --git a/skins/classic/settings.css b/skins/classic/settings.css
index fb4303f2b..cd250d57e 100644
--- a/skins/classic/settings.css
+++ b/skins/classic/settings.css
@@ -11,6 +11,16 @@
   background-color: #FFFFA6;
 }
 
+#folderlist-title a.iconbutton.search {
+  background: url(images/icons/glass.png) no-repeat 0 0;
+  cursor: pointer;
+  position: absolute;
+  right: 4px;
+  top: 2px;
+  width: 16px;
+  text-indent: 50000px;
+}
+
 #identities-table,
 #sections-table
 {
diff --git a/skins/classic/templates/folders.html b/skins/classic/templates/folders.html
index 7ca4ac49f..8ed0b5fdc 100644
--- a/skins/classic/templates/folders.html
+++ b/skins/classic/templates/folders.html
@@ -19,7 +19,17 @@
 <div id="mainscreen">
 
 <div id="folder-manager">
-<div id="folderlist-title" class="boxtitle"><span class="rightalign"><roundcube:label name="subscribed" /></span><roundcube:label name="folders" /></div>
+<div id="folderlist-title" class="boxtitle">
+    <roundcube:label name="folders" />
+    <a href="#folders" class="iconbutton search" title="<roundcube:label name='findfolders' />" tabindex="0"><roundcube:label name='findfolders' /></a>
+</div>
+<div class="listsearchbox">
+    <div class="searchbox" role="search">
+        <input type="text" name="q" id="foldersearch" placeholder="<roundcube:label name='findfolders' />" />
+        <a class="iconbutton searchicon"></a>
+        <roundcube:button command="reset-foldersearch" id="folderlistsearch-reset" class="iconbutton reset" title="resetsearch" width="13" height="13" />
+    </div>
+</div>
 <div id="folderlist-content" class="boxlistcontent">
     <roundcube:object name="foldersubscription" form="subscriptionform" id="subscription-table"
         summary="Folder subscription table" class="treelist folderlist" />
-- 
cgit v1.2.3