Global shortcut

reycn · Jun 29, 2019 · 035ad4e · 035ad4e
1 parent c668e7f
commit 035ad4e
Show file tree

Hide file tree

Showing 6 changed files with 327 additions and 259 deletions.
diff --git a/app/floatingWindow.html b/app/floatingWindow.html
@@ -1,58 +1,67 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
-  <meta charset="UTF-8">
-  <link href="listen1_chrome_extension/css/icon.css" rel="stylesheet">
-  <title>Listen1</title>
-  <style>
-    div.content {
-      cursor: move;
-      border-radius: 5px;
-      background: rgba(36, 36, 36, 0.5);
-      height: 60px;
-      box-sizing: border-box;
-      overflow: hidden;
-      -webkit-app-region: drag;
-      text-align: center;
-      font-size: 24px;
-      color: white;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      user-select: none;
-      transition: background ease-in-out 0.2s;
-    }
-    .title-bar {
-      /*display: none;*/
-      font-weight: bolder;
-      padding: 10px;
-      position: absolute;
-      color: white;
-      cursor: pointer;
-      z-index: 999;
-    }
-    body:hover .title-bar {
-      display: block;
-    }
-    body:hover .content {
-      background: rgba(36, 36, 36, 0.6);
-    }
-    body {
-      font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Microsoft Yahei", "Helvetica","Arial",sans-serif;
-      overflow: hidden;
-    }
-  </style>
+    <meta charset="UTF-8" />
+    <link href="listen1_chrome_extension/css/icon.css" rel="stylesheet" />
+    <title>Listen1</title>
+    <style>
+        div.content {
+            cursor: move;
+            /* border-radius: 5px; */
+            /* background: rgba(36, 36, 36, 0.5); */
+            height: 40px;
+            box-sizing: border-box;
+            overflow: hidden;
+            -webkit-app-region: drag;
+            text-align: center;
+            font-size: 24px;
+            color: white;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            user-select: none;
+            transition: background ease-in-out 0.2s;
+        }
+
+        .title-bar {
+            /*display: none;*/
+            font-weight: bolder;
+            padding: 10px;
+            position: absolute;
+            color: white;
+            cursor: pointer;
+            z-index: 999;
+        }
+
+        body:hover .title-bar {
+            display: block;
+        }
+
+        body:hover .content {
+            background: rgba(36, 36, 36, 0.6);
+        }
+
+        body {
+            font-family: "SF Pro Text", "SF Pro Icons", "Helvetica Neue", "Microsoft Yahei", "Helvetica", "Arial", sans-serif;
+            overflow: hidden;
+        }
+    </style>
 </head>
+
 <body>
-<div id="currentLyric" class="content">
-  Listen1
-</div>
-<script>
-  const { ipcRenderer } = require('electron')
-  currentLyric = document.getElementById('currentLyric')
-  ipcRenderer.on('currentLyric', function (event, arg){
-    currentLyric.innerHTML = arg;
-  });
-</script>
+    <div id="currentLyric" class="content">
+        Listen1
+    </div>
+    <script>
+        const {
+            ipcRenderer
+        } = require("electron");
+        currentLyric = document.getElementById("currentLyric");
+        ipcRenderer.on("currentLyric", function(event, arg) {
+            currentLyric.innerHTML = arg;
+        });
+    </script>
 </body>
-</html>
+
+</html>
diff --git a/app/listen1_chrome_extension/i18n/en_US.json b/app/listen1_chrome_extension/i18n/en_US.json
@@ -59,7 +59,7 @@
     "_CANCEL_CONNECT": "Cancel Connect",
     "_SHORTCUTS": "Shortcuts",
     "_VIEW_SHORTCUTS_LIST": "View Shortcuts List",
-    "_GLOBAL_SHORTCUTS_NOTICE": "Enable Global Shortcuts: Ctrl(Cmd) + Alt + Left Arrow (Previous Track)，Ctrl(Cmd) + Alt + Right Arrow (Next Track)",
+    "_GLOBAL_SHORTCUTS_NOTICE": "Enable Global Shortcuts: Ctrl + Alt + ← (Previous Track)，Ctrl + Alt + → (Nect Track)，Ctrl + Alt + Space (Play/Pause)",
     "_LYRIC_DISPLAY": "Lyric Display",
     "_SHOW_DESKTOP_LYRIC": "Show desktop lyric",
     "_CONNECT_TO_LASTFM": "Connect to Last.fm",

diff --git a/app/listen1_chrome_extension/i18n/zh_CN.json b/app/listen1_chrome_extension/i18n/zh_CN.json
@@ -59,7 +59,7 @@
     "_CANCEL_CONNECT": "取消连接",
     "_SHORTCUTS": "快捷键",
     "_VIEW_SHORTCUTS_LIST": "查看快捷键列表",
-    "_GLOBAL_SHORTCUTS_NOTICE": "启用全局快捷键: Ctrl(Cmd) + Alt + 左箭头 (上一首)，Ctrl(Cmd) + Alt + 右箭头 (下一首)",
+    "_GLOBAL_SHORTCUTS_NOTICE": "启用全局快捷键: Ctrl + Alt + ← (上一首)，Ctrl + Alt + → (下一首)，Ctrl + Alt + Space (播放/暂停)",
     "_LYRIC_DISPLAY": "歌词显示",
     "_SHOW_DESKTOP_LYRIC": "显示桌面歌词",
     "_CONNECT_TO_LASTFM": "连接到last.fm",

diff --git a/app/listen1_chrome_extension/js/app.js b/app/listen1_chrome_extension/js/app.js
@@ -1259,6 +1259,14 @@ const main = () => {
                         angularPlayer.nextTrack();
                     } else if (message === 'left') {
                         angularPlayer.prevTrack();
+                    } else if (message === 'space') {
+                        if (angularPlayer.isPlayingStatus()) {
+                            // if playing then pause
+                            angularPlayer.pause();
+                        } else {
+                            // else play if not playing
+                            angularPlayer.play();
+                        }
                     }
                 });
             }

diff --git a/app/listen1_chrome_extension/listen1.html b/app/listen1_chrome_extension/listen1.html
@@ -281,13 +281,14 @@ <h2> {{ backup.id }} {{backup.description}}</h2>
                                                     <button class="language-button" ng-click="setLang('zh_CN')">简体中文</button>
                                                     <button class="language-button" ng-click="setLang('en_US')">English</button>
                                                 </div>
-                                            </div><div class="settings-title"><span>{{_ACRYLIC}}<span></div>
-                                            <div class="settings-content">
-                                                <div>
-                                                    <button class="acrylic-button" ng-click="setAcry()">开启</button>
-                                                    <button class="acrylic-button" ng-click="setAcry()">关闭</button>
-                                                </div>
                                             </div>
+                                            <!-- <div class="settings-title"><span>{{_ACRYLIC}}<span></div> -->
+                                            <!-- <div class="settings-content"> -->
+                                                <!-- <div> -->
+                                                    <!-- <button class="acrylic-button" ng-click="setAcry()">开启</button> -->
+                                                    <!-- <button class="acrylic-button" ng-click="setAcry()">关闭</button> -->
+                                                <!-- </div> -->
+                                            <!-- </div> -->
                           <div class="settings-title"><span>{{_BACKUP_PLAYLIST}}<span></div>
                           <div class="settings-content">
                             <p>{{_BACKUP_WARNING}}</p>