summaryrefslogtreecommitdiff
path: root/web-ui
diff options
context:
space:
mode:
authorRafael Lisboa <rafaelzlisboa@gmail.com>2015-04-14 16:13:49 -0300
committerRafael Lisboa <rafaelzlisboa@gmail.com>2015-04-14 16:13:49 -0300
commitf4aa7e41b343704843002ffc8a85c58abf09b911 (patch)
tree3a8b54edf62fadcb322d0f5cabeecde2c83f3067 /web-ui
parent2ec6d6260c8fcc66446d3e600b70dd0043109744 (diff)
parent8d2869fa1fa2018772d4f310c4ba9b9c9373a667 (diff)
Merge pull request #376 from pixelated-project/mail-item-refactor
Mail item refactor
Diffstat (limited to 'web-ui')
-rw-r--r--web-ui/app/js/helpers/view_helper.js23
-rw-r--r--web-ui/app/js/mail_list/ui/mail_item_factory.js1
-rw-r--r--web-ui/app/js/mail_list/ui/mail_items/draft_item.js8
-rw-r--r--web-ui/app/js/mail_list/ui/mail_items/generic_mail_item.js17
-rw-r--r--web-ui/app/js/mail_list/ui/mail_items/mail_item.js30
-rw-r--r--web-ui/app/js/mail_list/ui/mail_items/sent_item.js11
-rw-r--r--web-ui/app/js/mail_view/ui/mail_view.js3
-rw-r--r--web-ui/app/templates/mails/draft.hbs4
-rw-r--r--web-ui/app/templates/mails/full_view.hbs2
-rw-r--r--web-ui/app/templates/mails/sent.hbs4
-rw-r--r--web-ui/app/templates/mails/single.hbs4
-rw-r--r--web-ui/app/templates/mails/trash.hbs2
-rw-r--r--web-ui/test/spec/helpers/view_helper.spec.js20
-rw-r--r--web-ui/test/spec/mail_list/ui/mail_items/draft_item.spec.js32
-rw-r--r--web-ui/test/spec/mail_list/ui/mail_items/generic_mail_item.spec.js2
-rw-r--r--web-ui/test/spec/mail_list/ui/mail_items/mail_item.spec.js1
-rw-r--r--web-ui/test/test_data.js35
17 files changed, 122 insertions, 77 deletions
diff --git a/web-ui/app/js/helpers/view_helper.js b/web-ui/app/js/helpers/view_helper.js
index a682ae5e..8d841cc7 100644
--- a/web-ui/app/js/helpers/view_helper.js
+++ b/web-ui/app/js/helpers/view_helper.js
@@ -83,15 +83,6 @@ define(
return res;
}
- function getFormattedDate(date){
- var today = createTodayDate();
- if (date.getTime() > today.getTime()) {
- return fixedSizeNumber(date.getHours(), 2) + ':' + fixedSizeNumber(date.getMinutes(), 2);
- } else {
- return '' + date.getFullYear() + '-' + fixedSizeNumber(date.getMonth() + 1, 2) + '-' + fixedSizeNumber(date.getDate(), 2);
- }
- }
-
function createTodayDate() {
var today = new Date();
today.setHours(0);
@@ -120,11 +111,23 @@ define(
return '\n\n' + prependFrom(mail) + mail.textPlainBody.replace(/^/mg, '> ');
}
+ function formatDate(dateString) {
+ var date = new Date(dateString);
+ var today = createTodayDate();
+ if (date.getTime() > today.getTime()) {
+ return fixedSizeNumber(date.getHours(), 2) + ':' + fixedSizeNumber(date.getMinutes(), 2);
+ } else {
+ return '' + date.getFullYear() + '-' + fixedSizeNumber(date.getMonth() + 1, 2) + '-' + fixedSizeNumber(date.getDate(), 2);
+ }
+ }
+
+ Handlebars.registerHelper('formatDate', formatDate);
+ Handlebars.registerHelper('formatStatusClasses', formatStatusClasses);
+
return {
formatStatusClasses: formatStatusClasses,
formatMailBody: formatMailBody,
moveCaretToEndOfText: moveCaretToEndOfText,
- getFormattedDate: getFormattedDate,
quoteMail: quoteMail,
i18n: i18n
};
diff --git a/web-ui/app/js/mail_list/ui/mail_item_factory.js b/web-ui/app/js/mail_list/ui/mail_item_factory.js
index 3c815401..ddfa4c62 100644
--- a/web-ui/app/js/mail_list/ui/mail_item_factory.js
+++ b/web-ui/app/js/mail_list/ui/mail_item_factory.js
@@ -40,6 +40,7 @@ define(
var mailItemContainer = $('<li>', { id: 'mail-' + mail.ident});
nodeToAttachTo.append(mailItemContainer);
+ mail.currentTag = currentTag;
var mailToCreate = MAIL_ITEM_TYPE[mail.mailbox] || GenericMailItem;
mailToCreate.attachTo(mailItemContainer, {
mail: mail,
diff --git a/web-ui/app/js/mail_list/ui/mail_items/draft_item.js b/web-ui/app/js/mail_list/ui/mail_items/draft_item.js
index fda6c3f8..57fbafd5 100644
--- a/web-ui/app/js/mail_list/ui/mail_items/draft_item.js
+++ b/web-ui/app/js/mail_list/ui/mail_items/draft_item.js
@@ -33,16 +33,14 @@ define(
if (this.isOpeningOnANewTab(ev)) {
return;
}
- this.trigger(document, events.dispatchers.rightPane.openDraft, { ident: this.attr.ident });
- this.trigger(document, events.ui.mail.updateSelected, { ident: this.attr.ident });
- this.trigger(document, events.router.pushState, { mailIdent: this.attr.ident });
+ this.trigger(document, events.dispatchers.rightPane.openDraft, { ident: this.attr.mail.ident });
+ this.trigger(document, events.ui.mail.updateSelected, { ident: this.attr.mail.ident });
+ this.trigger(document, events.router.pushState, { mailIdent: this.attr.mail.ident });
ev.preventDefault(); // don't let the hashchange trigger a popstate
};
this.after('initialize', function () {
- this.initializeAttributes();
this.render();
- this.attachListeners();
if (this.attr.isChecked) {
this.checkCheckbox();
diff --git a/web-ui/app/js/mail_list/ui/mail_items/generic_mail_item.js b/web-ui/app/js/mail_list/ui/mail_items/generic_mail_item.js
index b700eeeb..939f7e1b 100644
--- a/web-ui/app/js/mail_list/ui/mail_items/generic_mail_item.js
+++ b/web-ui/app/js/mail_list/ui/mail_items/generic_mail_item.js
@@ -38,14 +38,14 @@ define(
updateMailStatusToRead.call(this);
return;
}
- this.trigger(document, events.ui.mail.open, { ident: this.attr.ident });
- this.trigger(document, events.router.pushState, { mailIdent: this.attr.ident });
+ this.trigger(document, events.ui.mail.open, { ident: this.attr.mail.ident });
+ this.trigger(document, events.router.pushState, { mailIdent: this.attr.mail.ident });
ev.preventDefault(); // don't let the hashchange trigger a popstate
};
function updateMailStatusToRead() {
if (!_.contains(this.attr.mail.status, this.status.READ)) {
- var mail_read_data = { ident: this.attr.ident, tags: this.attr.tags, mailbox: this.attr.mailbox };
+ var mail_read_data = { ident: this.attr.mail.ident, tags: this.attr.mail.tags, mailbox: this.attr.mail.mailbox };
this.trigger(document, events.mail.read, mail_read_data);
this.attr.mail.status.push(this.status.READ);
this.$node.addClass(viewHelpers.formatStatusClasses(this.attr.mail.status));
@@ -53,16 +53,16 @@ define(
}
this.openMail = function (ev, data) {
- if (data.ident !== this.attr.ident) {
+ if (data.ident !== this.attr.mail.ident) {
return;
}
updateMailStatusToRead.call(this);
- this.trigger(document, events.ui.mail.updateSelected, { ident: this.attr.ident });
+ this.trigger(document, events.ui.mail.updateSelected, { ident: this.attr.mail.ident });
};
this.updateTags = function(ev, data) {
- if(data.ident === this.attr.ident){
+ if(data.ident === this.attr.mail.ident){
this.attr.tags = data.tags;
if(!_.contains(this.attr.tags, this.attr.tag)) {
this.teardown();
@@ -73,16 +73,13 @@ define(
};
this.deleteMail = function(ev, data) {
- if(data.mail.ident === this.attr.ident){
+ if(data.mail.ident === this.attr.mail.ident){
this.teardown();
}
};
this.after('initialize', function () {
- this.initializeAttributes();
- this.attr.tagsForListView = _.without(this.attr.tags, this.attr.tag);
this.render();
- this.attachListeners();
if (this.attr.isChecked) {
this.checkCheckbox();
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 fe77b248..266db926 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
@@ -26,14 +26,10 @@ define(
function mailItem() {
this.updateSelected = function (ev, data) {
- if (data.ident === this.attr.ident) { this.doSelect(); }
+ if (data.ident === this.attr.mail.ident) { this.doSelect(); }
else { this.doUnselect(); }
};
- this.formattedDate = function (date) {
- return viewHelper.getFormattedDate(new Date(date));
- };
-
this.isOpeningOnANewTab = function (ev) {
return ev.metaKey || ev.ctrlKey || ev.which === 2;
};
@@ -69,34 +65,22 @@ define(
};
this.render = function () {
- this.attr.tagsForListView = _.without(this.attr.tags, this.attr.tag);
- var mailItemHtml = templates.mails[this.attr.templateType](this.attr);
+ this.attr.mail.tagsForListView = _.without(this.attr.mail.tags, this.attr.tag);
+ var mailItemHtml = templates.mails[this.attr.templateType](this.attr.mail);
this.$node.html(mailItemHtml);
- this.$node.addClass(this.attr.statuses);
- if(this.attr.selected) { this.doSelect(); }
+ this.$node.addClass(viewHelper.formatStatusClasses(this.attr.mail.status));
+ if (this.attr.selected) { this.doSelect(); }
this.on(this.$node.find('a'), 'click', this.triggerOpenMail);
};
- this.initializeAttributes = function () {
- var mail = this.attr.mail;
- this.attr.ident = mail.ident;
- this.attr.header = mail.header;
- this.attr.ident = mail.ident;
- this.attr.statuses = viewHelper.formatStatusClasses(mail.status);
- this.attr.tags = mail.tags;
- this.attr.attachments = mail.attachments;
- this.attr.mailbox = mail.mailbox;
- this.attr.header.formattedDate = this.formattedDate(mail.header.date);
- };
-
- this.attachListeners = function () {
+ this.after('initialize', function () {
this.on(this.$node.find('input[type=checkbox]'), 'change', this.doMailChecked);
this.on(document, events.ui.mails.cleanSelected, this.doUnselect);
this.on(document, events.ui.tag.select, this.doUnselect);
this.on(document, events.ui.tag.select, this.uncheckCheckbox);
this.on(document, events.ui.mails.uncheckAll, this.uncheckCheckbox);
this.on(document, events.ui.mails.checkAll, this.checkCheckbox);
- };
+ });
}
return mailItem;
diff --git a/web-ui/app/js/mail_list/ui/mail_items/sent_item.js b/web-ui/app/js/mail_list/ui/mail_items/sent_item.js
index 3cfa25bd..9e511068 100644
--- a/web-ui/app/js/mail_list/ui/mail_items/sent_item.js
+++ b/web-ui/app/js/mail_list/ui/mail_items/sent_item.js
@@ -32,23 +32,20 @@ define(
if (this.isOpeningOnANewTab(ev)) {
return;
}
- this.trigger(document, events.ui.mail.open, { ident: this.attr.ident });
- this.trigger(document, events.router.pushState, { mailIdent: this.attr.ident });
+ this.trigger(document, events.ui.mail.open, { ident: this.attr.mail.ident });
+ this.trigger(document, events.router.pushState, { mailIdent: this.attr.mail.ident });
ev.preventDefault(); // don't let the hashchange trigger a popstate
};
this.openMail = function (ev, data) {
- if (data.ident !== this.attr.ident) {
+ if (data.ident !== this.attr.mail.ident) {
return;
}
- this.trigger(document, events.ui.mail.updateSelected, { ident: this.attr.ident });
+ this.trigger(document, events.ui.mail.updateSelected, { ident: this.attr.mail.ident });
};
this.after('initialize', function () {
- this.initializeAttributes();
- this.attr.tagsForListView = _.without(this.attr.tags, this.attr.tag);
this.render();
- this.attachListeners();
if (this.attr.isChecked) {
this.checkCheckbox();
diff --git a/web-ui/app/js/mail_view/ui/mail_view.js b/web-ui/app/js/mail_view/ui/mail_view.js
index 578dcbb9..71a67e5a 100644
--- a/web-ui/app/js/mail_view/ui/mail_view.js
+++ b/web-ui/app/js/mail_view/ui/mail_view.js
@@ -47,9 +47,6 @@ define(
this.displayMail = function (event, data) {
this.attr.mail = data.mail;
- var date = new Date(data.mail.header.date);
- data.mail.header.formattedDate = viewHelpers.getFormattedDate(date);
-
var signed, encrypted;
data.mail.security_casing = data.mail.security_casing || {};
diff --git a/web-ui/app/templates/mails/draft.hbs b/web-ui/app/templates/mails/draft.hbs
index 87862f34..c3d2fa5b 100644
--- a/web-ui/app/templates/mails/draft.hbs
+++ b/web-ui/app/templates/mails/draft.hbs
@@ -2,8 +2,8 @@
<input type="checkbox"/>
</span>
<span>
- <a href="/#/{{ tag }}/mail/{{ ident }}">
- <span class="sent-date">{{ header.formattedDate }}</span>
+ <a href="/#/{{ currentTag }}/mail/{{ ident }}">
+ <span class="sent-date">{{ formatDate header.date }}</span>
<div class="from">
{{t 'to:'}}
diff --git a/web-ui/app/templates/mails/full_view.hbs b/web-ui/app/templates/mails/full_view.hbs
index 55d116d2..a5c41121 100644
--- a/web-ui/app/templates/mails/full_view.hbs
+++ b/web-ui/app/templates/mails/full_view.hbs
@@ -34,7 +34,7 @@
{{{formatRecipients header}}}
</div>
<div class="recipients column large-2 text-right">
- <span class="received-date">{{ header.formattedDate }}</span>
+ <span class="received-date">{{ formatDate header.date }}</span>
</div>
<div>
<h3 class="subjectArea column large-10 no-padding">
diff --git a/web-ui/app/templates/mails/sent.hbs b/web-ui/app/templates/mails/sent.hbs
index e4b49b37..a0712124 100644
--- a/web-ui/app/templates/mails/sent.hbs
+++ b/web-ui/app/templates/mails/sent.hbs
@@ -2,8 +2,8 @@
<input type="checkbox"/>
</span>
<span>
- <a href="/#/{{ tag }}/mail/{{ ident }}">
- <span class="sent-date">{{ header.formattedDate }}</span>
+ <a href="/#/{{ currentTag }}/mail/{{ ident }}">
+ <span class="sent-date">{{ formatDate header.date }}</span>
<div class="from">
{{t 'to:'}}
diff --git a/web-ui/app/templates/mails/single.hbs b/web-ui/app/templates/mails/single.hbs
index 90023713..47d600fb 100644
--- a/web-ui/app/templates/mails/single.hbs
+++ b/web-ui/app/templates/mails/single.hbs
@@ -2,8 +2,8 @@
<input type="checkbox" {{#if isChecked }}checked="true"{{/if}} />
</span>
<span>
- <a href="/#/{{ tag }}/mail/{{ ident }}">
- <span class="received-date">{{ header.formattedDate }}
+ <a href="/#/{{ currentTag }}/mail/{{ ident }}">
+ <span class="received-date">{{ formatDate header.date }}
{{#if attachments}}
<div class="attachment-indicator">
<i class="fa fa-paperclip"></i>
diff --git a/web-ui/app/templates/mails/trash.hbs b/web-ui/app/templates/mails/trash.hbs
index a74c9606..4475aeb0 100644
--- a/web-ui/app/templates/mails/trash.hbs
+++ b/web-ui/app/templates/mails/trash.hbs
@@ -2,7 +2,7 @@
<input type="checkbox" {{#if isChecked }}checked="true"{{/if}} />
</span>
<span>
- <a href="/#/{{ tag }}/mail/{{ ident }}">
+ <a href="/#/{{ currentTag }}/mail/{{ ident }}">
<span class="received-date">{{ header.formattedDate }}
{{#if attachments}}
<div class="attachment-indicator">
diff --git a/web-ui/test/spec/helpers/view_helper.spec.js b/web-ui/test/spec/helpers/view_helper.spec.js
index 920709b2..655ba181 100644
--- a/web-ui/test/spec/helpers/view_helper.spec.js
+++ b/web-ui/test/spec/helpers/view_helper.spec.js
@@ -25,25 +25,29 @@ define(['helpers/view_helper'], function (viewHelper) {
});
});
- describe('getFormmattedDate', function() {
+ describe('formatDate', function() {
+ var template;
+ beforeEach(function () {
+ template = Handlebars.compile('{{formatDate date}}');
+ });
+
it('formats correctly a Date for today', function() {
var d = new Date();
- var dtest = new Date(d.getFullYear(), d.getMonth(), d.getDate(), 14, 2, 36);
-
- var res = viewHelper.getFormattedDate(dtest);
+ var mailDate = new Date(d.getFullYear(), d.getMonth(), d.getDate(), 14, 2, 36);
- expect(res).toEqual('14:02');
+ var result = template({ date: mailDate.toISOString() });
+ expect(result).toEqual('14:02');
});
it('formats correctly a Date for a specific day', function() {
- var dtest = new Date(2013, 2, 13, 7, 56, 1);
+ var mailDate = new Date(2013, 2, 13, 7, 56, 1);
- var res = viewHelper.getFormattedDate(dtest);
+ var result = template({ date: mailDate.toISOString() });
// This expectation is weird for the month - JS Dates have date numbers be zero-indexed, thus the discrepancy
// Specifically, the 2 in the constructor DOES match the 3 in the expectation below.
- expect(res).toEqual('2013-03-13');
+ expect(result).toEqual('2013-03-13');
});
});
diff --git a/web-ui/test/spec/mail_list/ui/mail_items/draft_item.spec.js b/web-ui/test/spec/mail_list/ui/mail_items/draft_item.spec.js
new file mode 100644
index 00000000..fbe285c6
--- /dev/null
+++ b/web-ui/test/spec/mail_list/ui/mail_items/draft_item.spec.js
@@ -0,0 +1,32 @@
+describeComponent('mail_list/ui/mail_items/draft_item', function () {
+ 'use strict';
+
+ var mail;
+
+ beforeEach(function () {
+ mail = Pixelated.testData().parsedMail.draft;
+
+ this.setupComponent('<li></li>', {
+ mail: mail,
+ selected: false,
+ templateType: 'single'
+ });
+ });
+
+ it('should de-select the item if a new mail is composed', function () {
+ this.component.$node.addClass('selected');
+
+ $(document).trigger(Pixelated.events.ui.composeBox.newMessage);
+
+ expect(this.component.$node).not.toHaveClass('selected');
+ });
+
+ it('should trigger the openDraft event when clicked', function () {
+ var openDraftEvent = spyOnEvent(document, Pixelated.events.dispatchers.rightPane.openDraft);
+
+ this.$node.find('a').click();
+
+ expect(openDraftEvent).toHaveBeenTriggeredOnAndWith(document, { ident: 'B2432' });
+ });
+});
+
diff --git a/web-ui/test/spec/mail_list/ui/mail_items/generic_mail_item.spec.js b/web-ui/test/spec/mail_list/ui/mail_items/generic_mail_item.spec.js
index 88735302..87d38595 100644
--- a/web-ui/test/spec/mail_list/ui/mail_items/generic_mail_item.spec.js
+++ b/web-ui/test/spec/mail_list/ui/mail_items/generic_mail_item.spec.js
@@ -7,11 +7,11 @@ describeComponent('mail_list/ui/mail_items/generic_mail_item', function () {
mail = Pixelated.testData().parsedMail.simpleTextPlain;
mail.tags = [];
mail.mailbox = 'inbox';
+ mail.currentTag = 'inbox';
this.setupComponent('<li></li>', {
mail: mail,
selected: false,
- tag: 'inbox',
templateType: 'single'
});
});
diff --git a/web-ui/test/spec/mail_list/ui/mail_items/mail_item.spec.js b/web-ui/test/spec/mail_list/ui/mail_items/mail_item.spec.js
index b1ac3037..03f95e54 100644
--- a/web-ui/test/spec/mail_list/ui/mail_items/mail_item.spec.js
+++ b/web-ui/test/spec/mail_list/ui/mail_items/mail_item.spec.js
@@ -10,7 +10,6 @@ describeMixin('mail_list/ui/mail_items/mail_item', function () {
selected: false,
tag: 'inbox'
});
- this.component.attachListeners();
});
describe('mail checkbox', function () {
diff --git a/web-ui/test/test_data.js b/web-ui/test/test_data.js
index f09260c9..446fd7c6 100644
--- a/web-ui/test/test_data.js
+++ b/web-ui/test/test_data.js
@@ -170,6 +170,38 @@ define(function() {
}
};
+ var draftMail = {
+ status: [],
+ header: {'from': 'jed_waelchi@cummerata.info',
+ cc: [],
+ bcc: [],
+ to: [],
+ date: '2015-04-09T18:30:18.998999-03:00',
+ subject: 'bla'},
+ ident: 'B2432',
+ replying: {'single': 'jed_waelchi@cummerata.info',
+ all: {
+ 'to-field': ['jed_waelchi@cummerata.info'],
+ 'cc-field': []
+ }
+ },
+ attachments: [],
+ textPlainBody: 'bla',
+ tags: [],
+ htmlBody: null,
+ mailbox: 'drafts',
+ security_casing: {'locks': [],
+ imprints: [{'state': 'no_signature_information'}]
+ },
+ isSentMail: function() { return false; },
+ isDraftMail: function() { return false; },
+ replyToAddress: function() { return { to: ['jed_waelchi@cummerata.info'], cc: [] }; },
+ replyToAllAddress: function() { return { to: ['jed_waelchi@cummerata.info'], cc: [] }; },
+ isMailMultipartAlternative: function () { return false; },
+ availableBodyPartsContentType: function () { return []; },
+ getMailPartByContentType: function () { return; }
+ };
+
var testData = {
rawMail: {
mail: rawMail,
@@ -182,7 +214,8 @@ define(function() {
},
parsedMail: {
simpleTextPlain: simpleTextPlainMail,
- html: htmlNoEncodingMail
+ html: htmlNoEncodingMail,
+ draft: draftMail
}
};