electron#nativeTheme JavaScript Examples

createWindow = () => {
  win = new BrowserWindow({
    width: 470,
    minWidth: 450,
    height: 850,
    minHeight: 450,
    title: 'linked',
    backgroundColor: '#161616',
    webPreferences: {
      devTools: process.env.NODE_ENV === 'development',
      nodeIntegration: true,
      contextIsolation: false,
      enableRemoteModule: true
    }
  })

  if (process.env.WEBPACK_DEV_SERVER_URL) {
    win.loadURL(process.env.WEBPACK_DEV_SERVER_URL)
    if (!process.env.IS_TEST) win.webContents.openDevTools()
  } else {
    const { createProtocol } = require('vue-cli-plugin-electron-builder/lib')
    createProtocol('app')
    win.loadURL('app://./index.html')
    nativeTheme.themeSource = global.storage.get('theme')
  }
  
  win.on('closed', () => { win = null })
}

// 隐藏主窗口，并创建托盘，绑定关闭事件
function setTray () {
  // const topMenu = Menu.buildFromTemplate({})
  // Menu.setApplicationMenu(topMenu)
  // 用一个 Tray 来表示一个图标,这个图标处于正在运行的系统的通知区
  // 通常被添加到一个 context menu 上.
  // 系统托盘右键菜单
  const trayMenuTemplate = [

    {
      // 系统托盘图标目录
      label: 'DevTools',
      click: () => {
        win.webContents.openDevTools()
      }
    },
    {
      // 系统托盘图标目录
      label: '退出',
      click: () => {
        log.info('force quit')
        forceClose = true
        quit()
      }
    }
  ]
  // 设置系统托盘图标
  const iconRootPath = path.join(__dirname, '../extra/icons/tray')
  let iconPath = path.join(iconRootPath, 'icon.png')
  const iconWhitePath = path.join(iconRootPath, 'icon-white.png')
  const iconBlackPath = path.join(iconRootPath, 'icon-black.png')
  if (isMac) {
    iconPath = nativeTheme.shouldUseDarkColors ? iconWhitePath : iconBlackPath
  }

  const trayIcon = nativeImage.createFromPath(iconPath)
  const appTray = new Tray(trayIcon)

  // 当桌面主题更新时
  if (isMac) {
    nativeTheme.on('updated', () => {
      console.log('i am changed')
      if (nativeTheme.shouldUseDarkColors) {
        console.log('i am dark.')
        tray.setImage(iconWhitePath)
      } else {
        console.log('i am light.')
        tray.setImage(iconBlackPath)
        // tray.setPressedImage(iconWhitePath)
      }
    })
  }

  // 图标的上下文菜单
  const contextMenu = Menu.buildFromTemplate(trayMenuTemplate)

  // 设置托盘悬浮提示
  appTray.setToolTip('DevSidecar-开发者边车辅助工具')
  // 单击托盘小图标显示应用
  appTray.on('click', () => {
    // 显示主程序
    showWin()
  })

  appTray.on('right-click', function (event, bounds) {
    setTimeout(function () {
      appTray.popUpContextMenu(contextMenu)
    }, 200)
  })

  return appTray
}

ipcMain.handle('TOGGLE_THEME', (event, mode) => {
  if (mode === 'light') {
    nativeTheme.themeSource = 'light'
  } else {
    nativeTheme.themeSource = 'dark'
  }
  return nativeTheme.shouldUseDarkColors
})

initListeners() {
    this.app.on('ready', () => {
      this.createTray();
      this.createWindow();
    });

    this.app.on('quit', () => {
      this.razerApplication.destroy();
    });

    nativeTheme.on('updated', () => {
      this.createTray();
    });

    powerMonitor.on('suspend', () => {
      if(this.razerApplication.stateManager.stateOnSuspend == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.suspend();
      });
    });
    powerMonitor.on('resume', () => {
      if(this.razerApplication.stateManager.stateOnResume == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.resume();
      });
    });
    powerMonitor.on('on-ac', () => {
      if(this.razerApplication.stateManager.stateOnAc == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.onAc();
      });
    });
    powerMonitor.on('on-battery', () => {
      if(this.razerApplication.stateManager.stateOnBattery == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.onBattery();
      });
    });
    powerMonitor.on('shutdown', () => {
      if(this.razerApplication.stateManager.stateOnShutdown == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.shutdown();
      });
    });
    powerMonitor.on('lock-screen', () => {
      if(this.razerApplication.stateManager.stateOnLockScreen == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.lockScreen();
      });
    });
    powerMonitor.on('unlock-screen', () => {
      if(this.razerApplication.stateManager.stateOnUnlockScreen == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.unlockScreen();
      });
    });
    powerMonitor.on('user-did-become-active', () => {
      if(this.razerApplication.stateManager.stateOnUserDidBecomeActive == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.userDidBecomeActive();
      });
    });
    powerMonitor.on('user-did-resign-active', () => {
      if(this.razerApplication.stateManager.stateOnUserDidResignActive == null) {
        return;
      }
      this.razerApplication.refresh(false).then(() => {
        return this.razerApplication.stateManager.userDidResignActive();
      });
    });

    // mouse dpi rpc listener
    ipcMain.on('request-set-dpi', (_, arg) => {
      const { device, dpi } = arg;
      const currentDevice = this.razerApplication.deviceManager.getByInternalId(device.internalId);
      currentDevice.setDPI(dpi);
      this.refreshTray();
    });

    // keyboard brightness rpc listener
    ipcMain.on('update-brightness', (_, arg) => {
      const { device, brightness } = arg;
      const currentDevice = this.razerApplication.deviceManager.getByInternalId(device.internalId);
      currentDevice.setBrightness(brightness);
      this.refreshTray();
    });

    // custom color rpc listener
    ipcMain.on('request-set-custom-color', (_, arg) => {
      const { device } = arg;
      const currentDevice = this.razerApplication.deviceManager.getByInternalId(device.internalId);
      currentDevice.setSettings(device.settings);
      this.refreshTray();
    });

    // custom cycle color rpc listener
    ipcMain.on('request-cycle-color', (_, arg) => {
      const { index, color } = arg;
      this.razerApplication.cycleAnimation.updateColor(index, color.rgb);
      this.refreshTray();
    });

    // mouse brightness
    ['Matrix','Logo', 'Scroll', 'Left', 'Right'].forEach(brightnessMouseIdentifier => {
      ipcMain.on('update-mouse-' + brightnessMouseIdentifier.toLowerCase() + '-brightness', (_, arg) => {
        const { device, brightness } = arg;
        const currentDevice = this.razerApplication.deviceManager.getByInternalId(device.internalId);
        currentDevice['setBrightness' + brightnessMouseIdentifier](brightness);
        this.refreshTray();
      });
    });

    // poll rate
    ipcMain.on('update-mouse-pollrate', (_, arg) => {
      const { device, pollRate } = arg;
      const currentDevice = this.razerApplication.deviceManager.getByInternalId(device.internalId);
      currentDevice.setPollRate(pollRate);
    });

    //state manager
    ipcMain.on('state-settings-add', async (event, stateName) => {
      event.returnValue = await this.razerApplication.stateManager.addState(stateName);
    });
    ipcMain.on('state-settings-remove', (event, stateName) => {
      this.razerApplication.stateManager.removeState(stateName);
    });
    ipcMain.on('state-settings-activate', (event, stateName) => {
      this.razerApplication.stateManager.activateState(stateName);
    });

    ipcMain.on('state-settings-start', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnStart = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-suspend', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnSuspend = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-resume', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnResume = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-ac', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnAc = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-battery', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnBattery = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-shutdown', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnShutdown = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-lockscreen', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnLockScreen = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-unlockscreen', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnUnlockScreen = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-userdidbecomeactive', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnUserDidBecomeActive = stateValue;
      this.razerApplication.stateManager.save();
    });
    ipcMain.on('state-settings-userdidresignactive', (event, stateValue) => {
      this.razerApplication.stateManager.stateOnUserDidResignActive = stateValue;
      this.razerApplication.stateManager.save();
    });
  }