Merge branch 'feature/osx-menu-icon' into dev

Close #45

src/browser/index.jsx

@@ -373,7 +373,7 @@ var showUnreadBadgeWindows = function(unreadCount, mentionCount) {
   const sendBadge = function(dataURL, description) {
     // window.setOverlayIcon() does't work with NativeImage across remote boundaries.
     // https://github.com/atom/electron/issues/4011
-    electron.ipcRenderer.send('win32-overlay', {
+    electron.ipcRenderer.send('update-unread', {
       overlayDataURL: dataURL,
       description: description,
       unreadCount: unreadCount,
@@ -400,6 +400,11 @@ var showUnreadBadgeOSX = function(unreadCount, mentionCount) {
   } else {
     remote.app.dock.setBadge('');
   }
+
+  electron.ipcRenderer.send('update-unread', {
+    unreadCount: unreadCount,
+    mentionCount: mentionCount
+  });
 }
 
 var showUnreadBadge = function(unreadCount, mentionCount) {

src/browser/settings.jsx

@@ -30,7 +30,8 @@ var SettingsPage = React.createClass({
     }
     return {
       teams: config.teams,
-      hideMenuBar: config.hideMenuBar
+      hideMenuBar: config.hideMenuBar,
+      showTrayIcon: config.showTrayIcon
     };
   },
   handleTeamsChange: function(teams) {
@@ -42,6 +43,7 @@ var SettingsPage = React.createClass({
     var config = {
       teams: this.state.teams,
       hideMenuBar: this.state.hideMenuBar,
+      showTrayIcon: this.state.showTrayIcon,
       version: settings.version
     };
     settings.writeFileSync(this.props.configFile, config);
@@ -60,6 +62,11 @@ var SettingsPage = React.createClass({
       hideMenuBar: this.refs.hideMenuBar.getChecked()
     });
   },
+  handleChangeShowTrayIcon: function() {
+    this.setState({
+      showTrayIcon: this.refs.showTrayIcon.getChecked()
+    });
+  },
   render: function() {
     var teams_row = (
     <Row>
@@ -74,6 +81,10 @@ var SettingsPage = React.createClass({
     if (process.platform === 'win32' || process.platform === 'linux') {
       options.push(<Input ref="hideMenuBar" type="checkbox" label="Hide Menu Bar (Press Alt to show Menu Bar)" checked={ this.state.hideMenuBar } onChange={ this.handleChangeHideMenuBar } />);
     }
+    if (process.platform === 'darwin') {
+      options.push(<Input ref="showTrayIcon" type="checkbox" label="Show Icon on Menu Bar (Need to restart the application)" checked={ this.state.showTrayIcon } onChange={ this.handleChangeShowTrayIcon }
+                   />);
+    }
     var options_row = (options.length > 0) ? (
       <Row>
         <Col md={ 12 }>

src/common/settings.js

@@ -23,6 +23,7 @@ var loadDefault = function(version) {
       return {
         teams: [],
         hideMenuBar: false,
+        showTrayIcon: false,
         version: 1
       };
   }

src/main.js

@@ -6,6 +6,7 @@ const BrowserWindow = electron.BrowserWindow; // Module to create native browser
 const Menu = electron.Menu;
 const Tray = electron.Tray;
 const ipc = electron.ipcMain;
+const nativeImage = electron.nativeImage;
 const fs = require('fs');
 const path = require('path');
 
@@ -48,8 +49,36 @@ catch (e) {
 // be closed automatically when the JavaScript object is garbage collected.
 var mainWindow = null;
 var trayIcon = null;
+const trayImages = function() {
+  switch (process.platform) {
+    case 'win32':
+      return {
+        normal: nativeImage.createFromPath(path.resolve(__dirname, 'resources/tray.png')),
+        unread: nativeImage.createFromPath(path.resolve(__dirname, 'resources/tray_unread.png')),
+        mention: nativeImage.createFromPath(path.resolve(__dirname, 'resources/tray_mention.png'))
+      };
+    case 'darwin':
+      return {
+        normal: nativeImage.createFromPath(path.resolve(__dirname, 'resources/osx/MenuIconTemplate.png')),
+        unread: nativeImage.createFromPath(path.resolve(__dirname, 'resources/osx/MenuIconUnreadTemplate.png')),
+        mention: nativeImage.createFromPath(path.resolve(__dirname, 'resources/osx/MenuIconMentionTemplate.png'))
+      };
+    default:
+      return {};
+  }
+}();
 var willAppQuit = false;
 
+function shouldShowTrayIcon() {
+  if (process.platform === 'win32') {
+    return true;
+  }
+  if (process.platform === 'darwin' && config.showTrayIcon === true) {
+    return true;
+  }
+  return false;
+}
+
 app.on('login', function(event, webContents, request, authInfo, callback) {
   event.preventDefault();
   var readlineSync = require('readline-sync');
@@ -125,9 +154,9 @@ app.on('certificate-error', function(event, webContents, url, error, certificate
 // This method will be called when Electron has finished
 // initialization and is ready to create browser windows.
 app.on('ready', function() {
-  if (process.platform === 'win32') {
-    // set up tray icon to show balloon
-    trayIcon = new Tray(path.resolve(__dirname, 'resources/tray.png'));
+  if (shouldShowTrayIcon()) {
+    // set up tray icon
+    trayIcon = new Tray(trayImages.normal);
     trayIcon.setToolTip(app.getName());
     var tray_menu = require('./main/menus/tray').createDefault();
     trayIcon.setContextMenu(tray_menu);
@@ -147,21 +176,21 @@ app.on('ready', function() {
 
     // Set overlay icon from dataURL
     // Set trayicon to show "dot"
-    ipc.on('win32-overlay', function(event, arg) {
-      const overlay = arg.overlayDataURL ? electron.nativeImage.createFromDataURL(arg.overlayDataURL) : null;
-      mainWindow.setOverlayIcon(overlay, arg.description);
+    ipc.on('update-unread', function(event, arg) {
+      if (process.platform === 'win32') {
+        const overlay = arg.overlayDataURL ? electron.nativeImage.createFromDataURL(arg.overlayDataURL) : null;
+        mainWindow.setOverlayIcon(overlay, arg.description);
+      }
 
-      var tray_image = null;
       if (arg.mentionCount > 0) {
-        tray_image = 'tray_mention.png';
+        trayIcon.setImage(trayImages.mention);
       }
       else if (arg.unreadCount > 0) {
-        tray_image = 'tray_unread.png';
+        trayIcon.setImage(trayImages.unread);
       }
       else {
-        tray_image = 'tray.png';
+        trayIcon.setImage(trayImages.normal);
       }
-      trayIcon.setImage(path.resolve(__dirname, 'resources', tray_image));
     });
   }