From e3939d4c1dff0f152fa13ce8a89f751c79ecace2 Mon Sep 17 00:00:00 2001 From: Jefferson Stachelski Date: Mon, 1 Feb 2016 17:50:06 -0200 Subject: Issue #549 - Implemented UI part of remote attachments --- web-ui/app/js/mail_view/ui/attachment_list.js | 16 +++++++++++++--- web-ui/app/js/mail_view/ui/draft_box.js | 17 ++++++++++++++++- web-ui/app/js/mail_view/ui/forward_box.js | 17 ++++++++++++++++- web-ui/app/js/page/events.js | 3 ++- web-ui/app/scss/_read.scss | 15 ++++++++++----- web-ui/app/templates/compose/attachment_item.hbs | 5 ++++- web-ui/app/templates/compose/attachments_list.hbs | 1 - 7 files changed, 61 insertions(+), 13 deletions(-) (limited to 'web-ui') diff --git a/web-ui/app/js/mail_view/ui/attachment_list.js b/web-ui/app/js/mail_view/ui/attachment_list.js index f0581c67..3def6870 100644 --- a/web-ui/app/js/mail_view/ui/attachment_list.js +++ b/web-ui/app/js/mail_view/ui/attachment_list.js @@ -53,15 +53,25 @@ define( this.renderAttachmentListView = function (data) { var currentHtml = this.select('attachmentListItem').html(); var item = this.buildAttachmentListItem(data); - this.select('attachmentListItem').html(currentHtml + item); + this.select('attachmentListItem').append(item); }; this.buildAttachmentListItem = function (attachment) { var attachmentData = {ident: attachment.ident, encoding: attachment.encoding, name: attachment.name, - size: attachment.size}; - return templates.compose.attachmentItem(attachmentData); + size: attachment.size, + removable: true}; + + var element = $(templates.compose.attachmentItem(attachmentData)); + var self = this; + element.find('i.remove-icon').bind('click', function(event) { + var element = $(this); + var ident = element.closest('li').attr('data-ident'); + self.trigger(document, events.mail.removeAttachment, {ident: ident}); + event.preventDefault(); + }); + return element; }; this.checkAttachmentSize = function(e, data) { diff --git a/web-ui/app/js/mail_view/ui/draft_box.js b/web-ui/app/js/mail_view/ui/draft_box.js index 88051f30..07a7e472 100644 --- a/web-ui/app/js/mail_view/ui/draft_box.js +++ b/web-ui/app/js/mail_view/ui/draft_box.js @@ -64,7 +64,15 @@ define( }, subject: mail.header.subject, body: body, - attachments: mail.attachments + attachments: this.convertToRemovableAttachments(mail.attachments) + }); + + var self = this; + this.$node.find('i.remove-icon').bind('click', function(event) { + var element = $(this); + var ident = element.closest('li').attr('data-ident'); + self.trigger(document, events.mail.removeAttachment, {ident: ident}); + event.preventDefault(); }); this.enableFloatlabel('input.floatlabel'); @@ -77,6 +85,13 @@ define( this.on(this.select('closeMailButton'), 'click', this.showNoMessageSelected); }; + this.convertToRemovableAttachments = function(attachments) { + return attachments.map(function(attachment) { + attachment.removable = true; + return attachment; + }); + }; + this.mailDeleted = function(event, data) { if (_.contains(_.pluck(data.mails, 'ident'), this.attr.ident)) { this.trigger(events.dispatchers.rightPane.openNoMessageSelected); diff --git a/web-ui/app/js/mail_view/ui/forward_box.js b/web-ui/app/js/mail_view/ui/forward_box.js index a1b8dc41..3d643b2f 100644 --- a/web-ui/app/js/mail_view/ui/forward_box.js +++ b/web-ui/app/js/mail_view/ui/forward_box.js @@ -46,14 +46,29 @@ define( subject: this.attr.subject, recipients: { to: [], cc: []}, body: viewHelper.quoteMail(mail), - attachments: mail.attachments + attachments: this.convertToRemovableAttachments(mail.attachments) }); + var self = this; + this.$node.find('i.remove-icon').bind('click', function(event) { + var element = $(this); + var ident = element.closest('li').attr('data-ident'); + self.trigger(document, events.mail.removeAttachment, {ident: ident}); + event.preventDefault(); + }); + this.on(this.select('subjectDisplay'), 'click', this.showSubjectInput); this.select('recipientsDisplay').hide(); this.select('recipientsFields').show(); }; + this.convertToRemovableAttachments = function(attachments) { + return attachments.map(function(attachment) { + attachment.removable = true; + return attachment; + }); + }; + this.showSubjectInput = function() { this.select('subjectDisplay').hide(); this.select('subjectInput').show(); diff --git a/web-ui/app/js/page/events.js b/web-ui/app/js/page/events.js index f6186d41..57dd346a 100644 --- a/web-ui/app/js/page/events.js +++ b/web-ui/app/js/page/events.js @@ -147,7 +147,8 @@ define(function () { uploadingAttachment: 'mail:uploading:attachment', startUploadAttachment: 'mail:start:upload:attachment', appendAttachment: 'mail:append:attachment', - resetAttachments: 'mail:reset:attachments' + resetAttachments: 'mail:reset:attachments', + removeAttachment: 'mail:remove:attachment' }, mails: { available: 'mails:available', diff --git a/web-ui/app/scss/_read.scss b/web-ui/app/scss/_read.scss index 93e33c27..1b6f8334 100644 --- a/web-ui/app/scss/_read.scss +++ b/web-ui/app/scss/_read.scss @@ -31,7 +31,7 @@ height: 27px; margin-right: 3px; } - + .full-view-header { display:inline-block; padding-top: 5px; @@ -81,14 +81,14 @@ border-radius: 2px; background-color: #F5F5F5; margin-bottom: 8px; - + a { color: $attachment_text; display: block; text-decoration: none; line-height: inherit; padding: 4px 5px; - + &:hover, &:focus { i.download-icon { color: lighten($attachment_icon, 15); @@ -104,6 +104,13 @@ right: 0; padding: 7px 10px; } + + i.remove-icon { + float: right; + padding-right: 5px; + padding-top: 7px; + color: #999; + } } } } @@ -154,5 +161,3 @@ } } } - - diff --git a/web-ui/app/templates/compose/attachment_item.hbs b/web-ui/app/templates/compose/attachment_item.hbs index a69f209e..6fefda2f 100644 --- a/web-ui/app/templates/compose/attachment_item.hbs +++ b/web-ui/app/templates/compose/attachment_item.hbs @@ -1,8 +1,11 @@ -
  • +
  • {{ this.name }} ({{ formatSize this.size}}) {{#if received}} {{/if}} + {{#if removable}} + + {{/if}}
    • diff --git a/web-ui/app/templates/compose/attachments_list.hbs b/web-ui/app/templates/compose/attachments_list.hbs index 73113023..936db2c9 100644 --- a/web-ui/app/templates/compose/attachments_list.hbs +++ b/web-ui/app/templates/compose/attachments_list.hbs @@ -21,4 +21,3 @@
    - -- cgit v1.2.3