diff options
author | Aleksander Machniak <alec@alec.pl> | 2014-08-08 12:52:26 +0200 |
---|---|---|
committer | Aleksander Machniak <alec@alec.pl> | 2014-08-08 12:52:26 +0200 |
commit | 66233b76c83b8e31bc1ff301352393299130a18c (patch) | |
tree | f9b1d88a7699aa8e1e6ddfb16b691b6c48a6e67a /skins/classic | |
parent | 00dd283999fd42870bc2ea8412a4e39f7c52060c (diff) |
Added folder searching in Folder Manager
Diffstat (limited to 'skins/classic')
-rw-r--r-- | skins/classic/common.css | 19 | ||||
-rw-r--r-- | skins/classic/functions.js | 35 | ||||
-rw-r--r-- | skins/classic/settings.css | 10 | ||||
-rw-r--r-- | skins/classic/templates/folders.html | 12 |
4 files changed, 75 insertions, 1 deletions
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" /> |