Add 'focusview' mode to quickly reduce the view to tasks from the selected list only (#2380)

plugins/tasklist/localization/en_US.inc

@@ -51,6 +51,7 @@ $labels['listactions'] = 'List options...';
 $labels['listname'] = 'Name';
 $labels['showalarms'] = 'Show alarms';
 $labels['import'] = 'Import';
+$labels['focusview'] = 'View only this list';
 
 // date words
 $labels['on'] = 'on';

plugins/tasklist/skins/larry/tasklist.css

@@ -218,7 +218,7 @@ body.attachmentwin #topnav .topright {
 #tasklists li {
 	margin: 0;
 	height: 20px;
-	padding: 6px 8px 2px;
+	padding: 6px 8px 2px 6px;
 	display: block;
 	position: relative;
 	white-space: nowrap;
@@ -235,10 +235,13 @@ body.attachmentwin #topnav .topright {
 
 #tasklists li span.listname {
 	display: block;
+	position: absolute;
+	top: 7px;
+	left: 26px;
+	right: 26px;
 	cursor: default;
 	padding-bottom: 2px;
 	padding-right: 30px;
-	margin-right: 20px;
 	color: #004458;
 	overflow: hidden;
 	text-overflow: ellipsis;
@@ -247,7 +250,21 @@ body.attachmentwin #topnav .topright {
 }
 
 #tasklists li span.handle {
-	display: none;
+	display: inline-block;
+	width: 16px;
+	height: 16px;
+	margin-right: 4px;
+	background: url(sprites.png) -200px 0 no-repeat;
+	cursor: pointer;
+}
+
+#tasklists li span.handle:hover {
+	background-position: -20px -101px;
+}
+
+#tasklists li.focusview span.handle,
+#tasklists li.focusview span.handle:hover {
+	background-position: -2px -101px;
 }
 
 #tasklists li.selected span.listname {
@@ -278,6 +295,11 @@ body.attachmentwin #topnav .topright {
 	color: #aaa;
 }
 
+#tasklists li.virtual span.handle {
+	background: none;
+	cursor: default;
+}
+
 #tasklists li input {
 	position: absolute;
 	top: 5px;
@@ -610,7 +632,7 @@ ul.toolbarmenu li span.collapse {
 }
 
 ul.toolbarmenu li span.add {
-	background-position: 0 -100px;
+	background-position: 0 -302px;
 }
 
 ul.toolbarmenu li span.expand {

plugins/tasklist/tasklist.js

@@ -54,6 +54,7 @@ function rcube_tasklist_ui(settings)
     var filtermask = FILTER_MASK_ALL;
     var loadstate = { filter:-1, lists:'', search:null };
     var idcount = 0;
+    var focusview;
     var saving_lock;
     var ui_loading;
     var taskcounts = {};
@@ -128,7 +129,8 @@ function rcube_tasklist_ui(settings)
 
         // register server callbacks
         rcmail.addEventListener('plugin.data_ready', data_ready);
-        rcmail.addEventListener('plugin.refresh_task', update_taskitem);
+        rcmail.addEventListener('plugin.update_task', update_taskitem);
+        rcmail.addEventListener('plugin.refresh_tasks', function(p) { update_taskitem(p, true); });
         rcmail.addEventListener('plugin.update_counts', update_counts);
         rcmail.addEventListener('plugin.insert_tasklist', insert_list);
         rcmail.addEventListener('plugin.update_tasklist', update_list);
@@ -686,11 +688,11 @@ function rcube_tasklist_ui(settings)
     /**
      * Callback from server to update a single task item
      */
-    function update_taskitem(rec)
+    function update_taskitem(rec, filter)
     {
         // handle a list of task records
         if ($.isArray(rec)) {
-            $.each(rec, function(i,r){ update_taskitem(r); });
+            $.each(rec, function(i,r){ update_taskitem(r, filter); });
             return;
         }
 
@@ -730,10 +732,13 @@ function rcube_tasklist_ui(settings)
             }
         }
 
-        if (list.active)
+        if (list.active) {
-            render_task(rec, oldid);
+            if (!filter || match_filter(rec, {}))
-        else
+                render_task(rec, oldid);
+        }
+        else {
             $('li[rel="'+id+'"]', rcmail.gui_objects.resultlist).remove();
+        }
 
         append_tags(rec.tags || []);
         fix_tree_toggles();
@@ -1525,7 +1530,11 @@ function rcube_tasklist_ui(settings)
             return cache[rec.id];
         }
 
-        var match = !filtermask || (filtermask & rec.mask) > 0
+        var match = !filtermask || (filtermask & rec.mask) > 0;
+
+        // in focusview mode, only tasks from the selected list are allowed
+        if (focusview && rec.list != focusview)
+            match = false;
 
         if (match && tagsfilter.length) {
             match = rec.tags && rec.tags.length;
@@ -1847,6 +1856,11 @@ function rcube_tasklist_ui(settings)
                 if (!this.checked) remove_tasks(id);
                 else               list_tasks(null);
                 rcmail.http_post('tasklist', { action:'subscribe', l:{ id:id, active:me.tasklists[id].active?1:0 } });
+
+                // disable focusview
+                if (!this.checked && focusview == id) {
+                    set_focusview(null);
+                }
             }
         }).data('id', id).get(0).checked = me.tasklists[id].active || false;
 
@@ -1855,6 +1869,15 @@ function rcube_tasklist_ui(settings)
             rcmail.select_folder(id, 'rcmlitasklist');
             rcmail.enable_command('list-edit', 'list-remove', 'list-import', me.tasklists[id].editable);
             me.selected_list = id;
+
+            // click on handle icon toggles focusview
+            if (e.target.className == 'handle') {
+                set_focusview(focusview == id ? null : id)
+            }
+            // disable focusview when selecting another list
+            else if (focusview && id != focusview) {
+                set_focusview(null);
+            }
         })
         .dblclick(function(e){
             list_edit_dialog($(this).data('id'));
@@ -1864,6 +1887,31 @@ function rcube_tasklist_ui(settings)
         .addClass(me.tasklists[id].editable ? null : 'readonly');
     }
 
+    /**
+     * Enable/disable focusview mode for the given list
+     */
+    function set_focusview(id)
+    {
+        if (focusview && focusview != id)
+            $(rcmail.get_folder_li(focusview, 'rcmlitasklist')).removeClass('focusview');
+
+        focusview = id;
+
+        // activate list if necessary
+        if (focusview && !me.tasklists[id].active) {
+            $('input', rcmail.get_folder_li(id, 'rcmlitasklist')).get(0).checked = true;
+            me.tasklists[id].active = true;
+            fetch_counts();
+        }
+
+        // update list
+        list_tasks(null);
+
+        if (focusview) {
+            $(rcmail.get_folder_li(focusview, 'rcmlitasklist')).addClass('focusview');
+        }
+    }
+
 
     // init dialog by default
     init_taskedit();

plugins/tasklist/tasklist.php

@@ -281,7 +281,7 @@ class tasklist extends rcube_plugin
                 foreach ($refresh as $i => $r)
                     $this->encode_task($refresh[$i]);
             }
-            $this->rc->output->command('plugin.refresh_task', $refresh);
+            $this->rc->output->command('plugin.update_task', $refresh);
         }
     }
 
@@ -751,7 +751,7 @@ class tasklist extends rcube_plugin
 
         $updates = $this->driver->list_tasks($filter, $lists);
         if (!empty($updates)) {
-            $this->rc->output->command('plugin.refresh_task', $this->tasks_data($updates, 255, $tags));
+            $this->rc->output->command('plugin.refresh_tasks', $this->tasks_data($updates, 255, $tags), true);
 
             // update counts
             $counts = $this->driver->count_tasks($lists);

plugins/tasklist/tasklist_ui.php

@@ -117,7 +117,7 @@ class tasklist_ui
 
             $li .= html::tag('li', array('id' => 'rcmlitasklist' . $html_id, 'class' => $class),
                 ($prop['virtual'] ? '' : html::tag('input', array('type' => 'checkbox', 'name' => '_list[]', 'value' => $id, 'checked' => $prop['active']))) .
-                html::span('handle', ' ') .
+                html::span(array('class' => 'handle', 'title' => $this->plugin->gettext('focusview')), ' ') .
                 html::span(array('class' => 'listname', 'title' => $title), $prop['listname']));
         }