From 59532a50c8b0233b2a596b996cbe799b745c4fac Mon Sep 17 00:00:00 2001 From: Giovane Date: Wed, 2 Mar 2016 17:32:08 -0300 Subject: Hides reply box container until mail data is loaded #662 with @jeffhsta --- web-ui/app/js/mail_view/ui/mail_view.js | 1 + web-ui/app/js/mail_view/ui/reply_section.js | 20 +++++++++++++++----- web-ui/app/js/page/events.js | 3 ++- web-ui/test/spec/mail_view/ui/mail_view.spec.js | 5 +++++ web-ui/test/spec/mail_view/ui/reply_section.spec.js | 16 ++++++++++++++++ 5 files changed, 39 insertions(+), 6 deletions(-) (limited to 'web-ui') 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 8465b45a..dfc57585 100644 --- a/web-ui/app/js/mail_view/ui/mail_view.js +++ b/web-ui/app/js/mail_view/ui/mail_view.js @@ -76,6 +76,7 @@ define( this.trigger(document, events.search.highlightResults, {where: '.bodyArea'}); this.trigger(document, events.search.highlightResults, {where: '.subjectArea'}); this.trigger(document, events.search.highlightResults, {where: '.msg-header .recipients'}); + this.trigger(document, events.ui.replyBox.showReplyContainer); this.attachTagCompletion(this.attr.mail); diff --git a/web-ui/app/js/mail_view/ui/reply_section.js b/web-ui/app/js/mail_view/ui/reply_section.js index 46dfe863..cbe64205 100644 --- a/web-ui/app/js/mail_view/ui/reply_section.js +++ b/web-ui/app/js/mail_view/ui/reply_section.js @@ -36,7 +36,8 @@ define( replyAllButton: '#reply-all-button', forwardButton: '#forward-button', replyBox: '#reply-box', - replyType: 'reply' + replyType: 'reply', + replyContainer: '.reply-container' }); this.showReply = function() { @@ -64,9 +65,7 @@ define( this.checkForDraftReply = function() { this.render(); - this.select('replyButton').hide(); - this.select('replyAllButton').hide(); - this.select('forwardButton').hide(); + this.hideContainer(); this.trigger(document, events.mail.draftReply.want, {ident: this.attr.ident}); }; @@ -76,11 +75,13 @@ define( }; this.showDraftReply = function(ev, data) { + this.showContainer(); this.hideButtons(); ReplyBox.attachTo(this.select('replyBox'), { mail: data.mail, draftReply: true }); }; this.showReplyComposeBox = function (ev, data) { + this.showContainer(); this.hideButtons(); if(this.attr.replyType === 'forward') { ForwardBox.attachTo(this.select('replyBox'), { mail: data.mail }); @@ -89,6 +90,14 @@ define( } }; + this.hideContainer = function() { + this.select('replyContainer').hide(); + }; + + this.showContainer = function() { + this.select('replyContainer').show(); + }; + this.hideButtons = function() { this.select('replyButton').hide(); this.select('replyAllButton').hide(); @@ -96,6 +105,7 @@ define( }; this.showButtons = function () { + this.showContainer(); this.select('replyBox').empty(); this.select('replyButton').show(); this.select('replyAllButton').show(); @@ -109,7 +119,7 @@ define( this.on(this, events.mail.here, this.showReplyComposeBox); this.on(document, events.dispatchers.rightPane.clear, this.teardown); - this.on(document, events.mail.draftReply.notFound, this.showButtons); + this.on(document, events.ui.replyBox.showReplyContainer, this.showContainer); this.on(document, events.mail.draftReply.here, this.showDraftReply); this.checkForDraftReply(); diff --git a/web-ui/app/js/page/events.js b/web-ui/app/js/page/events.js index 1ec27c46..7a0dbf9d 100644 --- a/web-ui/app/js/page/events.js +++ b/web-ui/app/js/page/events.js @@ -79,7 +79,8 @@ define(function () { }, replyBox: { showReply: 'ui:replyBox:showReply', - showReplyAll: 'ui:replyBox:showReplyAll' + showReplyAll: 'ui:replyBox:showReplyAll', + showReplyContainer: 'ui:replyBox:showReplyContainer', }, recipients: { entered: 'ui:recipients:entered', diff --git a/web-ui/test/spec/mail_view/ui/mail_view.spec.js b/web-ui/test/spec/mail_view/ui/mail_view.spec.js index ae874621..9ed56023 100644 --- a/web-ui/test/spec/mail_view/ui/mail_view.spec.js +++ b/web-ui/test/spec/mail_view/ui/mail_view.spec.js @@ -29,6 +29,11 @@ describeComponent('mail_view/ui/mail_view', function () { expect(openNoMessageSelectedEvent).toHaveBeenTriggeredOn(document); }); + it('should open reply container', function () { + var showContainerEvent = spyOnEvent(document, Pixelated.events.ui.replyBox.showReplyContainer); + this.component.displayMail({}, testData); + expect(showContainerEvent).toHaveBeenTriggeredOn(document); + }); it('removes the tag from the mail when the tag label is clicked', function() { var updateSpy = spyOnEvent(document, Pixelated.events.mail.tags.update); diff --git a/web-ui/test/spec/mail_view/ui/reply_section.spec.js b/web-ui/test/spec/mail_view/ui/reply_section.spec.js index 9cdf7405..00709684 100644 --- a/web-ui/test/spec/mail_view/ui/reply_section.spec.js +++ b/web-ui/test/spec/mail_view/ui/reply_section.spec.js @@ -5,6 +5,18 @@ describeComponent('mail_view/ui/reply_section', function () { this.setupComponent(); }); + describe('show/hide reply container', function () { + it('should hide reply container until mail data is loaded', function () { + this.component.checkForDraftReply(); + expect(this.component.select('replyContainer')).toBeHidden(); + }); + + it('should show reply container when mail data is loaded', function () { + this.component.trigger(document, Pixelated.events.ui.replyBox.showReplyContainer); + expect(this.component.select('replyContainer')).not.toBeHidden(); + }); + }); + describe('clicking reply buttons', function() { var mailWantEvent, expectEventData; @@ -45,6 +57,7 @@ describeComponent('mail_view/ui/reply_section', function () { this.component.attr.replyType = 'reply'; this.component.trigger(this.component, Pixelated.events.mail.here, { mail: mailData }); + expect(this.component.select('replyContainer')).not.toBeHidden(); expect(ReplyBox.attachTo).toHaveBeenCalledWith(jasmine.any(Object), { mail: mailData, replyType: 'reply' @@ -55,6 +68,7 @@ describeComponent('mail_view/ui/reply_section', function () { this.component.attr.replyType = 'replyall'; this.component.trigger(this.component, Pixelated.events.mail.here, { mail: mailData }); + expect(this.component.select('replyContainer')).not.toBeHidden(); expect(ReplyBox.attachTo).toHaveBeenCalledWith(jasmine.any(Object), { mail: mailData, replyType: 'replyall' @@ -65,6 +79,7 @@ describeComponent('mail_view/ui/reply_section', function () { this.component.attr.replyType = 'forward'; this.component.trigger(this.component, Pixelated.events.mail.here, { mail: mailData }); + expect(this.component.select('replyContainer')).not.toBeHidden(); expect(ForwardBox.attachTo).toHaveBeenCalledWith(jasmine.any(Object), { mail: mailData }); @@ -87,6 +102,7 @@ describeComponent('mail_view/ui/reply_section', function () { $(document).trigger(Pixelated.events.ui.composeBox.trashReply); + expect(this.component.select('replyContainer')).not.toBeHidden(); expect(this.component.select('replyButton')).not.toBeHidden(); expect(this.component.select('replyAllButton')).not.toBeHidden(); expect(this.component.select('forwardButton')).not.toBeHidden(); -- cgit v1.2.3