Merge pull request #297 from pixelated-project/new-sidebar

New sidebar

3 files changed, 45 insertions, 103 deletions

diff --git a/web-ui/app/js/tags/ui/tag.js b/web-ui/app/js/tags/ui/tag.js
index a41310e8..ba6dfe61 100644
--- a/web-ui/app/js/tags/ui/tag.js
+++ b/web-ui/app/js/tags/ui/tag.js
@@ -19,15 +19,14 @@ define(
   [
     'flight/lib/component',
     'views/templates',
-    'tags/ui/tag_base',
     'page/events',
     'views/i18n'
   ],
 
-  function (defineComponent, templates, tagBase, events, i18n) {
+  function (defineComponent, templates, events, i18n) {
     'use strict';
 
-    var Tag = defineComponent(tag, tagBase);
+    var Tag = defineComponent(tag);
 
     Tag.appendedTo = function (parent, data) {
       var res = new this();
@@ -39,6 +38,44 @@ define(
 
     function tag() {
 
+      var ALWAYS_HIDE_BADGE_FOR = ['sent', 'trash', 'all'];
+      var TOTAL_BADGE = ['drafts'];
+
+      this.displayBadge = function(tag) {
+        if(_.include(ALWAYS_HIDE_BADGE_FOR, tag.name)) { return false; }
+        if(this.badgeType(tag) === 'total') {
+          return tag.counts.total > 0;
+        } else {
+          return (tag.counts.total - tag.counts.read) > 0;
+        }
+      };
+
+      this.badgeType = function(tag) {
+        return _.include(TOTAL_BADGE, tag.name) ? 'total' : 'unread';
+      };
+
+      this.doUnselect = function () {
+        this.$node.removeClass('selected');
+      };
+
+      this.doSelect = function () {
+        this.$node.addClass('selected');
+      };
+
+      this.selectTag = function (ev, data) {
+        this.attr.currentTag = data.tag;
+        if (data.tag === this.attr.tag.name) {
+          this.doSelect();
+        }
+        else {
+          this.doUnselect();
+        }
+      };
+
+      this.selectTagAll = function () {
+        this.selectTag(null, {tag: 'all'});
+      };
+
       this.viewFor = function (tag, template, currentTag) {
         return template({
           tagName: tag.default ? i18n('tags.' + tag.name) : tag.name,
@@ -100,6 +137,10 @@ define(
         this.on(document, events.mail.read, this.decreaseReadCountIfMatchingTag);
         this.on(document, events.search.perform, this.addSearchingClass);
         this.on(document, events.search.empty, this.removeSearchingClass);
+
+        this.on(document, events.ui.tag.select, this.selectTag);
+        this.on(document, events.search.perform, this.selectTagAll);
+        this.on(document, events.search.empty, this.selectTagAll);
       });
 
       this.renderAndAttach = function (parent, data) {
diff --git a/web-ui/app/js/tags/ui/tag_list.js b/web-ui/app/js/tags/ui/tag_list.js
index 0c483abb..a2172c6d 100644
--- a/web-ui/app/js/tags/ui/tag_list.js
+++ b/web-ui/app/js/tags/ui/tag_list.js
@@ -20,11 +20,10 @@ define(
     'tags/ui/tag',
     'views/templates',
     'page/events',
-    'tags/ui/tag_shortcut',
     'page/router/url_params'
   ],
 
-  function(defineComponent, Tag, templates, events, TagShortcut, urlParams) {
+  function(defineComponent, Tag, templates, events, urlParams) {
     'use strict';
 
     var ICON_FOR = {
@@ -55,17 +54,10 @@ define(
         customTagList: '#custom-tag-list'
       });
 
-      this.renderShortcut = function (tag, tagComponent) {
-        return TagShortcut.appendedTo($('#tags-shortcuts'), { tag: tag, trigger: tagComponent, currentTag: this.getCurrentTag()});
-      };
-
       function renderTag(tag, defaultList, customList) {
         var list = tag.default ? defaultList : customList;
 
         var tagComponent = Tag.appendedTo(list, {tag: tag, currentTag: this.getCurrentTag()});
-        if (_.contains(_.keys(ORDER), tag.name)) {
-          tagComponent.attr.shortcut = this.renderShortcut(tag, tagComponent);
-        }
       }
 
       function resetTagList(lists) {
@@ -76,17 +68,11 @@ define(
 
       }
 
-      this.resetShortcuts = function () {
-        $('#tags-shortcuts').empty();
-        this.trigger(document, events.tags.shortcuts.teardown);
-      };
-
       this.renderTagList = function(tags) {
         var defaultList = this.select('defaultTagList');
         var customList = this.select('customTagList');
 
         resetTagList.call(this, [defaultList, customList]);
-        this.resetShortcuts();
 
         tags.forEach(function (tag) {
           renderTag.call(this, tag, defaultList, customList);
diff --git a/web-ui/app/js/tags/ui/tag_shortcut.js b/web-ui/app/js/tags/ui/tag_shortcut.js
deleted file mode 100644
index b5b76825..00000000
--- a/web-ui/app/js/tags/ui/tag_shortcut.js
+++ /dev/null
@@ -1,85 +0,0 @@
-/*
- * Copyright (c) 2014 ThoughtWorks, Inc.
- *
- * Pixelated is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * (at your option) any later version.
- *
- * Pixelated is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with Pixelated. If not, see <http://www.gnu.org/licenses/>.
- */
-'use strict';
-define(
-  [
-    'flight/lib/component',
-    'views/templates',
-    'page/events',
-    'tags/ui/tag_base',
-    'flight/lib/utils'
-  ],
-
-  function (describeComponent, templates, events, tagBase, utils) {
-
-    var TagShortcut = describeComponent(tagShortcut, tagBase);
-
-    TagShortcut.appendedTo = function (parent, data) {
-      var res = new this();
-      res.renderAndAttach(parent, data);
-      return res;
-    };
-
-    return TagShortcut;
-
-    function tagShortcut() {
-
-      this.renderTemplate = function (tag, currentTag) {
-        var model = {
-          tagName: tag.name,
-          displayBadge: this.displayBadge(tag),
-          badgeType: this.badgeType(tag),
-          count: this.badgeType(tag) === 'total' ? tag.counts.total : (tag.counts.total - tag.counts.read),
-          icon: iconFor[tag.name],
-          selected: tag.name === currentTag ? 'selected' : ''
-        };
-        return templates.tags.shortcut(model);
-      };
-
-      this.renderAndAttach = function (parent, options) {
-        parent.append(this.renderTemplate(options.tag, options.currentTag));
-        this.initialize(parent.children().last(), options);
-      };
-
-      this.reRender = function () {
-        this.$node.html(this.renderTemplate(this.attr.tag, this.attr.currentTag));
-      };
-
-      var iconFor = {
-        'inbox': 'inbox',
-        'sent': 'send',
-        'drafts': 'pencil',
-        'trash': 'trash-o',
-        'all': 'archive'
-      };
-
-      this.doTeardown = function () {
-        if (!jQuery.contains(document, this.$node[0])) {
-          this.teardown();
-        }
-      };
-
-      this.after('initialize', function () {
-        this.on('click', function () {
-          this.attr.trigger.triggerSelect();
-        });
-        this.on(document, events.tags.shortcuts.teardown, this.doTeardown);
-      });
-
-    }
-  }
-);