Add tray (#2325)

* copied tray from old thread

* added visibility changer to tray

electron.js

@@ -4,6 +4,7 @@ const {app, globalShortcut} = require('electron');
 const sqlInit = require('./src/services/sql_init');
 const appIconService = require('./src/services/app_icon');
 const windowService = require('./src/services/window');
+const tray = require('./src/services/tray');
 
 // Adds debug features like hotkeys for triggering dev tools and reload
 require('electron-debug')();
@@ -35,6 +36,8 @@ app.on('ready', async () => {
         await windowService.createSetupWindow();
     }
 
+    tray.createTray()
+
     await windowService.registerGlobalShortcuts();
 });
 

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "trilium",
-  "version": "0.48.4",
+  "version": "0.48.5",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -4623,7 +4623,8 @@
       "dev": true,
       "optional": true,
       "requires": {
-        "cli-truncate": "^1.1.0"
+        "cli-truncate": "^1.1.0",
+        "node-addon-api": "^1.6.3"
       }
     },
     "iconv-lite": {
@@ -5811,6 +5812,13 @@
         "semver": "^7.3.5"
       }
     },
+    "node-addon-api": {
+      "version": "1.7.2",
+      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-1.7.2.tgz",
+      "integrity": "sha512-ibPK3iA+vaY1eEjESkQkM0BbCqFOaZMiXRTtdB0u7b4djtY6JnsjvPdUHVMg6xQt3B8fpTTWHI9A+ADjM9frzg==",
+      "dev": true,
+      "optional": true
+    },
     "node-api-version": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/node-api-version/-/node-api-version-0.1.4.tgz",

src/services/tray.js

@@ -0,0 +1,106 @@
+const { Menu, Tray } = require('electron');
+const path = require('path');
+const windowService = require("./window.js");
+const {getMainWindow} = require("./window.js");
+
+const UPDATE_TRAY_EVENTS = [
+    'minimize', 'maximize', 'show', 'hide'
+]
+
+let tray = null;
+// `mainWindow.isVisible` doesn't work with `mainWindow.show` and `mainWindow.hide` - it returns `false` when the window
+// is minimized
+let isVisible = true;
+
+// Inspired by https://github.com/signalapp/Signal-Desktop/blob/dcb5bb672635c4b29a51adec8a5658e3834ec8fc/app/tray_icon.ts#L20
+const getIconSize = () => {
+    switch (process.platform) {
+        case 'darwin':
+            return 16;
+        case 'win32':
+            return 32;
+        default:
+            return 256;
+    }
+}
+const getIconPath = () => {
+    const iconSize = getIconSize();
+
+    return path.join(
+        __dirname,
+        "../..",
+        "images",
+        "app-icons",
+        "png",
+        `${iconSize}x${iconSize}.png`
+    )
+}
+const registerVisibilityListener = () => {
+    const mainWindow = windowService.getMainWindow();
+
+    // They need to be registered before the tray updater is registered
+    mainWindow.on('show', () => {
+        isVisible = true;
+    });
+    mainWindow.on('hide', () => {
+        isVisible = false;
+    });
+
+    UPDATE_TRAY_EVENTS.forEach(eventName => {
+        mainWindow.on(eventName, updateTrayMenu)
+    });
+}
+
+const updateTrayMenu = () => {
+    const mainWindow = windowService.getMainWindow();
+
+    const contextMenu = Menu.buildFromTemplate([
+        {
+            label: isVisible ? 'Hide' : 'Show',
+            type: 'normal',
+            click: () => {
+                if (isVisible) {
+                    mainWindow.hide();
+                } else {
+                    mainWindow.show();
+                }
+            }
+        },
+        {
+            type: 'separator'
+        },
+        {
+            label: 'Quit',
+            type: 'normal',
+            click: () => {
+                mainWindow.close();
+            }
+        },
+    ]);
+
+    tray?.setContextMenu(contextMenu);
+}
+const changeVisibility = () => {
+    const window = getMainWindow();
+
+    if (isVisible) {
+        window.hide();
+    } else {
+        window.show();
+        window.focus();
+    }
+}
+
+function createTray() {
+    tray = new Tray(getIconPath());
+    tray.setToolTip('Trilium Notes')
+    // Restore focus
+    tray.on('click', changeVisibility)
+    updateTrayMenu();
+
+    registerVisibilityListener();
+}
+
+module.exports = {
+    createTray
+}

src/services/window.js

@@ -165,9 +165,15 @@ async function registerGlobalShortcuts() {
     }
 }
 
+function getMainWindow() {
+    return mainWindow;
+}
+
+
 module.exports = {
     createMainWindow,
     createSetupWindow,
     closeSetupWindow,
-    registerGlobalShortcuts
+    registerGlobalShortcuts,
+    getMainWindow
 };