From fbad0e9ff1dae9036ee2f30bb5a4ce605fddd76f Mon Sep 17 00:00:00 2001 From: Thomas Bruederli Date: Wed, 23 Oct 2013 18:10:18 +0200 Subject: [PATCH] Show the number of occurences for each tag (#2365) and reduce visibility of those tags not matching any tasks (#2374) in the current selection --- plugins/tasklist/skins/larry/tasklist.css | 29 ++++++++++++++++- .../skins/larry/templates/mainview.html | 2 ++ plugins/tasklist/tasklist.js | 31 +++++++++++++++++-- 3 files changed, 59 insertions(+), 3 deletions(-) diff --git a/plugins/tasklist/skins/larry/tasklist.css b/plugins/tasklist/skins/larry/tasklist.css index 70ab8da9..fadb62b7 100644 --- a/plugins/tasklist/skins/larry/tasklist.css +++ b/plugins/tasklist/skins/larry/tasklist.css @@ -180,12 +180,39 @@ body.attachmentwin #topnav .topright { #tagslist li { display: inline-block; color: #004458; - margin-right: 0.5em; + padding-right: 0.2em; + margin-right: 0.3em; margin-bottom: 0.4em; min-width: 1.2em; cursor: pointer; } +#tagslist li.inactive { + color: #89b3be; +/* display: none; */ +} + +#tagslist li.inactive .count { + display: none; +} + +#tagslist li .count { + position: relative; + top: -1px; + margin-left: 5px; + padding: 0.15em 0.5em; + font-size: 80%; + font-weight: bold; + color: #59838e; + background: #c7e3ef; + box-shadow: inset 0 1px 1px 0 #b0ccd7; + -o-box-shadow: inset 0 1px 1px 0 #b0ccd7; + -webkit-box-shadow: inset 0 1px 1px 0 #b0ccd7; + -moz-box-shadow: inset 0 1px 1px 0 #b0ccd7; + border-color: #b0ccd7; + border-radius: 8px; +} + #tasklists li { margin: 0; height: 20px; diff --git a/plugins/tasklist/skins/larry/templates/mainview.html b/plugins/tasklist/skins/larry/templates/mainview.html index b85f7fbd..52463e04 100644 --- a/plugins/tasklist/skins/larry/templates/mainview.html +++ b/plugins/tasklist/skins/larry/templates/mainview.html @@ -157,6 +157,8 @@ $(document).ready(function(e){ UI.init(); new rcube_splitter({ id:'taskviewsplitter', p1:'#sidebar', p2:'#mainview-right', orientation:'v', relative:true, start:240, min:180, size:16, offset:2 }).init(); + new rcube_splitter({ id:'taskviewsplitterv', p1:'#tagsbox', p2:'#tasklistsbox', + orientation:'h', relative:true, start:242, min:120, size:16, offset:6 }).init(); }); diff --git a/plugins/tasklist/tasklist.js b/plugins/tasklist/tasklist.js index 742f23a7..2c1a921e 100644 --- a/plugins/tasklist/tasklist.js +++ b/plugins/tasklist/tasklist.js @@ -474,8 +474,9 @@ function rcube_tasklist_ui(settings) listdata[listdata[id].parent_id].children.push(id); } - render_tasklist(); append_tags(response.tags || []); + render_tasklist(); + rcmail.set_busy(false, 'loading', ui_loading); } @@ -488,6 +489,7 @@ function rcube_tasklist_ui(settings) var id, rec, count = 0, cache = {}, + activetags = {}, msgbox = $('#listmessagebox').hide(), list = $(rcmail.gui_objects.resultlist).html(''); @@ -497,10 +499,19 @@ function rcube_tasklist_ui(settings) if (match_filter(rec, cache)) { render_task(rec); count++; + + // keep a list of tags from all visible tasks + for (var t, j=0; rec.tags && j < rec.tags.length; j++) { + t = rec.tags[j]; + if (typeof activetags[t] == 'undefined') + activetags[t] = 0; + activetags[t]++; + } } } fix_tree_toggles(); + update_tagcloud(activetags); if (!count) msgbox.html(rcmail.gettext('notasksfound','tasklist')).show(); @@ -559,7 +570,7 @@ function rcube_tasklist_ui(settings) // append new tags to tag cloud $.each(newtags, function(i, tag){ - $('
  • ').attr('rel', tag).data('value', tag).html(Q(tag)).appendTo(rcmail.gui_objects.tagslist); + $('
  • ').attr('rel', tag).data('value', tag).html(Q(tag) + '').appendTo(rcmail.gui_objects.tagslist); }); // re-sort tags list @@ -568,6 +579,22 @@ function rcube_tasklist_ui(settings) }); } + /** + * Display the given counts to each tag and set those inactive which don't + * have any matching tasks in the current view. + */ + function update_tagcloud(counts) + { + $(rcmail.gui_objects.tagslist).children('li').each(function(i,li){ + var elem = $(li), tag = elem.attr('rel'), + count = counts[tag] || 0; + + elem.children('.count').html(count+''); + if (count == 0) elem.addClass('inactive'); + else elem.removeClass('inactive'); + }); + } + /** * */