diff options
-rw-r--r-- | web-ui/app/js/dispatchers/middle_pane_dispatcher.js | 26 | ||||
-rw-r--r-- | web-ui/app/js/mail_view/ui/no_mails_available_pane.js | 44 | ||||
-rw-r--r-- | web-ui/app/js/page/default.js | 2 | ||||
-rw-r--r-- | web-ui/app/js/views/templates.js | 1 | ||||
-rw-r--r-- | web-ui/app/templates/compose/no_mails_available.hbs | 3 | ||||
-rw-r--r-- | web-ui/test/spec/dispatchers/middle_pane_dispatchers.spec.js | 26 | ||||
-rw-r--r-- | web-ui/test/spec/mail_view/ui/no_mails_available_pane.spec.js | 13 |
7 files changed, 113 insertions, 2 deletions
diff --git a/web-ui/app/js/dispatchers/middle_pane_dispatcher.js b/web-ui/app/js/dispatchers/middle_pane_dispatcher.js index f988454c..59263af2 100644 --- a/web-ui/app/js/dispatchers/middle_pane_dispatcher.js +++ b/web-ui/app/js/dispatchers/middle_pane_dispatcher.js @@ -14,14 +14,25 @@ * 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/triggering'], function(defineComponent, events, triggering) { +define(['flight/lib/component', 'page/events', 'helpers/triggering', 'mail_view/ui/no_mails_available_pane'], function(defineComponent, events, triggering, NoMailsAvailablePane) { 'use strict'; return defineComponent(function() { this.defaultAttrs({ - middlePane: '#middle-pane' + middlePane: '#middle-pane', + noMailsAvailablePane: 'no-mails-available-pane' }); + this.createChildDiv = function (component_id) { + var child_div = $('<div>', {id: component_id}); + this.select('middlePane').append(child_div); + return child_div; + }; + + this.resetChildDiv = function() { + this.select('middlePane').empty(); + }; + this.refreshMailList = function (ev, data) { this.trigger(document, events.ui.mails.fetchByTag, data); }; @@ -40,10 +51,21 @@ define(['flight/lib/component', 'page/events', 'helpers/triggering'], function(d this.select('middlePane').css({height: (vh - top) + 'px'}); }; + this.onMailsChange = function (ev, data) { + if (data.mails.length > 0) { + NoMailsAvailablePane.teardownAll(); + this.resetChildDiv(); + } else { + var child_div = this.createChildDiv(this.attr.noMailsAvailablePane); + NoMailsAvailablePane.attachTo(child_div); + } + }; + this.after('initialize', function () { this.on(document, events.dispatchers.middlePane.refreshMailList, this.refreshMailList); this.on(document, events.dispatchers.middlePane.cleanSelected, this.cleanSelected); this.on(document, events.dispatchers.middlePane.resetScroll, this.resetScroll); + this.on(document, events.mails.available, this.onMailsChange); this.updateMiddlePaneHeight(); $(window).on('resize', this.updateMiddlePaneHeight.bind(this)); 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 new file mode 100644 index 00000000..edcaade0 --- /dev/null +++ b/web-ui/app/js/mail_view/ui/no_mails_available_pane.js @@ -0,0 +1,44 @@ +/* + * 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/>. + */ +define( + [ + 'flight/lib/component', + 'views/templates', + 'mixins/with_hide_and_show', + 'page/events' + ], + + function(defineComponent, templates, withHideAndShow, events) { + 'use strict'; + + //return defineComponent(noMailsAvailablePane, withHideAndShow); + return defineComponent(noMailsAvailablePane); + + function noMailsAvailablePane() { + + this.render = function() { + this.$node.html(templates.noMailsAvailable()); + }; + + this.after('initialize', function () { + this.render(); + + // this.on(document, events.dispatchers.middlePane.clear, this.teardown); + }); + } + } +); diff --git a/web-ui/app/js/page/default.js b/web-ui/app/js/page/default.js index 1189d1ad..c3d39cd3 100644 --- a/web-ui/app/js/page/default.js +++ b/web-ui/app/js/page/default.js @@ -21,6 +21,7 @@ define( 'user_alerts/ui/user_alerts', 'mail_list/ui/mail_list', 'mail_view/ui/no_message_selected_pane', + 'mail_view/ui/no_mails_available_pane', 'mail_view/ui/mail_view', 'mail_view/ui/mail_actions', 'mail_view/ui/reply_section', @@ -55,6 +56,7 @@ define( userAlerts, mailList, noMessageSelectedPane, + noMailsAvailablePane, mailView, mailViewActions, replyButton, diff --git a/web-ui/app/js/views/templates.js b/web-ui/app/js/views/templates.js index 61fb0486..80752e8e 100644 --- a/web-ui/app/js/views/templates.js +++ b/web-ui/app/js/views/templates.js @@ -53,6 +53,7 @@ define(['hbs/templates'], function (templates) { paginationTrigger: window.Pixelated['app/templates/mail_actions/pagination_trigger.hbs'] }, noMessageSelected: window.Pixelated['app/templates/compose/no_message_selected.hbs'], + noMailsAvailable: window.Pixelated['app/templates/compose/no_mails_available.hbs'], search: { trigger: window.Pixelated['app/templates/search/search_trigger.hbs'] }, diff --git a/web-ui/app/templates/compose/no_mails_available.hbs b/web-ui/app/templates/compose/no_mails_available.hbs new file mode 100644 index 00000000..a3ec46b3 --- /dev/null +++ b/web-ui/app/templates/compose/no_mails_available.hbs @@ -0,0 +1,3 @@ +<div class="scene"> + <div class="text">{{t 'NO MAILS AVAILABLE'}}.</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 997c51f2..265e1d4f 100644 --- a/web-ui/test/spec/dispatchers/middle_pane_dispatchers.spec.js +++ b/web-ui/test/spec/dispatchers/middle_pane_dispatchers.spec.js @@ -22,4 +22,30 @@ describeComponent('dispatchers/middle_pane_dispatcher', function () { this.component.trigger(document, Pixelated.events.dispatchers.middlePane.resetScroll); expect(this.component.select('middlePane').scrollTop()).toEqual(0); }); + + describe('no emails available', function () { + var noMailsAvailablePane; + beforeEach(function () { + noMailsAvailablePane = require('mail_view/ui/no_mails_available_pane'); + spyOn(noMailsAvailablePane, 'attachTo'); + spyOn(noMailsAvailablePane, 'teardownAll'); + }); + + it('should listen to no 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 () { + 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); + + expect(noMailsAvailablePane.attachTo).not.toHaveBeenCalled(); + expect(noMailsAvailablePane.teardownAll).toHaveBeenCalled(); + }); + + }); }); 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 new file mode 100644 index 00000000..da19cf2e --- /dev/null +++ b/web-ui/test/spec/mail_view/ui/no_mails_available_pane.spec.js @@ -0,0 +1,13 @@ +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>'); + }); + }); +}); |