hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

- switching dark/light icon depending on os-x theme settings

Browse Source 
- optimization: don't re-create tray icon on menu udpates (avoid blinking)

Signed-off-by: Roman <ixrock@gmail.com>
This commit is contained in:
Roman 2020-10-07 13:18:39 +03:00
parent ec50c411a4
commit 43ea13cfc3
2 changed files with 36 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/main/tray.ts
View File

@ -2,7 +2,7 @@ import path from "path"
import sharp from "sharp";
import jsdom from "jsdom"
import packageInfo from "../../package.json"
import { dialog, Menu, nativeImage, nativeTheme, Tray } from "electron"
import { dialog, Menu, NativeImage, nativeImage, nativeTheme, Tray } from "electron"
import { isDevelopment, isMac } from "../common/vars";
import { autorun } from "mobx";
import { showAbout } from "./menu";
@ -16,44 +16,62 @@ import logger from "./logger";
// note: instance of Tray should be saved somewhere, otherwise it disappears
export let tray: Tray;
export let trayIcon: NativeImage;
export const trayIcon = isDevelopment
export const trayIconPath = isDevelopment
? path.resolve(__static, "../src/renderer/components/icon/logo-lens.svg")
: path.resolve(__static, "logo.svg") // electron-builder's extraResources
export function initTray(windowManager: WindowManager) {
// update icon when MacOS dark/light theme has changed
nativeTheme.on("updated", async () => {
if (tray) {
trayIcon = await createTrayIconFromSvg();
tray.setImage(trayIcon);
}
});
export async function initTray(windowManager: WindowManager) {
if (!trayIcon) {
trayIcon = await createTrayIconFromSvg();
}
const dispose = autorun(() => {
const menu = createTrayMenu(windowManager);
buildTray(menu);
buildTray(trayIcon, menu);
})
return () => {
tray?.destroy();
dispose();
tray?.destroy();
tray = null;
}
}
export async function buildTray(menu: Menu) {
logger.info("[TRAY]: build start");
export async function createTrayIconFromSvg(filePath = trayIconPath): Promise<NativeImage> {
// modify icon's svg
const svgDom = await jsdom.JSDOM.fromFile(trayIcon);
const svgDom = await jsdom.JSDOM.fromFile(filePath);
const svgRoot = svgDom.window.document.body.getElementsByTagName("svg")[0];
const trayIconColor = nativeTheme.themeSource == "dark" ? "white" : "#333"; // fixme: nativeTheme.themeSource always == "system" (MacOS)
const trayIconColor = nativeTheme.shouldUseDarkColors ? "white" : "black";
svgRoot.innerHTML += `<style>* {fill: ${trayIconColor} !important;}</style>`
const svgIconBuffer = Buffer.from(svgRoot.outerHTML);
// convert to .png or .icon for system tray and resize
// convert to .png or .ico and resize
const pngIcon = await sharp(svgIconBuffer).png().toBuffer();
const iconSize = isMac ? 16 : 32; // todo: verify on windows/linux
const icon = nativeImage.createFromBuffer(pngIcon).resize({
return nativeImage.createFromBuffer(pngIcon).resize({
width: iconSize,
height: iconSize
});
}
tray?.destroy(); // remove previous tray first
tray = new Tray(icon)
tray.setToolTip(packageInfo.description)
tray.setIgnoreDoubleClickEvents(true);
export async function buildTray(icon: NativeImage, menu: Menu) {
logger.info("[TRAY]: build start");
if (!tray) {
tray = new Tray(icon)
tray.setToolTip(packageInfo.description)
tray.setIgnoreDoubleClickEvents(true);
}
tray.setImage(icon);
tray.setContextMenu(menu);
return tray;

4
src/main/window-manager.ts
View File

@ -56,9 +56,9 @@ export class WindowManager {
protected async initMenus() {
this.disposers.menuAutoUpdater = initMenu(this);
this.disposers.trayAutoBind = reaction(() => userStore.preferences.trayEnabled, isEnabled => {
this.disposers.trayAutoBind = reaction(() => userStore.preferences.trayEnabled, async isEnabled => {
if (isEnabled) {
this.disposers.trayAutoUpdater = initTray(this);
this.disposers.trayAutoUpdater = await initTray(this);
} else {
this.disposers?.trayAutoUpdater();
}