Set up Electron integration and builds

src/vector/index.js

@@ -28,7 +28,6 @@ require('gfm.css/gfm.css');
 require('highlight.js/styles/github.css');
 require('draft-js/dist/Draft.css');
 
-
  // add React and ReactPerf to the global namespace, to make them easier to
  // access via the console
 global.React = require("react");
@@ -49,6 +48,7 @@ import UAParser from 'ua-parser-js';
 import url from 'url';
 
 import {parseQs, parseQsFromFragment} from './url_utils';
+import IntegrationManager from './integration';
 
 var lastLocationHashSet = null;
 
@@ -201,6 +201,7 @@ function onLoadCompleted() {
 async function loadApp() {
     const fragparts = parseQsFromFragment(window.location);
     const params = parseQs(window.location);
+    const integrationManager = new IntegrationManager();
 
     // don't try to redirect to the native apps if we're
     // verifying a 3pid
@@ -254,6 +255,7 @@ async function loadApp() {
                 enableGuest={true}
                 onLoadCompleted={onLoadCompleted}
                 defaultDeviceDisplayName={getDefaultDeviceDisplayName()}
+                integrationManager={integrationManager}
             />,
             document.getElementById('matrixchat')
         );

src/vector/integration/BaseIntegrationManager.js

@@ -0,0 +1,16 @@
+// @flow
+
+export default class BaseIntegrationManager {
+    constructor() {
+        this.notificationCount = 0;
+        this.errorDidOccur = false;
+    }
+
+    setNotificationCount(count: number) {
+        this.notificationCount = count;
+    }
+
+    setErrorStatus(errorDidOccur: boolean) {
+        this.errorDidOccur = errorDidOccur;
+    }
+}

src/vector/integration/ElectronIntegrationManager.js

@@ -0,0 +1,16 @@
+// @flow
+import BaseIntegrationManager from './BaseIntegrationManager';
+
+// index.js imports us unconditionally, so we need this check here as well
+let electron = null, remote = null;
+if (window && window.process && window.process && window.process.type === 'renderer') {
+    electron = require('electron');
+    remote = electron.remote;
+}
+
+export default class ElectronIntegrationManager extends BaseIntegrationManager {
+    setNotificationCount(count: number) {
+        super.setNotificationCount(count);
+        remote.app.setBadgeCount(count);
+    }
+}

src/vector/integration/WebIntegrationManager.js

@@ -0,0 +1,42 @@
+// @flow
+import BaseIntegrationManager from './BaseIntegrationManager';
+import Favico from 'favico.js';
+
+export default class WebIntegrationManager extends BaseIntegrationManager {
+    constructor() {
+        super();
+        this.favicon = new Favico({animation: 'popFade'});
+        this.updateFavicon();
+    }
+
+    updateFavicon() {
+        try {
+            // This needs to be in in a try block as it will throw
+            // if there are more than 100 badge count changes in
+            // its internal queue
+            let bgColor = "#d00",
+                notif = this.notificationCount;
+
+            if (this.errorDidOccur) {
+                notif = notif || "×";
+                bgColor = "#f00";
+            }
+
+            this.favicon.badge(notif, {
+                bgColor: bgColor
+            });
+        } catch (e) {
+            console.warn(`Failed to set badge count: ${e.message}`);
+        }
+    }
+
+    setNotificationCount(count: number) {
+        super.setNotificationCount(count);
+        this.updateFavicon();
+    }
+
+    setErrorStatus(errorDidOccur: boolean) {
+        super.setErrorStatus(errorDidOccur);
+        this.updateFavicon();
+    }
+}

src/vector/integration/index.js

@@ -0,0 +1,15 @@
+// @flow
+
+import ElectronIntegrationManager from './ElectronIntegrationManager';
+import WebIntegrationManager from './WebIntegrationManager';
+
+let IntegrationManager = null;
+
+if (window && window.process && window.process && window.process.type === 'renderer') {
+    // we're running inside electron
+    IntegrationManager = ElectronIntegrationManager;
+} else {
+    IntegrationManager = WebIntegrationManager;
+}
+
+export default IntegrationManager;