plugins/tasklist

[Thomas Brüderli]

 plugins/tasklist/skins/larry/tasklist.css |   24 ++++++++++++--
 plugins/tasklist/tasklist.js              |   51 ++++++++++++++++++++++++------
 2 files changed, 64 insertions(+), 11 deletions(-)

New commits:
commit f3efd7b95b11ae8749e81cd3b4a95129026c4c0d
Author: Thomas Bruederli <thomas at roundcube.net>
Date:   Thu Jul 26 00:34:46 2012 +0200

    Allow to select tasks by multiple tags (AND); show tags in task listing

diff --git a/plugins/tasklist/skins/larry/tasklist.css b/plugins/tasklist/skins/larry/tasklist.css
index 621150d..4619914 100644
--- a/plugins/tasklist/skins/larry/tasklist.css
+++ b/plugins/tasklist/skins/larry/tasklist.css
@@ -67,7 +67,7 @@
 	display: inline-block;
 	color: #004458;
 	min-width: 4em;
-	padding: 0.2em 0.6em;
+	padding: 0.2em 0.6em 0.3em 0.6em;
 	text-align: center;
 	text-decoration: none;
 	border: 1px solid #eee;
@@ -324,7 +324,7 @@
 	-webkit-box-shadow: 0 1px 1px 0 rgba(50, 50, 50, 0.5);
 	-moz-box-shadow: 0 1px 1px 0 rgba(50, 50, 50, 0.5);
 	box-shadow: 0 1px 1px 0 rgba(50, 50, 50, 0.5);
-	padding-right: 11em;
+	padding-right: 26em;
 	white-space: nowrap;
 	overflow: hidden;
 	text-overflow: ellipsis;
@@ -367,6 +367,26 @@
 	background-position: -2px -23px;
 }
 
+.taskhead .tags {
+	position: absolute;
+	top: 4px;
+	right: 110px;
+	max-width: 14em;
+	overflow: hidden;
+	padding-top: 1px;
+	padding-bottom: 4px;
+	text-align: right;
+}
+
+.taskhead .tags .tag {
+	font-size: 85%;
+	background: #d9ecf4;
+	border: 1px solid #c2dae5;
+	border-radius: 4px;
+	padding: 2px 8px;
+	margin-right: 3px;
+}
+
 .taskhead .date {
 	position: absolute;
 	top: 6px;
diff --git a/plugins/tasklist/tasklist.js b/plugins/tasklist/tasklist.js
index 0264389..71cca8d 100644
--- a/plugins/tasklist/tasklist.js
+++ b/plugins/tasklist/tasklist.js
@@ -47,7 +47,7 @@ function rcube_tasklist(settings)
 
     /*  private vars  */
     var selector = 'all';
-    var tagsfilter = null;
+    var tagsfilter = [];
     var filtermask = FILTER_MASK_ALL;
     var loadstate = { filter:-1, lists:'', search:null };
     var idcount = 0;
@@ -146,20 +146,43 @@ function rcube_tasklist(settings)
         // click-handler on tags list
         $(rcmail.gui_objects.tagslist).click(function(e){
             if (e.target.nodeName != 'LI')
-                return;
+                return false;
 
             var item = $(e.target),
                 tag = item.data('value');
 
-            $('li', this).removeClass('selected');
-            if (tag != tagsfilter) {
+            // reset selection on regular clicks
+            var index = tagsfilter.indexOf(tag);
+            var shift = e.shiftKey || e.ctrlKey || e.metaKey;
+
+            if (!shift) {
+                if (tagsfilter.length > 1)
+                    index = -1;
+
+                $('li', this).removeClass('selected');
+                tagsfilter = [];
+            }
+
+            // add tag to filter
+            if (index < 0) {
                 item.addClass('selected');
-                tagsfilter = tag;
+                tagsfilter.push(tag);
+            }
+            else if (shift) {
+                item.removeClass('selected');
+                var a = tagsfilter.slice(0,index);
+                tagsfilter = a.concat(tagsfilter.slice(index+1));
             }
-            else
-                tagsfilter = null;
 
             list_tasks();
+
+            e.preventDefault();
+            return false;
+        })
+        .mousedown(function(e){
+            // disable content selection with the mouse
+            e.preventDefault();
+            return false;
         });
 
         // click-handler on task list items (delegate)
@@ -439,11 +462,16 @@ function rcube_tasklist(settings)
      */
     function render_task(rec, replace)
     {
+        var tags_html = '';
+        for (var j=0; rec.tags && j < rec.tags.length; j++)
+            tags_html += '<span class="tag">' + Q(rec.tags[j]) + '</span>';
+
         var div = $('<div>').addClass('taskhead').html(
             '<div class="progressbar"><div class="progressvalue" style="width:' + (rec.complete * 100) + '%"></div></div>' +
             '<input type="checkbox" name="completed[]" value="1" class="complete" ' + (rec.complete == 1.0 ? 'checked="checked" ' : '') + '/>' + 
             '<span class="flagged"></span>' +
             '<span class="title">' + Q(rec.title) + '</span>' +
+            '<span class="tags">' + tags_html + '</span>' +
             '<span class="date">' + Q(rec.date || rcmail.gettext('nodate','tasklist')) + '</span>' +
             '<a href="#" class="actions">V</a>'
             )
@@ -822,8 +850,13 @@ function rcube_tasklist(settings)
     {
         var match = !filtermask || (filtermask & rec.mask) > 0;
 
-        if (match && tagsfilter)
-            match = rec.tags && rec.tags.indexOf(tagsfilter) >= 0;
+        if (match && tagsfilter.length) {
+            match = rec.tags && rec.tags.length;
+            for (var i=0; match && i < tagsfilter.length; i++) {
+                if (rec.tags.indexOf(tagsfilter[i]) < 0)
+                    match = false;
+            }
+        }
 
         return match;
     }