优化ktv模式;优化音乐扫描;

src/css/app.scss

@@ -209,6 +209,10 @@
         &:hover {opacity:1;transform:translateX(0)}
       }
 
+      .slide-down {position:absolute;right:1rem;top:1rem;width:3rem;height:2rem;line-height:1.8rem;border:.1rem solid nth($cgr, 1);border-radius:.3rem;text-align:center;
+        i {transform:rotate(90deg)}
+      }
+
 
       .search-box {display:flex;justify-content:center;align-items:center;position:absolute;left:0;top:0;z-index:82;width:100%;height:56rem;background:rgba(29, 35, 44, 0.5);backdrop-filter:blur(.4rem);
       

src/css/common.scss

@@ -39,7 +39,7 @@ table {overflow:auto;display:table;width:100%;line-height:2.5rem;
   thead tr {height:4.5rem;border-bottom:.1rem solid rgba(200, 200, 200, .15)}
   thead th {padding:1rem .8rem;border:0;}
   tbody tr {height:auto;@include ts(background, .3s);
-    &:hover {background:rgba(63, 194, 168, .08);}
+    &:hover {background:rgba(29, 35, 44, .08);}
   }
   tbody td {padding:.9rem .8rem}
 }

src/css/modules.scss

@@ -87,11 +87,8 @@
 
     .stat {width:2.6rem;height:2.6rem;line-height:2.6rem;}
     .ac {text-align:center}
-
-    .active {color:nth($ct, 1);background:rgba(255, 255, 255, 0.6);;
-      
-      i {animation: play 2s infinite linear;}
-    }
+    .idx {color:nth($cp, 3);text-shadow:0 .1rem 0 rgba(255, 255, 255, 0.6)}
+    .active {color:nth($ct, 1);background:rgba(255, 255, 255, 0.6);font-weight:bold}
   }
 
 
@@ -108,7 +105,10 @@
         }
 
         .label {flex:0 5rem;padding-right:2rem;color:nth($cgr, 1);text-align:right;}
-        .field {flex:1}
+        .field {flex:1;
+          
+          &.path {border:0;font-size:1.3rem;color:nth($cd, 2)}
+        }
       }
     
     }

src/js/api.js

@@ -106,13 +106,15 @@ export default {
       })
   },
 
-  search(keyword) {
+  search(keyword, page = 1, pagesize = 20) {
     return request
       .get('https://songsearch.kugou.com/song_search_v2')
       .send({
         keyword,
         platform: 'WebFilter',
-        tag: ''
+        tag: '',
+        page,
+        pagesize
       })
       .then(res => {
         if (res.status === 200) {

src/js/app.js

@@ -27,10 +27,8 @@ const path = require('path')
 
 const { remote, ipcRenderer } = require('electron')
 
-const { createDesktopLrcWindow, createMiniWindow } = remote.app.windows
-
 const WIN = remote.getCurrentWindow()
-const MAIN_SCREEN = remote.screen.getPrimaryDisplay()
+const { __LRC__, __MINI__ } = remote.app
 
 const PLAY_MODE = {
   0: 'all',
@@ -49,20 +47,13 @@ let appInit = ipcRenderer.sendSync('get-init')
 
 Anot.ss('app-init', appInit)
 
-const LRC_WIN = createDesktopLrcWindow(MAIN_SCREEN)
-const MINI_WIN = createMiniWindow(MAIN_SCREEN, WIN)
-
-// WIN.on('show', _ => {
-//   MINI_WIN.hide()
-// })
-
 Anot({
   $id: 'app',
   state: {
     theme: appInit.theme || 1, // 1:macos, 2: deepin
     winFocus: false,
-    mod: 'local',
-    searchTxt: '',
+    mod: 'search',
+    searchTxt: '安羽苏',
     playMode: Anot.ls('play-mode') >>> 0, // 0:all | 1:single |  2:random
     ktvMode: 0,
     isPlaying: false,
@@ -167,7 +158,7 @@ Anot({
     // ktv模式的歌词
     LYRICS.on('ktv-lrc', lrc => {
       this.lrc = lrc
-      LRC_WIN.emit('ktv-lrc', lrc)
+      __LRC__.emit('ktv-lrc', lrc)
     })
 
     // ktv模式的歌词
@@ -212,7 +203,7 @@ Anot({
 
     // 迷你模式开启时, 不响应托盘和dock栏的点击事件
     ipcRenderer.on('dock-click', () => {
-      if (!MINI_WIN.isVisible()) {
+      if (!__MINI__.isVisible()) {
         WIN.show()
       }
     })
@@ -235,12 +226,12 @@ Anot({
     change2mini() {
       this.optBoxShow = false
       WIN.hide()
-      MINI_WIN.show()
+      __MINI__.show()
       let song = this.curr.$model
       if (!this.isPlaying) {
         delete song.id
       }
-      MINI_WIN.emit('mini-init', song)
+      __MINI__.emit('mini-init', song)
     },
 
     activeModule(mod) {
@@ -266,10 +257,10 @@ Anot({
       this.optBoxShow = !this.optBoxShow
     },
     toggleDesktopLrc() {
-      if (LRC_WIN.isVisible()) {
-        LRC_WIN.hide()
+      if (__LRC__.isVisible()) {
+        __LRC__.hide()
       } else {
-        LRC_WIN.showInactive()
+        __LRC__.showInactive()
       }
     },
     toggleModule(mod) {
@@ -277,14 +268,16 @@ Anot({
         return
       }
       this.optBoxShow = false
+      this.__last__ = this.mod
       this.mod = mod
     },
     // 设置保存 回调
     onProfileSaved() {
-      this.toggleModule('local')
+      this.toggleModule(this.__last__)
       appInit = JSON.parse(Anot.ss('app-init'))
     },
 
+    //  切换循环模式
     togglePlayMode() {
       let mod = this.playMode
       mod++
@@ -312,13 +305,25 @@ Anot({
 
     searchMusic(ev) {
       if (ev.keyCode === 13) {
-        if (this.searchTxt === ':debug:') {
+        let txt = this.searchTxt.trim()
+
+        if (!txt) {
+          return
+        }
+
+        if (txt === ':debug:') {
           log('-----  调试模式  -----')
           this.searchTxt = ''
           WIN.openDevTools()
-        } else {
-          layer.toast('搜索功能还未开放')
+          return
         }
+        if (this.mod !== 'search') {
+          this.toggleModule('search')
+        }
+
+        Search.search(txt)
+        this.searchTxt = ''
+        // layer.toast('搜索功能还未开放')
       }
     },
 
@@ -364,7 +369,7 @@ Anot({
     updateCurr(obj) {
       let old = this.curr.$model
       this.curr = Object.assign(old, obj)
-      MINI_WIN.emit('mini-init', this.curr.$model)
+      __MINI__.emit('mini-init', this.curr.$model)
     },
 
     play(song) {

src/js/modules/ktv.js

@@ -35,6 +35,10 @@ export default {
     toggleLrcView() {
       this.allLrcView = !this.allLrcView
     },
+
+    closeKtvMode() {
+      this.ktvMode = 0
+    },
     showLrcSearch() {
       this.lrcForm.input = `${this.curr.artist} ${this.curr.title}`
       this.lrcSearchBoxShow = true
@@ -43,6 +47,7 @@ export default {
     closeLrcSearch() {
       this.lrcSearchBoxShow = false
     },
+
     searchLrc(e) {
       if (e.keyCode === 13) {
         let { input, __input__ } = this.lrcForm

src/js/modules/local.js

@@ -127,6 +127,8 @@ export default Anot({
         el.textContent = '重新扫描'
         el = null
 
+        LS.clear(true)
+        LS.insert(this.__tmp__)
         LS.sort('artist', true)
         dbCache = LS.getAll()
         this.list.clear()
@@ -142,7 +144,9 @@ export default Anot({
 
         this.__APP__.loading = false
         this.__APP__.progress = 0
+
         delete this.__NEW_NUM__
+        delete this.__tmp__
         return
       }
 
@@ -152,12 +156,14 @@ export default Anot({
         if (item) {
           item.path = `file://${song}`
           delete item.lyrics
-          LS.update(hash, item)
+          // 不直接修改数数据库的数据,避免文件被删除时,数据库中的记录还在
+          // 先存入临时数组, 最后再统一存入数据库
+          this.__tmp__.push(item)
           return this.__checkSong__(el)
         }
         this.__NEW_NUM__++
         ID3(song).then(tag => {
-          LS.insert({
+          this.__tmp__.push({
             id: hash,
             title: tag.title,
             album: tag.album,
@@ -176,6 +182,7 @@ export default Anot({
       if (appInit.musicPath) {
         this.__LIST__ = ipcRenderer.sendSync('scan-dir', appInit.musicPath)
         if (this.__LIST__) {
+          this.__tmp__ = [] //创建一个临时的数组, 用于存放扫描的音乐
           this.__APP__.loading = true
           this.__WAIT_FOR_SCAN__ = this.__LIST__.length
           this.__NEW_NUM__ = 0

src/js/modules/search.js

@@ -10,14 +10,61 @@ import Api from '/js/api.js'
 
 const log = console.log
 
+const dict = {}
+
 export default Anot({
   $id: 'search',
   state: {
-    filter: 'hot',
-    list: [] //歌手列表
+    curr: '',
+    history: [], // 搜索历史
+    list: [] // 搜索结果列表
   },
   methods: {
     __init__() {},
-    play() {}
+    play(it, idx) {
+      // SONIST.clear()
+      log(it.hash, it.albumId)
+      Api.getSongInfoByHash(it.hash, it.albumId).then(json => {
+        log(json)
+      })
+    },
+    delThis(it, ev) {
+      this.history.remove(it)
+      delete dict[it.key]
+    },
+    toggleHistory(it) {
+      this.curr = it.key
+      this.list.clear()
+      this.list.pushArray(dict[it.key])
+    },
+    search(txt) {
+      if (txt === this.last) {
+        return
+      }
+
+      let load = layer.load(1)
+      this.list.clear()
+
+      let key = Buffer.from(txt).toString('base64')
+
+      this.history.push({ txt, key })
+
+      this.curr = key
+
+      Api.search(txt, 1, 50).then(list => {
+        dict[key] = list.map(it => {
+          return {
+            title: it.SongName,
+            artist: it.SingerName,
+            album: it.AlbumName,
+            albumId: it.AlbumID,
+            duration: it.Duration,
+            hash: it.FileHash
+          }
+        })
+        layer.close(load)
+        this.list.pushArray(dict[key])
+      })
+    }
   }
 })

src/main.js

@@ -5,7 +5,9 @@
  */
 
 'use strict'
-const { app, BrowserWindow, session, protocol } = require('electron')
+
+const electron = require('electron')
+const { app, BrowserWindow, session, protocol } = electron
 const path = require('path')
 const fs = require('iofs')
 const { exec } = require('child_process')
@@ -32,7 +34,6 @@ const {
   createMiniWindow
 } = require('./tools/windows')
 
-app.windows = { createDesktopLrcWindow, createMiniWindow }
 const ROOT = __dirname
 
 /* ----------------------------------------------------- */
@@ -60,10 +61,16 @@ app.once('ready', () => {
   // 判断依赖
   exec('which ffprobe', (err, res) => {
     if (res) {
+      let sp = electron.screen.getPrimaryDisplay()
       let win = createMainWindow(path.resolve(ROOT, './images/app.png'))
+
       createTray(win)
       createMenu(win)
+
       app.__MAIN__ = win
+      app.__LRC__ = createDesktopLrcWindow(sp)
+      app.__MINI__ = createMiniWindow(sp)
+
       // mac专属事件,点击dock栏图标,可激活窗口
       app.on('activate', _ => {
         if (win) {

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
@@ -109,7 +109,6 @@ exports.createMiniWindow = function(screen) {
     }
   })
 
-  // win.loadURL('http://127.0.0.1:10240/mini-win.html')
   win.loadURL('app://local/mini-win.html')
   return win
 }

src/views/ktv.htm

@@ -37,6 +37,10 @@
     </section>
   </div>
 
+  <span class="slide-down do-fn-nodrag" :click="closeKtvMode">
+    <i class="do-icon-right"></i>
+  </span>
+
 
   <div class="search-box" :if="lrcSearchBoxShow">
     <div class="content">

src/views/local.htm

@@ -20,7 +20,7 @@
           :for="it in list"
           :on-contextmenu="handleMenu(it, $index, $event)"
           :dblclick="play(it, $index)">
-          <td class="ac"><i class="stat s-icon-music"></i></td>
+          <td class="ac idx" :text="$index + 1 + '.'"></td>
           <td :text="it.title"></td>
           <td class="ac" :text="it.artist"></td>
           <td class="ac" :text="it.album"></td>
@@ -38,7 +38,7 @@
       </section>
 
       <section class="section">
-        <span class="field" :text="form.path"></span>
+        <input readonly class="field path" :attr-value="form.path" />
       </section>
 
       <section class="section">

src/views/search.htm

@@ -1,7 +1,12 @@
 <div class="do-mod-search" anot="search">
   <div class="tabbar">
-    <span class="item active">我的音乐</span>
-    <span class="item">汪苏泷 <i class="do-icon-close"></i></span>
+    <span 
+      class="item"
+      :class="{active: curr  === it.key}"
+      :click="toggleHistory(it)"
+      :for="it in history">
+      {{it.txt}} <i class="do-icon-close" :click="delThis(it, $event)"></i>
+    </span>
   </div>
 
   <div class="table">
@@ -19,7 +24,7 @@
         <tr
           :for="it in list"
           :dblclick="play(it, $index)">
-          <td><i class="s-icon-music"></i></td>
+          <td :text="$index + 1"></td>
           <td :text="it.title"></td>
           <td class="ac" :text="it.artist"></td>
           <td class="ac" :text="it.album"></td>