feat: add global shortcut setting (#470)

* feat: add global short cut setting

* fix: fix settings not work

* fix: call initIpcMan after createWindow

* fix: fix build error (typo)

src/background.js

@@ -50,9 +50,6 @@ class Background {
     // create Express app
     this.createExpressApp();
 
-    // init ipcMain
-    initIpcMain(this.window, this.store);
-
     // Scheme must be registered before the app is ready
     protocol.registerSchemesAsPrivileged([
       { scheme: "app", privileges: { secure: true, standard: true } },
@@ -226,6 +223,9 @@ class Background {
       this.createWindow();
       this.handleWindowEvents();
 
+      // init ipcMain
+      initIpcMain(this.window, this.store);
+
       // check for updates
       this.checkForUpdates();
 
@@ -244,7 +244,9 @@ class Background {
       this.window.setTouchBar(createTouchBar(this.window));
 
       // register global shortcuts
+      if (this.store.get("settings.enableGlobalShortcut")) {
         registerGlobalShortcut(this.window);
+      }
     });
 
     app.on("activate", () => {

src/electron/ipcMain.js

@@ -1,5 +1,7 @@
-import { app, ipcMain, dialog } from "electron";
+import { app, dialog, globalShortcut, ipcMain } from "electron";
 import match from "@njzy/unblockneteasemusic";
+import { registerGlobalShortcut } from "@/electron/globalShortcut";
+
 const client = require("discord-rich-presence")("818936529484906596");
 
 export function initIpcMain(win, store) {
@@ -61,6 +63,14 @@ export function initIpcMain(win, store) {
 
   ipcMain.on("settings", (event, options) => {
     store.set("settings", options);
+    const isRegisterShortcut = globalShortcut.isRegistered(
+      "Alt+CommandOrControl+P"
+    );
+    if (options.enableGlobalShortcut) {
+      !isRegisterShortcut && registerGlobalShortcut(win);
+    } else {
+      isRegisterShortcut && globalShortcut.unregisterAll();
+    }
   });
 
   ipcMain.on("playDiscordPresence", (event, track) => {

src/locale/lang/en.js

@@ -149,6 +149,7 @@ export default {
     showUnavailableSongInGreyStyle: "Show unavailable song in grey style",
     showPlaylistsByAppleMusic: "Show playlists by Apple Music",
     enableDiscordRichPresence: "Enable Discord Rich Presence",
+    enableGlobalShortcut: "Enable Global Shortcut",
   },
   contextMenu: {
     play: "Play",

src/locale/lang/zh-CN.js

@@ -150,6 +150,7 @@ export default {
     showUnavailableSongInGreyStyle: "显示不可播放的歌曲为灰色",
     showPlaylistsByAppleMusic: "首页显示来自 Apple Music 的歌单",
     enableDiscordRichPresence: "启用 Discord Rich Presence",
+    enableGlobalShortcut: "启用全局快捷键",
   },
   contextMenu: {
     play: "播放",

src/store/initLocalStorage.js

@@ -17,6 +17,7 @@ let localStorage = {
     showLyricsDynamicBackground: false,
     minimizeToTray: false,
     enableDiscordRichPresence: false,
+    enableGlobalShortcut: true,
   },
   data: {
     user: {},

src/store/plugins/sendSettings.js

@@ -7,6 +7,7 @@ export function getSendSettingsPlugin() {
       if (mutation.type !== "updateSettings") return;
       ipcRenderer.send("settings", {
         minimizeToTray: state.settings.minimizeToTray,
+        enableGlobalShortcut: state.settings.enableGlobalShortcut,
       });
     });
   };

src/views/settings.vue

@@ -271,6 +271,22 @@
           </div>
         </div>
       </div>
+      <div class="item" v-if="isElectron">
+        <div class="left">
+          <div class="title"> {{ $t("settings.enableGlobalShortcut") }}</div>
+        </div>
+        <div class="right">
+          <div class="toggle">
+            <input
+              type="checkbox"
+              name="enable-enable-global-shortcut"
+              id="enable-enable-global-shortcut"
+              v-model="enableGlobalShortcut"
+            />
+            <label for="enable-enable-global-shortcut"></label>
+          </div>
+        </div>
+      </div>
       <div class="item">
         <div class="left">
           <div class="title" style="transform: scaleX(-1)">🐈️ 🏳️‍🌈</div>
@@ -491,10 +507,21 @@ export default {
         });
       },
     },
+    enableGlobalShortcut: {
+      get() {
+        return this.settings.enableGlobalShortcut;
+      },
+      set(value) {
+        this.$store.commit("updateSettings", {
+          key: "enableGlobalShortcut",
+          value,
+        });
+      },
       isLastfmConnected() {
         return this.lastfm.key !== undefined;
       },
     },
+  },
   methods: {
     getAllOutputDevices() {
       navigator.mediaDevices.enumerateDevices().then((devices) => {