diff options
author | Giovane <giovaneliberato@gmail.com> | 2015-11-09 15:52:16 -0200 |
---|---|---|
committer | Folker Bernitt <fbernitt@thoughtworks.com> | 2015-11-09 18:58:52 +0100 |
commit | f2f5473ead184032d1de6208bc2530dfb88455fc (patch) | |
tree | 248a9e4122ff5316e36698161e284e2f7579f4aa | |
parent | a222f811d07846dfdbeac963fa753fedbd88c13a (diff) |
Adds style and tag information on 'No Mails available' message.
- Issue #503
6 files changed, 30 insertions, 15 deletions
diff --git a/web-ui/app/js/dispatchers/middle_pane_dispatcher.js b/web-ui/app/js/dispatchers/middle_pane_dispatcher.js index 59263af2..7a53b769 100644 --- a/web-ui/app/js/dispatchers/middle_pane_dispatcher.js +++ b/web-ui/app/js/dispatchers/middle_pane_dispatcher.js @@ -29,8 +29,8 @@ define(['flight/lib/component', 'page/events', 'helpers/triggering', 'mail_view/ return child_div; }; - this.resetChildDiv = function() { - this.select('middlePane').empty(); + this.resetChildDiv = function(component_id) { + $('#' + component_id).remove(); }; this.refreshMailList = function (ev, data) { @@ -52,12 +52,12 @@ define(['flight/lib/component', 'page/events', 'helpers/triggering', 'mail_view/ }; this.onMailsChange = function (ev, data) { + this.resetChildDiv(this.attr.noMailsAvailablePane); if (data.mails.length > 0) { NoMailsAvailablePane.teardownAll(); - this.resetChildDiv(); } else { var child_div = this.createChildDiv(this.attr.noMailsAvailablePane); - NoMailsAvailablePane.attachTo(child_div); + NoMailsAvailablePane.attachTo(child_div, {tag: data.tag}); } }; diff --git a/web-ui/app/js/mail_view/ui/no_mails_available_pane.js b/web-ui/app/js/mail_view/ui/no_mails_available_pane.js index edcaade0..32b6bc19 100644 --- a/web-ui/app/js/mail_view/ui/no_mails_available_pane.js +++ b/web-ui/app/js/mail_view/ui/no_mails_available_pane.js @@ -29,15 +29,17 @@ define( return defineComponent(noMailsAvailablePane); function noMailsAvailablePane() { + this.defaultAttrs({ + tag: null + }); this.render = function() { - this.$node.html(templates.noMailsAvailable()); + this.attr.tag = this.attr.tag.toUpperCase(); + this.$node.html(templates.noMailsAvailable(this.attr)); }; this.after('initialize', function () { this.render(); - - // this.on(document, events.dispatchers.middlePane.clear, this.teardown); }); } } diff --git a/web-ui/app/scss/_mascot.scss b/web-ui/app/scss/_mascot.scss index 98812ce2..9a8b8bdb 100644 --- a/web-ui/app/scss/_mascot.scss +++ b/web-ui/app/scss/_mascot.scss @@ -30,3 +30,19 @@ margin-bottom: 40px; } } + +#no-mails-available-pane { + text-align: center; + line-height: 65vh; + + .scene{ + display:inline-block; + vertical-align:middle; + } + + .text{ + color:#666; + margin-bottom: 40px; + } + +} diff --git a/web-ui/app/templates/compose/no_mails_available.hbs b/web-ui/app/templates/compose/no_mails_available.hbs index a3ec46b3..ce887267 100644 --- a/web-ui/app/templates/compose/no_mails_available.hbs +++ b/web-ui/app/templates/compose/no_mails_available.hbs @@ -1,3 +1,3 @@ <div class="scene"> - <div class="text">{{t 'NO MAILS AVAILABLE'}}.</div> + <div class="text">{{t 'NO EMAILS IN'}} '{{ tag }}'.</div> </div> diff --git a/web-ui/test/spec/dispatchers/middle_pane_dispatchers.spec.js b/web-ui/test/spec/dispatchers/middle_pane_dispatchers.spec.js index 265e1d4f..3d55cbaa 100644 --- a/web-ui/test/spec/dispatchers/middle_pane_dispatchers.spec.js +++ b/web-ui/test/spec/dispatchers/middle_pane_dispatchers.spec.js @@ -31,14 +31,14 @@ describeComponent('dispatchers/middle_pane_dispatcher', function () { spyOn(noMailsAvailablePane, 'teardownAll'); }); - it('should listen to no mails available event and show noMailsAvailablePane', function () { + it('should listen to mails available event and show noMailsAvailablePane', function () { var mail_list = { mails: []}; this.component.trigger(document, Pixelated.events.mails.available, mail_list); expect(noMailsAvailablePane.attachTo).toHaveBeenCalled(); }); - it('should tbd', function () { + it('should listen to mails available event and do not show noMailsAvailablePane', function () { var pretend_to_be_a_mail = {}; var mail_list = { mails: [pretend_to_be_a_mail]}; this.component.trigger(document, Pixelated.events.mails.available, mail_list); diff --git a/web-ui/test/spec/mail_view/ui/no_mails_available_pane.spec.js b/web-ui/test/spec/mail_view/ui/no_mails_available_pane.spec.js index da19cf2e..2fee45ac 100644 --- a/web-ui/test/spec/mail_view/ui/no_mails_available_pane.spec.js +++ b/web-ui/test/spec/mail_view/ui/no_mails_available_pane.spec.js @@ -2,12 +2,9 @@ describeComponent('mail_view/ui/no_mails_available_pane', function () { 'use strict'; describe('after initialization', function () { - beforeEach(function () { - this.setupComponent(); - }); - it('renders template', function () { - expect(this.$node.html()).toMatch('<div class="text">NO MAILS AVAILABLE.</div>'); + this.setupComponent({tag: 'inbox'}); + expect(this.$node.html()).toMatch('<div class="text">NO EMAILS IN \'INBOX\'.</div>'); }); }); }); |