feat: default tray icon

src/tray.ts

@@ -1,76 +1,90 @@
 
+"use strict";
+
+import fs from 'fs'
+import path from 'path'
 import { Tray } from 'electron';
 const nativeImage = require('electron').nativeImage
 import {NativeImage} from 'electron'
-import path from 'path';
 import { backgroundMitt } from "@/composables/useEmitter";
 import { getIconState, setIconState } from "@/store";
 import { CONNECTION_STATUS } from '@/session';
-const fs = require('fs');
-import { config } from '@/config';
 
-let tray: Tray | null = null
+declare const __static: string;
+
+interface Icons {
+    [name: string]: NativeImage;
+}
+
+let tray: Tray | null = null;
+const TRAY_ICON_DIR = 'trayIcon';
+
+const ICON_NAMES = {
+    default: 'icon.png',
+    // TODO: need icons for different states
+    // TODO: need higher density icons @3x, @4x, @5x
+    // TODO: need to test with 20x20 & 24x24 icon sizes
+    recording: 'recording.png',
+    playback: 'playback.png',
+    connected: 'connected.png',
+    nominal: 'nominal.png',
+    reconnecting: 'reconnecting.png',
+    lost: 'lost.png',
+}
 
 const TRAY_STATUS = {
     playback: 'playback',
     recording: 'recording',
     ...CONNECTION_STATUS
-}
+};
 
-const defaultIconPath = path.relative('src/main.ts', 'src/images/testTemplate.png');
 
-console.log(path.join(__dirname, 'iconTemplate.png'))
+const ICONS: Icons = {
-
+    default: iconFactory(ICON_NAMES.default),
-const imageBuffer = fs.readFileSync('test.png');
+    [TRAY_STATUS.recording]: iconFactory(ICON_NAMES.recording),
-const icon = nativeImage.createFromBuffer(imageBuffer);
+    [TRAY_STATUS.playback]: iconFactory(ICON_NAMES.playback),
+    [TRAY_STATUS.connected]: iconFactory(ICON_NAMES.connected),
+    [TRAY_STATUS.nominal]: iconFactory(ICON_NAMES.nominal),
+    [TRAY_STATUS.reconnecting]: iconFactory(ICON_NAMES.reconnecting),
+    [TRAY_STATUS.lost]: iconFactory(ICON_NAMES.lost),
+};
 
 backgroundMitt.on('update-icon-status', (payload: string) => {
     updateTray(payload);
 });
 
-const initIcon = (path: string): NativeImage  => {
+const changeIcon = (icon: NativeImage): void => tray ? tray.setImage(icon): undefined;
-    const icon = nativeImage.createFromPath(path);
+
-    icon.resize({ width: 16, height: 16 });
+function iconFactory(iconName: string): NativeImage {
-    icon.setTemplateImage(true);
+    if (iconName !== 'icon.png') {
+        console.log('ERROR: Missing Icons: ', iconName);
+    }
+    // TODO: remove hard code, need icons for different states
+    let iconBuffer = fs.readFileSync(path.join(__static, TRAY_ICON_DIR,  'icon.png'));
+    const icon = nativeImage.createFromBuffer(iconBuffer);
     return icon;
 };
 
-const icons = {
+function updateTray(status: string): void {
-    default: initIcon(defaultIconPath),
-};
-
-const updateTray = (status: string) => {
     // read icon state
     const current = getIconState();
     if (current !== status) {
        setIconState(status);
-       if (tray) {
+       if (status in ICONS) {
-           switch(status) {
+           changeIcon(ICONS[status]);
-               case(TRAY_STATUS.recording):
+       } else {
-               break;
+           changeIcon(ICONS.default);
-               case(TRAY_STATUS.playback):
-               break;
-               case(TRAY_STATUS.nominal):
-               break;
-               case(TRAY_STATUS.lost):
-               break;
-               default:
-                   tray.setImage(icons.default);
-       }
        }
-    }
+    }
-}
+};
-
+
-console.log('app path', config.configPath)
+export function initTray(): void {
-export const initTray = () => {
+    if (!tray) {
-    try {
+        try {
-        // check config path for icons
+            tray = new Tray(ICONS.default);
-        // if no icons
+        } catch(e) {
-            // fetch
+            console.log('Error initilizing tray', e);
-        // load from userData path
+        }
-        tray = new Tray(icon);
-    } catch(e) {
-        console.log('Error initilizing tray', e);
     }
 }