Abstracted some window events

src/js/main.js

@@ -1,18 +1,14 @@
 import AudioHandler from './audio';
 import CryptoUtil from './crypto';
+import WindowHandler from './window';
 
 let fs = window.RequestFileSystem || window.webkitRequestFileSystem;
 
-window.favicon = new Favico({
-  animation:'pop',
-  type : 'rectangle'
-});
-
 $(function() {
   const audio = new AudioHandler();
   const cryptoUtil = new CryptoUtil();
+  const windowHandler = new WindowHandler();
 
-  let isActive = false;
   let newMessages = 0;
   let FADE_TIME = 150; // ms
   let TYPING_TIMER_LENGTH = 400; // ms
@@ -428,9 +424,8 @@ $(function() {
   // Whenever the server emits 'new message', update the chat body
   socket.on('new message', function (data) {
     // Don't show messages if no key
-    if (!isActive) {
-      newMessages++;
-      favicon.badge(newMessages);
+    if (!windowHandler.isActive) {
+      windowHandler.notifyFavicon();
       audio.play();
     }
 
@@ -505,16 +500,6 @@ $(function() {
 
   initChat();
 
-  window.onfocus = function () { 
-    isActive = true;
-    newMessages = 0;
-    favicon.reset();
-  }; 
-
-  window.onblur = function () { 
-    isActive = false;
-  };
-
   // Nav links
   $('a#settings-nav').click(function() {
     $('#settings-modal').modal('show');

src/js/window.js

@@ -0,0 +1,40 @@
+export default class WindowHandler {
+  constructor() {
+    this._isActive = false;
+
+    this.newMessages = 0;
+    this.favicon = new Favico({
+      animation:'pop',
+      type : 'rectangle'
+    });
+
+    this.bindEvents();
+  }
+
+  get isActive() {
+    return this._isActive;
+  }
+
+  set isActive(active) {
+    this._isActive = active;
+    return this;
+  }
+
+  notifyFavicon() {
+    this.newMessages++;
+    this.favicon.badge(this.newMessages);
+  }
+
+  bindEvents() {
+    window.onfocus = () => { 
+      this._isActive = true;
+      this.newMessages = 0;
+      this.favicon.reset();
+    }; 
+
+    window.onblur = () => { 
+      this._isActive = false;
+    };
+  }
+
+}