Shows unread count on title bar

- This commit creates the unread_count_title
component

6 files changed, 69 insertions, 2 deletions

diff --git a/web-ui/app/index.html b/web-ui/app/index.html
index 9ffeee82..f11b05f8 100644
--- a/web-ui/app/index.html
+++ b/web-ui/app/index.html
@@ -6,7 +6,7 @@
       href="assets/images/Favicon.png">
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
-<title>$account_email - Pixelated Mail</title>
+<title><span id="unread-count-title"></span> $account_email - Pixelated Mail</title>
 <meta name="description" content="">
 <meta name="viewport" content="width=device-width">
 <link href="assets/bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
diff --git a/web-ui/app/js/page/default.js b/web-ui/app/js/page/default.js
index 3005c027..1ca10b50 100644
--- a/web-ui/app/js/page/default.js
+++ b/web-ui/app/js/page/default.js
@@ -50,6 +50,7 @@ define(
     'mail_view/ui/feedback_box',
     'mail_view/data/feedback_sender',
     'page/version',
+    'page/unread_count_title',
   ],
 
   function (
@@ -86,7 +87,8 @@ define(
     feedback,
     feedbackBox,
     feedbackSender,
-    version) {
+    version,
+    unreadCountTitle) {
 
     'use strict';
     function initialize(path) {
@@ -125,6 +127,8 @@ define(
 
       feedback.attachTo('#feedback');
       feedbackSender.attachTo(document);
+
+      unreadCountTitle.attachTo('#unread-count-title');
     }
 
     return initialize;
diff --git a/web-ui/app/js/page/unread_count_title.js b/web-ui/app/js/page/unread_count_title.js
new file mode 100644
index 00000000..f60f5668
--- /dev/null
+++ b/web-ui/app/js/page/unread_count_title.js
@@ -0,0 +1,40 @@
+/*
+ * Copyright (c) 2015 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',
+    'page/events',
+  ],
+
+  function (defineComponent, templates, events) {
+    'use strict';
+    
+    return defineComponent(function () {
+      this.render = function () {
+        var unreadCountTitleHTML = templates.page.unreadCountTitle();
+        this.$node.html(unreadCountTitleHTML);
+      };
+
+      this.after('initialize', function () {
+        this.render();
+      });
+
+    });
+});
diff --git a/web-ui/app/js/views/templates.js b/web-ui/app/js/views/templates.js
index e3b8d1f2..99bffae9 100644
--- a/web-ui/app/js/views/templates.js
+++ b/web-ui/app/js/views/templates.js
@@ -62,6 +62,7 @@ define(['hbs/templates'], function (templates) {
       userSettingsBox: window.Pixelated['app/templates/page/user_settings_box.hbs'],
       logout: window.Pixelated['app/templates/page/logout.hbs'],
       logoutShortcut: window.Pixelated['app/templates/page/logout_shortcut.hbs'],
+      unreadCountTitle: window.Pixelated['app/templates/page/unread_count_title.hbs'],
       version: window.Pixelated['app/templates/page/version.hbs']
     },
     feedback: {
diff --git a/web-ui/app/templates/page/unread_count_title.hbs b/web-ui/app/templates/page/unread_count_title.hbs
new file mode 100644
index 00000000..1ae379b6
--- /dev/null
+++ b/web-ui/app/templates/page/unread_count_title.hbs
@@ -0,0 +1 @@
+<span>(1)</span>
diff --git a/web-ui/test/spec/page/unread_count_title.spec.js b/web-ui/test/spec/page/unread_count_title.spec.js
new file mode 100644
index 00000000..ce49c48b
--- /dev/null
+++ b/web-ui/test/spec/page/unread_count_title.spec.js
@@ -0,0 +1,21 @@
+
+describeComponent('page/unread_count_title', function () {
+  'use strict';
+  describe('title bar', function () {
+    beforeEach(function () {
+      this.setupComponent('<span></span>');
+    });
+
+    it('should render template', function () {
+      expect(this.$node).toExist();
+      expect(this.$node.html()).toEqual('<span>(1)</span>');
+    });
+    
+    it('should update count on mail read event', function () {
+      this.component.trigger(Pixelated.events.mails.read);
+        $(document).trigger(Pixelated.events.mail.read, { tags: ['someothertag'], mailbox: 'inbox' });
+      expect(this.$node.html()).toEqual('<span>(1)</span>');
+    });
+
+  });
+});