修复控制交互;

src/css/desktop-lrc.css

@@ -1 +1 @@
-body{background:transparent}body .lrc-box{position:absolute;left:0;top:0;display:flex;flex-flow:column wrap;width:100%;height:100%;padding:0 5rem;line-height:5rem;color:#fff;font-size:3rem}body .lrc-box section{flex:1;display:flex}body .lrc-box section.left{justify-content:flex-start}body .lrc-box section.right{justify-content:flex-end}body .lrc-box section span{-webkit-background-clip:text !important;background-clip:text !important;color:transparent}body .lrc-box section span.shadow{text-shadow:0 0 0.5rem rgba(0,0,0,0.5)}body .touch-bar{position:absolute;left:0;top:0;z-index:9;width:100%;height:2rem}body .quit,body .lock{visibility:hidden;position:absolute;right:1rem;top:.5rem;font-size:1.8rem;font-weight:bold}body .quit:hover,body .lock:hover{color:#ff5061}body .quit:active,body .lock:active{color:#ffb618}body .lock{right:4rem}body .lock.active{color:#3fc2a7}body:hover{background:rgba(29,35,44,0.2)}body:hover .quit,body:hover .lock{visibility:visible}
+body{background:transparent}body .lrc-box{position:absolute;left:0;top:0;display:flex;flex-flow:column wrap;width:100%;height:100%;padding:0 5rem;line-height:5rem;color:#fff;font-size:3rem}body .lrc-box section{flex:1;display:flex}body .lrc-box section.left{justify-content:flex-start}body .lrc-box section.right{justify-content:flex-end}body .lrc-box section span{-webkit-background-clip:text !important;background-clip:text !important;color:transparent}body .lrc-box section span.shadow{text-shadow:0 0 0.5rem rgba(0,0,0,0.5)}body .touch-bar{position:absolute;right:0;top:0;z-index:9;height:2rem}body .quit,body .lock{visibility:hidden;position:absolute;right:1rem;top:.5rem;font-size:1.8rem;font-weight:bold;text-shadow:0 0 .1rem #fff}body .quit:hover,body .lock:hover{color:#ff5061}body .quit:active,body .lock:active{color:#ffb618}body .lock{right:4rem}body .lock.active{color:#3fc2a7}body:hover{background:rgba(29,35,44,0.15)}body:hover .quit,body:hover .lock{visibility:visible}

src/css/desktop-lrc.scss

@@ -26,10 +26,10 @@ body {background:transparent;
   
   }
 
-  .touch-bar {position:absolute;left:0;top:0;z-index:9;width:100%;height:2rem;}
+  .touch-bar {position:absolute;right:0;top:0;z-index:9;height:2rem;}
 
   .quit,
-  .lock {visibility:hidden;position:absolute;right:1rem;top:.5rem;font-size:1.8rem;font-weight:bold;
+  .lock {visibility:hidden;position:absolute;right:1rem;top:.5rem;font-size:1.8rem;font-weight:bold;text-shadow:0 0 .1rem #fff;
     &:hover {color:nth($cr, 1)}
     &:active {color:nth($co, 1)}
   }
@@ -39,7 +39,7 @@ body {background:transparent;
   }
 
 
-  &:hover {background:rgba(29, 35, 44, 0.2);
+  &:hover {background:rgba(29, 35, 44, 0.15);
   
     .quit, .lock {visibility:visible;}
   }

src/css/mini-win.css

@@ -1 +1 @@
-.app{display:flex;width:100%;height:100%}.app .cover{overflow:hidden;flex:0 6rem}.app .cover img{width:100%}.app .ctrl{flex:1;padding:.8rem;line-height:2.2rem}.app .ctrl .title{font-weight:normal;font-size:1.2rem}.app .ctrl .btns{font-size:2.2rem}.app .ctrl .btns span:hover{color:#ffb618}.app .tools,.app .actions{display:flex;justify-content:center;align-items:center;position:absolute;right:.5rem;top:.5rem;line-height:2rem;font-size:1.6rem;text-align:center;color:#98acae}.app .tools span,.app .actions span{margin:0 .2rem}.app .tools span:hover,.app .actions span:hover{color:#3fc2a7}.app .tools span.close:hover,.app .actions span.close:hover{color:#ff5061}.app .tools span.active,.app .actions span.active{font-weight:bold}.app .actions{top:auto;bottom:.5rem}.app .actions span:nth-child(1){font-size:1.2rem}
+.app{display:flex;width:100%;height:100%}.app .cover{overflow:hidden;flex:0 6rem;box-shadow:0 0 0.1rem rgba(0,0,0,0.1)}.app .cover img{width:100%}.app .ctrl{flex:1;padding:.8rem;line-height:2.2rem}.app .ctrl .title{font-weight:normal;font-size:1.2rem}.app .ctrl .btns{font-size:2.2rem}.app .ctrl .btns span:hover{color:#ffb618}.app .tools,.app .actions{display:flex;justify-content:center;align-items:center;position:absolute;right:.5rem;top:.5rem;line-height:2rem;font-size:1.6rem;text-align:center;color:#98acae}.app .tools span,.app .actions span{margin:0 .2rem}.app .tools span:hover,.app .actions span:hover{color:#3fc2a7}.app .tools span.close:hover,.app .actions span.close:hover{color:#ff5061}.app .tools span.active,.app .actions span.active{font-weight:bold}.app .actions{top:auto;bottom:.5rem}.app .actions span:nth-child(1){font-size:1.2rem}

src/css/mini-win.scss

@@ -8,11 +8,10 @@
 
  @import "./var.scss";
 
-//  body {width:32rem;height:6rem;}
 
 .app {display:flex;width:100%;height:100%;
 
-  .cover {overflow:hidden;flex:0 6rem;
+  .cover {overflow:hidden;flex:0 6rem;box-shadow:0 0 .1rem rgba(0, 0, 0, .1);
     
     img {width:100%;}
   }

src/desktop-lrc.html

@@ -9,7 +9,7 @@
 <script>window.LIBS_BASE_URL = location.origin + '/lib';</script>
 <script type="module" src="js/desktop-lrc.js"></script>
 </head>
-<body class="do-fn-noselect" :class="{'do-fn-drag': isMac || !isLock}" anot="lrc">
+<body class="do-fn-noselect do-fn-drag" anot="lrc">
   <div class="lrc-box">
     <section class="left">
       <span class="shadow" :text="lrc.l.txt"></span>
@@ -29,7 +29,7 @@
 
 
   <div class="touch-bar do-fn-nodrag">
-    <a class="do-icon-lock lock" :class="{active: isLock}" :click="lock"></a>
+    <a class="do-icon-lock lock" :visible="isMac" :class="{active: isLock}" :click="lock"></a>
     <a class="do-icon-close quit" :click="quit"></a>
   </div>
 </body>

src/index.html

@@ -124,10 +124,10 @@
       <span class="item prev s-icon-prev" data-key="prev"></span>
       <span 
         class="item play"
-        data-key="prev"
+        data-key="play"
         :class="{'s-icon-play': !isPlaying, 's-icon-pause': isPlaying}">
       </span>
-      <span class="item next s-icon-next" data-key="prev"></span>
+      <span class="item next s-icon-next" data-key="next"></span>
     </div>
 
     <div class="stat-box">

src/js/app.js

@@ -52,7 +52,9 @@ Anot.ss('app-init', appInit)
 const LRC_WIN = createDesktopLrcWindow(MAIN_SCREEN)
 const MINI_WIN = createMiniWindow(MAIN_SCREEN, WIN)
 
-// LRC_WIN.showInactive()
+// WIN.on('show', _ => {
+//   MINI_WIN.hide()
+// })
 
 Anot({
   $id: 'app',
@@ -207,6 +209,13 @@ Anot({
           }
       }
     })
+
+    // 迷你模式开启时, 不响应托盘和dock栏的点击事件
+    ipcRenderer.on('dock-click', () => {
+      if (!MINI_WIN.isVisible()) {
+        WIN.show()
+      }
+    })
   },
   methods: {
     quit(force) {

src/js/desktop-lrc.js

@@ -25,10 +25,9 @@ Anot({
       l: { bg: '#fff', txt: '暂无歌词...' },
       r: { bg: '', txt: '' }
     },
-    isLock: JSON.parse(Anot.ss('lock'))
+    isLock: +Anot.ls('lock-lrc')
   },
   mounted() {
-    WIN.openDevTools()
     WIN.on('ktv-lrc', lrc => {
       this.lrc = lrc
     })
@@ -39,13 +38,9 @@ Anot({
       WIN.hide()
     },
     lock() {
-      this.isLock = !this.isLock
+      WIN.setMovable(!!this.isLock)
-      Anot.ss('lock', this.isLock)
+      this.isLock = this.isLock ^ 1
-      if (this.isMac) {
+      Anot.ls('lock-lrc', this.isLock)
-        WIN.setMovable(!this.isLock)
-      } else {
-        // location.reload()
-      }
     }
   }
 })

src/main.js

@@ -67,7 +67,7 @@ app.once('ready', () => {
       // mac专属事件,点击dock栏图标,可激活窗口
       app.on('activate', _ => {
         if (win) {
-          win.show()
+          win.webContents.send('dock-click')
         }
       })
     } else {

src/tools/tray.js

@@ -18,7 +18,7 @@ module.exports = function(win) {
     {
       label: '显示主窗口',
       click() {
-        win.show()
+        win.webContents.send('dock-click')
       }
     },
     { type: 'separator' },
@@ -27,7 +27,7 @@ module.exports = function(win) {
 
   if (process.platform === 'darwin') {
     tray.on('click', _ => {
-      win.show()
+      win.webContents.send('dock-click')
     })
     tray.on('right-click', _ => {
       tray.popUpContextMenu(menuList)

src/tools/windows.js

@@ -33,7 +33,7 @@ exports.createMainWindow = function(icon) {
 
   win.on('ready-to-show', _ => {
     win.show()
-    win.openDevTools()
+    // win.openDevTools()
   })
 
   return win
@@ -50,7 +50,10 @@ exports.createErrorWindow = function() {
     maximizable: false,
     minimizable: false,
     resizable: false,
-    titleBarStyle: 'hiddenInset'
+    titleBarStyle: 'hiddenInset',
+    webPreferences: {
+      devTools: false
+    }
   })
   win.setMenuBarVisibility(false)
   win.loadURL('app://local/depends.html')
@@ -76,7 +79,10 @@ exports.createDesktopLrcWindow = function(screen) {
     hasShadow: false,
     thickFrame: false,
     transparent: true,
-    show: false
+    show: false,
+    webPreferences: {
+      devTools: false
+    }
   })
 
   win.loadURL('app://local/desktop-lrc.html')
@@ -97,7 +103,10 @@ exports.createMiniWindow = function(screen) {
     x: screen.size.width - 320,
     y: 0,
     skipTaskbar: true,
-    show: false
+    show: false,
+    webPreferences: {
+      devTools: false
+    }
   })
 
   // win.loadURL('http://127.0.0.1:10240/mini-win.html')