Update tray assets and hide spinner when window is visible

40 files changed, 70 insertions, 18 deletions

diff --git a/app/app.js b/app/app.js
index 468deca4df..5ac598c1b3 100644
--- a/app/app.js
+++ b/app/app.js
@@ -44,18 +44,53 @@ if(recentLocation && recentLocation.pathname) {
 }
 
 // Tray icon
-const updateTrayIcon = () => {
-  const getIconType = (s) => {
-    switch(s) {
-    case ConnectionState.connected: return TrayIconType.secured;
-    case ConnectionState.connecting: return TrayIconType.securing;
-    default: return TrayIconType.unsecured;
+let isWindowVisible = false;
+
+/**
+ * Get tray icon type based on connection state
+ * @param    {ConnectionState} s - connection state
+ * @return   {Object}
+ * @property {TrayIconType} type    - icon type
+ * @property {bool} [skipAnimation] - skip animation?
+ * 
+ */
+const getChangeIconEventData = (s) => {
+  switch(s) {
+  case ConnectionState.connected: 
+    return { type: TrayIconType.secured };
+
+  case ConnectionState.connecting:
+    // do not display spinner if window is visible
+    if(isWindowVisible) {
+      return { type: TrayIconType.unsecured, skipAnimation: true };
+    } else {
+      return { type: TrayIconType.securing };
     }
-  };
+
+  default: return { type: TrayIconType.unsecured };
+  }
+};
+
+/**
+ * Update tray icon via IPC call
+ */
+const updateTrayIcon = () => {
   const { connect } = store.getState();
-  ipcRenderer.send('changeTrayIcon', getIconType(connect.status));
+  ipcRenderer.send('changeTrayIcon', getChangeIconEventData(connect.status));
 };
 
+ipcRenderer.on('showWindow', () => {
+  isWindowVisible = true;
+  updateTrayIcon();
+  console.log('showWindow');
+});
+
+ipcRenderer.on('hideWindow', () => {
+  isWindowVisible = false;
+  updateTrayIcon();
+  console.log('hideWindow');
+});
+
 // patch backend
 backend.syncWithReduxStore(store);
 
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-1-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-1-dark.png
index 8d15f22332..1723ee998c 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-1-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-1-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-1-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-1-dark@2x.png
index 6bb1ee1063..61b2e295c7 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-1-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-1-dark@2x.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-2-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-2-dark.png
index 12791d6b0e..9156a48bc8 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-2-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-2-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-2-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-2-dark@2x.png
index d9a8b0dc96..46bb16c23f 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-2-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-2-dark@2x.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-3-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-3-dark.png
index 28a733b1ea..d1e74a8e76 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-3-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-3-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-3-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-3-dark@2x.png
index 7a5268e31b..1877a14681 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-3-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-3-dark@2x.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-4-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-4-dark.png
index 1b02b4937c..7e12450935 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-4-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-4-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-4-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-4-dark@2x.png
index e1a35b5f29..53e3df70a0 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-4-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-4-dark@2x.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-5-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-5-dark.png
index 70f9487809..e75fb69bc2 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-5-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-5-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-5-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-5-dark@2x.png
index b9b81df97d..0ef78a8ece 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-5-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-5-dark@2x.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-6-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-6-dark.png
index 87589977bb..17e2c699cc 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-6-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-6-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-6-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-6-dark@2x.png
index b4f1e4fba7..e9c25388c6 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-6-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-6-dark@2x.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-7-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-7-dark.png
index e2f17f4d75..6b6c129018 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-7-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-7-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-7-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-7-dark@2x.png
index eddfde2fda..e4dae6ac15 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-7-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-7-dark@2x.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-8-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-8-dark.png
index ca2345a8df..31407842d2 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-8-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-8-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-8-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-8-dark@2x.png
index 3bb3d9be17..2dcb3a9293 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-8-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-8-dark@2x.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-9-dark.png b/app/assets/images/menubar icons/dark ui/lock/lock-9-dark.png
index 22f5f00315..3d0e7cbebe 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-9-dark.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-9-dark.png
diff --git a/app/assets/images/menubar icons/dark ui/lock/lock-9-dark@2x.png b/app/assets/images/menubar icons/dark ui/lock/lock-9-dark@2x.png
index 0f7cbed805..4c37a80b69 100644
--- a/app/assets/images/menubar icons/dark ui/lock/lock-9-dark@2x.png
+++ b/app/assets/images/menubar icons/dark ui/lock/lock-9-dark@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-1-light.png b/app/assets/images/menubar icons/light ui/lock/lock-1-light.png
index 807e84eafc..054bde16f7 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-1-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-1-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-1-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-1-light@2x.png
index 3813dc3eb0..566bc576b9 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-1-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-1-light@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-2-light.png b/app/assets/images/menubar icons/light ui/lock/lock-2-light.png
index 18c1740117..01dc73ea65 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-2-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-2-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-2-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-2-light@2x.png
index faba44afbc..78a0cb2d21 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-2-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-2-light@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-3-light.png b/app/assets/images/menubar icons/light ui/lock/lock-3-light.png
index f5246c5d98..c90a1b8eb6 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-3-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-3-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-3-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-3-light@2x.png
index ed852a018b..58a82c5c96 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-3-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-3-light@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-4-light.png b/app/assets/images/menubar icons/light ui/lock/lock-4-light.png
index 53cfe22523..7cd03273d7 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-4-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-4-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-4-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-4-light@2x.png
index c037c1ee0c..c57439377f 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-4-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-4-light@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-5-light.png b/app/assets/images/menubar icons/light ui/lock/lock-5-light.png
index ff2ae3b3cd..8b080a1f5d 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-5-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-5-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-5-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-5-light@2x.png
index cadfc27b89..ea4b209a04 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-5-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-5-light@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-6-light.png b/app/assets/images/menubar icons/light ui/lock/lock-6-light.png
index 59685cedac..c45d8fb4ac 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-6-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-6-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-6-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-6-light@2x.png
index ebcfdfaa12..b9adddac5f 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-6-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-6-light@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-7-light.png b/app/assets/images/menubar icons/light ui/lock/lock-7-light.png
index 32b84c2e36..009d2581df 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-7-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-7-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-7-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-7-light@2x.png
index a0ac784efc..d8e07a425d 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-7-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-7-light@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-8-light.png b/app/assets/images/menubar icons/light ui/lock/lock-8-light.png
index 4b1b8dbb85..8802dccb62 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-8-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-8-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-8-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-8-light@2x.png
index 692823ba45..b20caa2c5c 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-8-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-8-light@2x.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-9-light.png b/app/assets/images/menubar icons/light ui/lock/lock-9-light.png
index 544ece4528..8c89be3bba 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-9-light.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-9-light.png
diff --git a/app/assets/images/menubar icons/light ui/lock/lock-9-light@2x.png b/app/assets/images/menubar icons/light ui/lock/lock-9-light@2x.png
index d24247d5b9..d8b7b266a2 100644
--- a/app/assets/images/menubar icons/light ui/lock/lock-9-light@2x.png
+++ b/app/assets/images/menubar icons/light ui/lock/lock-9-light@2x.png
diff --git a/app/components/AccountInput.js b/app/components/AccountInput.js
index 7866a6c281..335a8db99b 100644
--- a/app/components/AccountInput.js
+++ b/app/components/AccountInput.js
@@ -104,7 +104,7 @@ export default class AccountInput extends Component {
    * 
    * @private
    * @param {String?} val  string
-   * @returns String
+   * @returns {String}
    * 
    * @memberOf AccountInput
    */
@@ -119,7 +119,7 @@ export default class AccountInput extends Component {
    * @param {String} val       original string 
    * @param {String} insert    insertion string
    * @param {Array}  selRange  selection range ([x,y])  
-   * @returns Object
+   * @returns {Object}
    * 
    * @memberOf AccountInput
    */
@@ -139,7 +139,7 @@ export default class AccountInput extends Component {
    * @private
    * @param {String} val       original string 
    * @param {Array}  selRange  selection range ([x,y])  
-   * @returns Object
+   * @returns {Object}
    * 
    * @memberOf AccountInput
    */
@@ -169,7 +169,7 @@ export default class AccountInput extends Component {
    * @private
    * @param {String} val      original string
    * @param {Array} domRange  selection range from DOM
-   * @returns Object
+   * @returns {Object}
    * 
    * @memberOf AccountInput
    */
@@ -197,7 +197,7 @@ export default class AccountInput extends Component {
    * @private
    * @param {String} val       original string
    * @param {Array}  selRange  selection range
-   * @returns Object
+   * @returns {Object}
    * 
    * @memberOf AccountInput
    */
diff --git a/app/lib/tray-icon-manager.js b/app/lib/tray-icon-manager.js
index 3e25c6cf85..e22ac231f2 100644
--- a/app/lib/tray-icon-manager.js
+++ b/app/lib/tray-icon-manager.js
@@ -53,6 +53,7 @@ export default class TrayIconManager {
 
   /**
    * Get current icon type
+   * @type {TrayIconType}
    * @memberOf TrayIconManager
    */
   get iconType() { 
@@ -61,16 +62,28 @@ export default class TrayIconManager {
 
   /**
    * Set current icon type
+   * @type {TrayIconType}
    * @memberOf TrayIconManager
    */
   set iconType(type) {
+    this.updateIconType(type, false);
+  }
+
+  /**
+   * Set current icon type with options
+   * 
+   * @param {TrayIconType} type          - new icon type
+   * @param {bool}         skipAnimation - pass true to skip animation to last frame. Has no effect on repeating animations.
+   * @returns 
+   * 
+   * @memberOf TrayIconManager
+   */
+  updateIconType(type, skipAnimation) {
     // no-op if same animator requested
     if(this._iconType === type) { return; }
 
     // do not animate if setting icon for the first time
-    const skipAnimation = this._iconType === null;
-
-    this._updateType(type, skipAnimation);
+    this._updateType(type, this._iconType === null || skipAnimation);
   }
 
   /**
diff --git a/app/main.js b/app/main.js
index 9d91621949..67a580bf08 100644
--- a/app/main.js
+++ b/app/main.js
@@ -32,10 +32,12 @@ const stopTrayEventMonitor = () => {
   }
 };
 
-ipcMain.on('changeTrayIcon', (event, type) => {
-  trayIconManager.iconType = type;
+ipcMain.on('changeTrayIcon', (event, data) => {
+  trayIconManager.updateIconType(data.type, data.skipAnimation);
 });
 
+ipcMain.emit();
+
 // hide dock icon
 if(process.platform === 'darwin') {
   app.dock.hide();
@@ -130,10 +132,12 @@ const createWindow = () => {
 
   window.on('show', () => {
     startTrayEventMonitor(window);
+    window.webContents.send('showWindow');
   });
 
   window.on('hide', () => {
     stopTrayEventMonitor();
+    window.webContents.send('hideWindow');
   });
 
 };