summaryrefslogtreecommitdiff
path: root/web-ui/app
diff options
context:
space:
mode:
authorAlexandre Pretto Nunes <anunes@thoughtworks.com>2014-12-17 19:19:25 -0200
committerAlexandre Pretto Nunes <anunes@thoughtworks.com>2015-01-06 16:27:26 -0200
commit7ab9f9423004adf1df9cc1be1b2a5ae7eade4a95 (patch)
treebb8aeadbc6f9ce4798ce1eaabc40d66972ba1f5b /web-ui/app
parent0ff59644d8e804bcab928d184b31a5e6cdc2f6ed (diff)
Separate auto-refresh for mails and tags, and start moving away from having the left_pane_dispatcher as a middleman
Diffstat (limited to 'web-ui/app')
-rw-r--r--web-ui/app/js/dispatchers/left_pane_dispatcher.js9
-rw-r--r--web-ui/app/js/dispatchers/right_pane_dispatcher.js1
-rw-r--r--web-ui/app/js/helpers/monitored_ajax.js1
-rw-r--r--web-ui/app/js/mail_list/ui/mail_items/mail_item.js2
-rw-r--r--web-ui/app/js/mail_list/ui/mail_list.js17
-rw-r--r--web-ui/app/js/mixins/with_auto_refresh.js49
-rw-r--r--web-ui/app/js/mixins/with_mail_edit_base.js1
-rw-r--r--web-ui/app/js/page/router.js4
-rw-r--r--web-ui/app/js/search/search_trigger.js7
-rw-r--r--web-ui/app/js/services/mail_service.js57
-rw-r--r--web-ui/app/js/tags/data/tags.js14
-rw-r--r--web-ui/app/js/tags/ui/tag.js29
-rw-r--r--web-ui/app/js/tags/ui/tag_base.js27
-rw-r--r--web-ui/app/js/tags/ui/tag_list.js26
-rw-r--r--web-ui/app/js/tags/ui/tag_shortcut.js35
-rw-r--r--web-ui/app/templates/tags/shortcut.hbs4
-rw-r--r--web-ui/app/templates/tags/tag.hbs2
17 files changed, 162 insertions, 123 deletions
diff --git a/web-ui/app/js/dispatchers/left_pane_dispatcher.js b/web-ui/app/js/dispatchers/left_pane_dispatcher.js
index 21898dca..0037a88f 100644
--- a/web-ui/app/js/dispatchers/left_pane_dispatcher.js
+++ b/web-ui/app/js/dispatchers/left_pane_dispatcher.js
@@ -47,19 +47,14 @@ define(
this.trigger(document, events.router.pushState, data);
}
initialized = true;
-
- if (data.skipMailListRefresh) {
- return;
- }
-
- this.trigger(document, events.ui.mails.fetchByTag, data);
};
this.after('initialize', function () {
- this.on(this.$node, events.tags.received, this.loadTags);
+ //this.on(this.$node, events.tags.received, this.loadTags);
this.on(document, events.dispatchers.tags.refreshTagList, this.refreshTagList);
this.on(document, events.ui.tags.loaded, this.selectTag);
this.on(document, events.ui.tag.selected, this.pushUrlState);
+ this.on(document, events.ui.tag.select, this.pushUrlState);
this.trigger(document, events.tags.want, { caller: this.$node });
});
}
diff --git a/web-ui/app/js/dispatchers/right_pane_dispatcher.js b/web-ui/app/js/dispatchers/right_pane_dispatcher.js
index 092fca81..77d578e0 100644
--- a/web-ui/app/js/dispatchers/right_pane_dispatcher.js
+++ b/web-ui/app/js/dispatchers/right_pane_dispatcher.js
@@ -101,6 +101,7 @@ define(
this.on(document, events.dispatchers.rightPane.openNoMessageSelected, this.openNoMessageSelectedPane);
this.on(document, events.dispatchers.rightPane.selectTag, this.selectTag);
this.on(document, events.ui.tag.selected, this.saveTag);
+ this.on(document, events.ui.tag.select, this.saveTag);
this.on(document, events.dispatchers.rightPane.openNoMessageSelectedWithoutPushState, this.initializeNoMessageSelectedPane);
this.initializeNoMessageSelectedPane();
});
diff --git a/web-ui/app/js/helpers/monitored_ajax.js b/web-ui/app/js/helpers/monitored_ajax.js
index 42b2dcf7..c8c74d3e 100644
--- a/web-ui/app/js/helpers/monitored_ajax.js
+++ b/web-ui/app/js/helpers/monitored_ajax.js
@@ -56,7 +56,6 @@ define(['page/events', 'views/i18n'], function (events, i18n) {
on.trigger(document, events.ui.userAlerts.displayMessage, { message: i18n(msg) });
}
}.bind(this));
-
}
return monitoredAjax;
diff --git a/web-ui/app/js/mail_list/ui/mail_items/mail_item.js b/web-ui/app/js/mail_list/ui/mail_items/mail_item.js
index 24c7b043..ed1fd07f 100644
--- a/web-ui/app/js/mail_list/ui/mail_items/mail_item.js
+++ b/web-ui/app/js/mail_list/ui/mail_items/mail_item.js
@@ -32,6 +32,7 @@ define(
this.doSelect = function () {
this.$node.addClass('selected');
+ this.checkCheckbox();
};
this.doUnselect = function () {
@@ -72,6 +73,7 @@ define(
this.attachListeners = function () {
this.on(this.$node.find('input[type=checkbox]'), 'change', this.triggerMailChecked);
this.on(document, events.ui.mails.cleanSelected, this.doUnselect);
+ this.on(document, events.ui.tag.select, this.doUnselect);
this.on(document, events.ui.mails.uncheckAll, this.uncheckCheckbox);
this.on(document, events.ui.mails.checkAll, this.checkCheckbox);
};
diff --git a/web-ui/app/js/mail_list/ui/mail_list.js b/web-ui/app/js/mail_list/ui/mail_list.js
index 56c5c4f9..11300346 100644
--- a/web-ui/app/js/mail_list/ui/mail_list.js
+++ b/web-ui/app/js/mail_list/ui/mail_list.js
@@ -121,23 +121,11 @@ define(
};
this.respondWithCheckedMails = function (ev, caller) {
- this.trigger(caller, events.ui.mail.hereChecked, { checkedMails: this.checkedMailsForCurrentTag()});
+ this.trigger(caller, events.ui.mail.hereChecked, {checkedMails: self.attr.checkedMails});
};
this.updateCheckAllCheckbox = function () {
- if (this.checkedMailsForCurrentTag().length > 0) {
- this.trigger(document, events.ui.mails.hasMailsChecked, true);
- } else {
- this.trigger(document, events.ui.mails.hasMailsChecked, false);
- }
- };
-
- this.checkedMailsForCurrentTag = function () {
- var checkedMailsForCurrentTag = _.filter(self.attr.checkedMails, function (mail) {
- return self.attr.currentTag === 'all' || mail.mailbox === self.attr.currentTag || _.contains(mail.tags, self.attr.currentTag);
- });
-
- return checkedMailsForCurrentTag.length > 0 ? checkedMailsForCurrentTag : {};
+ this.trigger(document, events.ui.mails.hasMailsChecked, {hasMailsChecked: this.attr.checkedMails.length > 0});
};
this.addToSelectedMails = function (ev, data) {
@@ -177,6 +165,7 @@ define(
self = this;
this.on(document, events.ui.mails.cleanSelected, this.cleanSelected);
+ this.on(document, events.ui.tag.select, this.cleanSelected);
this.on(document, events.mails.available, this.showMails);
this.on(document, events.mails.availableForRefresh, this.refreshMailList);
diff --git a/web-ui/app/js/mixins/with_auto_refresh.js b/web-ui/app/js/mixins/with_auto_refresh.js
new file mode 100644
index 00000000..f01903e0
--- /dev/null
+++ b/web-ui/app/js/mixins/with_auto_refresh.js
@@ -0,0 +1,49 @@
+/*
+ * 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/>.
+ */
+/*global Pixelated */
+/*global _ */
+
+define(['features'],
+ function (features) {
+ 'use strict';
+
+ function withAutoRefresh(refreshMethod) {
+ return function () {
+ this.defaultAttrs({
+ refreshInterval: 15000
+ });
+
+ this.setupRefresher = function () {
+ clearTimeout(this.attr.refreshTimer);
+ this.attr.refreshTimer = setTimeout(function () {
+ this[refreshMethod]();
+ this.setupRefresher();
+ }.bind(this), this.attr.refreshInterval);
+ };
+
+ this.after('initialize', function () {
+ if (features.isAutoRefreshEnabled()) {
+ this.setupRefresher();
+ }
+ });
+ };
+ }
+
+ return withAutoRefresh;
+ }
+);
+
diff --git a/web-ui/app/js/mixins/with_mail_edit_base.js b/web-ui/app/js/mixins/with_mail_edit_base.js
index 4f811235..2af5fefa 100644
--- a/web-ui/app/js/mixins/with_mail_edit_base.js
+++ b/web-ui/app/js/mixins/with_mail_edit_base.js
@@ -212,6 +212,7 @@ define(
this.on(document, events.ui.mail.send, this.sendMail);
this.on(document, events.ui.tag.selected, this.saveTag);
+ this.on(document, events.ui.tag.select, this.saveTag);
});
}
diff --git a/web-ui/app/js/page/router.js b/web-ui/app/js/page/router.js
index 3de2bba9..ce0d7d04 100644
--- a/web-ui/app/js/page/router.js
+++ b/web-ui/app/js/page/router.js
@@ -34,6 +34,7 @@ define(['flight/lib/component', 'page/events', 'page/router/url_params'], functi
return {
tag: data.tag || (previousState && previousState.tag) || urlParams.defaultTag(),
mailIdent: data.mailIdent,
+ query: data.query,
isDisplayNoMessageSelected: !!data.isDisplayNoMessageSelected
};
}
@@ -61,6 +62,9 @@ define(['flight/lib/component', 'page/events', 'page/router/url_params'], functi
this.after('initialize', function () {
this.on(document, events.router.pushState, this.pushState);
+ this.on(document, events.ui.tag.select, this.pushState);
+ this.on(document, events.search.perform, this.pushState);
+ this.on(document, events.search.empty, this.pushState);
window.onpopstate = this.popState.bind(this);
});
});
diff --git a/web-ui/app/js/search/search_trigger.js b/web-ui/app/js/search/search_trigger.js
index 8f5bbb86..9f2dd45e 100644
--- a/web-ui/app/js/search/search_trigger.js
+++ b/web-ui/app/js/search/search_trigger.js
@@ -46,16 +46,14 @@ define(
var value = input.val();
input.blur();
if(!_.isEmpty(value)){
- this.trigger(document, events.ui.tag.select, { tag: 'all', skipMailListRefresh: true });
this.trigger(document, events.search.perform, { query: value });
} else {
- this.trigger(document, events.ui.tag.select, { tag: 'all'});
this.trigger(document, events.search.empty);
}
};
- this.clearInput = function(event, data) {
- if (!data.skipMailListRefresh) { this.select('input').val(''); }
+ this.clearInput = function() {
+ this.select('input').val('');
};
this.showOnlySearchTerms = function(event){
@@ -77,6 +75,7 @@ define(
this.on(this.select('input'), 'focus', this.showOnlySearchTerms);
this.on(this.select('input'), 'blur', this.showSearchTermsAndPlaceHolder);
this.on(document, events.ui.tag.selected, this.clearInput);
+ this.on(document, events.ui.tag.select, this.clearInput);
});
}
}
diff --git a/web-ui/app/js/services/mail_service.js b/web-ui/app/js/services/mail_service.js
index 2e92f542..1d5db40e 100644
--- a/web-ui/app/js/services/mail_service.js
+++ b/web-ui/app/js/services/mail_service.js
@@ -24,12 +24,14 @@ define(
'services/model/mail',
'helpers/monitored_ajax',
'page/events',
- 'features'
- ], function (defineComponent, i18n, Mail, monitoredAjax, events, features) {
+ 'features',
+ 'mixins/with_auto_refresh',
+ 'page/router/url_params'
+ ], function (defineComponent, i18n, Mail, monitoredAjax, events, features, withAutoRefresh, urlParams) {
'use strict';
- return defineComponent(mailService);
+ return defineComponent(mailService, withAutoRefresh('refreshMails'));
function mailService() {
var that;
@@ -41,7 +43,7 @@ define(
lastQuery: '',
currentPage: 1,
numPages: 1,
- w: 25
+ pageSize: 25
});
this.errorMessage = function (msg) {
@@ -54,7 +56,7 @@ define(
var ident = data.ident;
var success = function (data) {
- this.refreshResults();
+ this.refreshMails();
$(document).trigger(events.mail.tags.updated, { ident: ident, tags: data.tags });
};
@@ -106,7 +108,7 @@ define(
this.triggerMailsRead = function (mails) {
return _.bind(function () {
- this.refreshResults();
+ this.refreshMails();
this.trigger(document, events.ui.mail.unchecked, { mails: mails });
this.trigger(document, events.ui.mails.hasMailsChecked, false);
}, this);
@@ -116,7 +118,7 @@ define(
return _.bind(function () {
var mails = dataToDelete.mails || [dataToDelete.mail];
- this.refreshResults();
+ this.refreshMails();
this.trigger(document, events.ui.userAlerts.displayMessage, { message: dataToDelete.successMessage});
this.trigger(document, events.ui.mail.unchecked, { mails: mails });
this.trigger(document, events.ui.mails.hasMailsChecked, false);
@@ -157,20 +159,16 @@ define(
this.fetchByTag = function (ev, data) {
this.attr.currentTag = data.tag;
+ this.attr.lastQuery = compileQuery(data);
this.updateCurrentPageNumber(1);
- this.fetchMail(compileQuery(data), this.attr.currentTag, false, data);
- };
-
- this.refreshResults = function (ev, data) {
- var query = this.attr.lastQuery;
- this.fetchMail(query, this.attr.currentTag, true);
+ this.refreshMails();
};
this.newSearch = function (ev, data) {
- var query = data.query;
+ this.attr.lastQuery = data.query;
this.attr.currentTag = 'all';
- this.fetchMail(query, 'all');
+ this.refreshMails();
};
this.mailFromJSON = function (mail) {
@@ -190,21 +188,19 @@ define(
this.excludeTrashedEmailsForDraftsAndSent = function (query) {
if (query === 'tag:"drafts"' || query === 'tag:"sent"') {
return query + ' -in:"trash"';
- } else {
- return query;
}
+ return query;
};
- this.fetchMail = function (query, tag, fromRefresh, eventData) {
- var p = this.attr.currentPage;
- var w = this.attr.w;
- var url = this.attr.mailsResource + '?q=' + escaped(this.excludeTrashedEmailsForDraftsAndSent(query)) + '&p=' + p + '&w=' + w;
- this.attr.lastQuery = this.excludeTrashedEmailsForDraftsAndSent(query);
+ this.refreshMails = function () {
+ var url = this.attr.mailsResource + '?q=' + escaped(this.attr.lastQuery) + '&p=' + this.attr.currentPage + '&w=' + this.attr.pageSize;
+
+ this.attr.lastQuery = this.excludeTrashedEmailsForDraftsAndSent(this.attr.lastQuery);
+
monitoredAjax(this, url, { dataType: 'json' })
.done(function (data) {
- this.attr.numPages = Math.ceil(data.stats.total / this.attr.w);
- var eventToTrigger = fromRefresh ? events.mails.availableForRefresh : events.mails.available;
- this.trigger(document, eventToTrigger, _.merge(_.merge({tag: tag }, eventData), this.parseMails(data)));
+ this.attr.numPages = Math.ceil(data.stats.total / this.attr.pageSize);
+ this.trigger(document, events.mails.available, _.merge(_.merge({tag: this.attr.currentTag }), this.parseMails(data)));
}.bind(this))
.fail(function () {
this.trigger(document, events.ui.userAlerts.displayMessage, { message: i18n('Could not fetch messages') });
@@ -232,14 +228,14 @@ define(
this.previousPage = function () {
if (this.attr.currentPage > 1) {
this.updateCurrentPageNumber(this.attr.currentPage - 1);
- this.refreshResults();
+ this.refreshMails();
}
};
this.nextPage = function () {
if (this.attr.currentPage < (this.attr.numPages)) {
this.updateCurrentPageNumber(this.attr.currentPage + 1);
- this.refreshResults();
+ this.refreshMails();
}
};
@@ -281,10 +277,13 @@ define(
this.on(document, events.mail.delete, this.deleteMail);
this.on(document, events.mail.deleteMany, this.deleteManyMails);
this.on(document, events.search.perform, this.newSearch);
- this.on(document, events.ui.mails.fetchByTag, this.fetchByTag);
- this.on(document, events.ui.mails.refresh, this.refreshResults);
+ this.on(document, events.ui.tag.selected, this.fetchByTag);
+ this.on(document, events.ui.tag.select, this.fetchByTag);
+ this.on(document, events.ui.mails.refresh, this.refreshMails);
this.on(document, events.ui.page.previous, this.previousPage);
this.on(document, events.ui.page.next, this.nextPage);
+
+ this.fetchByTag(null, {tag: urlParams.getTag()});
});
}
}
diff --git a/web-ui/app/js/tags/data/tags.js b/web-ui/app/js/tags/data/tags.js
index 40614fea..401b41f7 100644
--- a/web-ui/app/js/tags/data/tags.js
+++ b/web-ui/app/js/tags/data/tags.js
@@ -14,12 +14,12 @@
* You should have received a copy of the GNU Affero General Public License
* along with Pixelated. If not, see <http://www.gnu.org/licenses/>.
*/
-define(['flight/lib/component', 'page/events', 'helpers/monitored_ajax', 'mixins/with_feature_toggle'], function (defineComponent, events, monitoredAjax, withFeatureToggle) {
+define(['flight/lib/component', 'page/events', 'helpers/monitored_ajax', 'mixins/with_feature_toggle', 'mixins/with_auto_refresh'], function (defineComponent, events, monitoredAjax, withFeatureToggle, withAutoRefresh) {
'use strict';
var DataTags = defineComponent(dataTags, withFeatureToggle('tags', function() {
$(document).trigger(events.ui.mails.refresh);
- }));
+ }), withAutoRefresh('refreshTags'));
DataTags.all = {
name: 'all',
@@ -34,13 +34,11 @@ define(['flight/lib/component', 'page/events', 'helpers/monitored_ajax', 'mixins
}
};
- return DataTags;
-
function dataTags() {
function sendTagsBackTo(on, params) {
return function(data) {
data.push(DataTags.all);
- on.trigger(params.caller, events.tags.received, {tags: data, skipMailListRefresh: params.skipMailListRefresh});
+ on.trigger(params.caller, events.tags.received, {tags: data});
};
}
@@ -53,8 +51,14 @@ define(['flight/lib/component', 'page/events', 'helpers/monitored_ajax', 'mixins
.done(sendTagsBackTo(this, params));
};
+ this.refreshTags = function() {
+ this.fetchTags(null, {caller: document});
+ };
+
this.after('initialize', function () {
this.on(document, events.tags.want, this.fetchTags);
});
}
+
+ return DataTags;
});
diff --git a/web-ui/app/js/tags/ui/tag.js b/web-ui/app/js/tags/ui/tag.js
index 0d2d2ebf..e6375034 100644
--- a/web-ui/app/js/tags/ui/tag.js
+++ b/web-ui/app/js/tags/ui/tag.js
@@ -39,15 +39,16 @@ define(
return Tag;
function tag() {
-
- this.viewFor = function (tag, template) {
+
+ this.viewFor = function (tag, template, currentTag) {
return template({
tagName: tag.default ? i18n('tags.' + tag.name) : tag.name,
ident: this.hashIdent(tag.ident),
count: this.badgeType(tag) === 'total' ? tag.counts.total : (tag.counts.total - tag.counts.read),
displayBadge: this.displayBadge(tag),
badgeType: this.badgeType(tag),
- icon: tag.icon
+ icon: tag.icon,
+ selected: tag.name === currentTag ? 'selected' : ''
});
};
@@ -55,7 +56,7 @@ define(
var mailbox_and_tags = _.flatten([data.tags, data.mailbox]);
if (_.contains(mailbox_and_tags, this.attr.tag.name)) {
this.attr.tag.counts.read++;
- this.$node.html(this.viewFor(this.attr.tag, templates.tags.tagInner));
+ this.$node.html(this.viewFor(this.attr.tag, templates.tags.tagInner, this.attr.currentTag));
if (!_.isUndefined(this.attr.shortcut)) {
this.attr.shortcut.reRender();
}
@@ -64,23 +65,6 @@ define(
this.triggerSelect = function () {
this.trigger(document, events.ui.tag.select, { tag: this.attr.tag.name });
- this.trigger(document, events.search.empty);
- };
-
- this.selectTag = function (ev, data) {
- if(data.tag === this.attr.tag.name) { this.doSelect(data); }
- else { this.doUnselect(); }
- };
-
- this.doUnselect = function () {
- this.attr.selected = false;
- this.$node.removeClass('selected');
- };
-
- this.doSelect = function (data) {
- this.attr.selected = true;
- this.$node.addClass('selected');
- this.trigger(document, events.ui.tag.selected, data);
};
this.addSearchingClass = function() {
@@ -112,14 +96,13 @@ define(
this.after('initialize', function () {
this.on('click', this.triggerSelect);
- this.on(document, events.ui.tag.select, this.selectTag);
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.renderAndAttach = function (parent, data) {
- var rendered = this.viewFor(data.tag, templates.tags.tag);
+ var rendered = this.viewFor(data.tag, templates.tags.tag, data.currentTag);
parent.append(rendered);
this.initialize('#tag-' + this.hashIdent(data.tag.ident), data);
this.on(parent, events.tags.teardown, this.teardown);
diff --git a/web-ui/app/js/tags/ui/tag_base.js b/web-ui/app/js/tags/ui/tag_base.js
index 9b2a06a9..9dc1ccbb 100644
--- a/web-ui/app/js/tags/ui/tag_base.js
+++ b/web-ui/app/js/tags/ui/tag_base.js
@@ -34,6 +34,33 @@ define(['views/i18n', 'page/events'], function(i18n, events) {
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.after('initialize', function () {
+ 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);
+ });
}
return tagBase;
diff --git a/web-ui/app/js/tags/ui/tag_list.js b/web-ui/app/js/tags/ui/tag_list.js
index 850a5fab..0c483abb 100644
--- a/web-ui/app/js/tags/ui/tag_list.js
+++ b/web-ui/app/js/tags/ui/tag_list.js
@@ -20,10 +20,11 @@ define(
'tags/ui/tag',
'views/templates',
'page/events',
- 'tags/ui/tag_shortcut'
+ 'tags/ui/tag_shortcut',
+ 'page/router/url_params'
],
- function(defineComponent, Tag, templates, events, TagShortcut) {
+ function(defineComponent, Tag, templates, events, TagShortcut, urlParams) {
'use strict';
var ICON_FOR = {
@@ -55,13 +56,13 @@ define(
});
this.renderShortcut = function (tag, tagComponent) {
- return TagShortcut.appendedTo($('#tags-shortcuts'), { linkTo: tag, trigger: 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});
+ var tagComponent = Tag.appendedTo(list, {tag: tag, currentTag: this.getCurrentTag()});
if (_.contains(_.keys(ORDER), tag.name)) {
tagComponent.attr.shortcut = this.renderShortcut(tag, tagComponent);
}
@@ -84,20 +85,23 @@ define(
var defaultList = this.select('defaultTagList');
var customList = this.select('customTagList');
- resetTagList.bind(this, [defaultList, customList]).call();
+ resetTagList.call(this, [defaultList, customList]);
this.resetShortcuts();
tags.forEach(function (tag) {
- renderTag.bind(this, tag, defaultList, customList).call();
+ renderTag.call(this, tag, defaultList, customList);
}.bind(this));
};
- this.loadTagList = function(ev, data) {
+ this.displayTags = function(ev, data) {
this.renderTagList(_.sortBy(data.tags, tagOrder));
- this.trigger(document, events.ui.tags.loaded, { tag: this.attr.currentTag, skipMailListRefresh: data.skipMailListRefresh});
};
- this.saveTag = function(ev, data) {
+ this.getCurrentTag = function () {
+ return this.attr.currentTag || urlParams.getTag();
+ };
+
+ this.updateCurrentTag = function(ev, data) {
this.attr.currentTag = data.tag;
};
@@ -106,8 +110,8 @@ define(
};
this.after('initialize', function() {
- this.on(document, events.ui.tagList.load, this.loadTagList);
- this.on(document, events.ui.tag.selected, this.saveTag);
+ this.on(document, events.tags.received, this.displayTags);
+ this.on(document, events.ui.tag.select, this.updateCurrentTag);
this.renderTagListTemplate();
});
}
diff --git a/web-ui/app/js/tags/ui/tag_shortcut.js b/web-ui/app/js/tags/ui/tag_shortcut.js
index 0fe92550..b5b76825 100644
--- a/web-ui/app/js/tags/ui/tag_shortcut.js
+++ b/web-ui/app/js/tags/ui/tag_shortcut.js
@@ -38,24 +38,25 @@ define(
function tagShortcut() {
- this.renderTemplate = function (linkTo) {
+ this.renderTemplate = function (tag, currentTag) {
var model = {
- tagName: linkTo.name,
- displayBadge: this.displayBadge(linkTo),
- badgeType: this.badgeType(linkTo),
- count: this.badgeType(linkTo) === 'total' ? linkTo.counts.total : (linkTo.counts.total - linkTo.counts.read),
- icon: iconFor[linkTo.name]
+ 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.linkTo));
+ parent.append(this.renderTemplate(options.tag, options.currentTag));
this.initialize(parent.children().last(), options);
};
this.reRender = function () {
- this.$node.html(this.renderTemplate(this.attr.linkTo));
+ this.$node.html(this.renderTemplate(this.attr.tag, this.attr.currentTag));
};
var iconFor = {
@@ -66,23 +67,6 @@ define(
'all': 'archive'
};
- this.selectTag = function (ev, data) {
- if (data.tag === this.attr.linkTo.name) {
- this.doSelect();
- }
- else {
- this.doUnselect();
- }
- };
-
- this.doUnselect = function () {
- this.$node.removeClass('selected');
- };
-
- this.doSelect = function () {
- this.$node.addClass('selected');
- };
-
this.doTeardown = function () {
if (!jQuery.contains(document, this.$node[0])) {
this.teardown();
@@ -93,7 +77,6 @@ define(
this.on('click', function () {
this.attr.trigger.triggerSelect();
});
- this.on(document, events.ui.tag.select, this.selectTag);
this.on(document, events.tags.shortcuts.teardown, this.doTeardown);
});
diff --git a/web-ui/app/templates/tags/shortcut.hbs b/web-ui/app/templates/tags/shortcut.hbs
index 49ddfdb2..5fa32320 100644
--- a/web-ui/app/templates/tags/shortcut.hbs
+++ b/web-ui/app/templates/tags/shortcut.hbs
@@ -1,4 +1,4 @@
-<li>
+<li class="{{ selected }}">
<a title="{{ tagName }}">
{{#if displayBadge }}
<span class="{{ badgeType }}-count">{{ count }}</span>
@@ -6,4 +6,4 @@
<i class="fa fa-{{ icon }}"></i>
<div class="shortcut-label">{{ tagName }}</div>
</a>
-</li> \ No newline at end of file
+</li>
diff --git a/web-ui/app/templates/tags/tag.hbs b/web-ui/app/templates/tags/tag.hbs
index c645f782..a7b02e21 100644
--- a/web-ui/app/templates/tags/tag.hbs
+++ b/web-ui/app/templates/tags/tag.hbs
@@ -1,3 +1,3 @@
-<li id="tag-{{ ident }}">
+<li id="tag-{{ ident }}" class="{{ selected }}">
{{> tag_inner }}
</li>