新增桌面歌词

This commit is contained in:
lyswhut
2020-06-11 21:16:59 +08:00
parent 25fc0226aa
commit 2a81d41c2c
107 changed files with 6935 additions and 1543 deletions
+27 -12
View File
@@ -24,7 +24,7 @@
<script>
import dnscache from 'dnscache'
import { mapMutations, mapGetters, mapActions } from 'vuex'
import { rendererOn, rendererSend, rendererInvoke } from '../common/ipc'
import { rendererOn, rendererSend, rendererInvoke, NAMES } from '../common/ipc'
import { isLinux } from '../common/utils'
import music from './utils/music'
import { throttle, openUrl } from './utils'
@@ -73,7 +73,6 @@ export default {
created() {
this.saveSetting = throttle(n => {
window.electronStore_config.set('setting', n)
rendererSend('updateAppSetting', n)
})
this.saveDefaultList = throttle(n => {
window.electronStore_list.set('defaultList', n)
@@ -98,7 +97,8 @@ export default {
},
watch: {
setting: {
handler(n) {
handler(n, o) {
rendererSend(NAMES.mainWindow.set_app_setting, n)
this.saveSetting(n)
},
deep: true,
@@ -144,16 +144,16 @@ export default {
},
methods: {
...mapActions(['getVersionInfo']),
...mapMutations(['setNewVersion', 'setVersionModalVisible', 'setDownloadProgress', 'setSetting']),
...mapMutations(['setNewVersion', 'setVersionModalVisible', 'setDownloadProgress', 'setSetting', 'setDesktopLyricConfig']),
...mapMutations('list', ['initList']),
...mapMutations('download', ['updateDownloadList']),
init() {
document.documentElement.style.fontSize = this.windowSizeActive.fontSize
rendererInvoke('getEnvParams').then(this.handleEnvParamsInit)
rendererInvoke(NAMES.mainWindow.get_env_params).then(this.handleEnvParamsInit)
document.body.addEventListener('click', this.handleBodyClick, true)
rendererOn('update-available', (e, info) => {
rendererOn(NAMES.mainWindow.update_available, (e, info) => {
// this.showUpdateModal(true)
// console.log(info)
this.setVersionModalVisible({ isDownloading: true })
@@ -168,7 +168,7 @@ export default {
})
})
})
rendererOn('update-error', (event, err) => {
rendererOn(NAMES.mainWindow.update_error, (event, err) => {
// console.log(err)
this.clearUpdateTimeout()
this.setVersionModalVisible({ isError: true })
@@ -176,11 +176,11 @@ export default {
this.showUpdateModal()
})
})
rendererOn('update-progress', (event, progress) => {
rendererOn(NAMES.mainWindow.update_progress, (event, progress) => {
// console.log(progress)
this.setDownloadProgress(progress)
})
rendererOn('update-downloaded', info => {
rendererOn(NAMES.mainWindow.update_downloaded, info => {
// console.log(info)
this.clearUpdateTimeout()
this.setVersionModalVisible({ isDownloaded: true })
@@ -188,7 +188,7 @@ export default {
this.showUpdateModal()
})
})
rendererOn('update-not-available', (e, info) => {
rendererOn(NAMES.mainWindow.update_not_available, (event, info) => {
this.clearUpdateTimeout()
this.setNewVersion({
version: info.version,
@@ -196,6 +196,14 @@ export default {
})
this.setVersionModalVisible({ isLatestVer: true })
})
rendererOn(NAMES.mainWindow.set_config, (event, config) => {
// console.log(config)
// this.setDesktopLyricConfig(config)
// console.log('set_config', JSON.stringify(this.setting) === JSON.stringify(config))
this.setSetting(Object.assign({}, this.setting, config))
window.eventHub.$emit('set_config', config)
})
// 更新超时定时器
this.updateTimeout = setTimeout(() => {
this.updateTimeout = null
@@ -217,13 +225,13 @@ export default {
},
enableIgnoreMouseEvents() {
if (this.isNt) return
rendererSend('setIgnoreMouseEvents', false)
rendererSend(NAMES.mainWindow.set_ignore_mouse_events, false)
// console.log('content enable')
},
dieableIgnoreMouseEvents() {
if (this.isNt) return
// console.log('content disable')
rendererSend('setIgnoreMouseEvents', true)
rendererSend(NAMES.mainWindow.set_ignore_mouse_events, true)
},
initData() { // 初始化数据
@@ -234,6 +242,8 @@ export default {
let defaultList = window.electronStore_list.get('defaultList') || this.defaultList
let loveList = window.electronStore_list.get('loveList') || this.loveList
let userList = window.electronStore_list.get('userList') || this.userList
if (!defaultList.list) defaultList.list = []
if (!loveList.list) loveList.list = []
this.initList({ defaultList, loveList, userList })
},
initDownloadList() {
@@ -270,6 +280,7 @@ export default {
let len = Math.max(newVer.length, currentVer.length)
newVer.padStart(len, '0')
currentVer.padStart(len, '0')
if (result.version == '0.0.0') return this.setVersionModalVisible({ isUnknow: true })
if (parseInt(newVer) <= parseInt(currentVer)) return this.setVersionModalVisible({ isLatestVer: true })
if (result.version === this.setting.ignoreVersion) return
@@ -344,6 +355,10 @@ export default {
@import './assets/styles/index.less';
@import './assets/styles/layout.less';
html, body {
overflow: hidden;
}
body {
user-select: none;
height: 100vh;
Binary file not shown.

Before

Width:  |  Height:  |  Size: 33 KiB

After

Width:  |  Height:  |  Size: 353 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 181 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

+90 -19
View File
@@ -1,6 +1,6 @@
@import './colors.less';
@themes: green, yellow, blue, red, pink, purple, orange, grey, ming, mid_autumn, naruto, happy_new_year;
@themes: green, yellow, blue, red, pink, purple, orange, grey, ming, blue2, mid_autumn, naruto, happy_new_year;
// Colors
@@ -21,7 +21,8 @@
@color-theme_2-active: fadeout(lighten(@color-theme, 10%), 70%);
@color-theme_2-font: darken(@color-theme_2, 70%);
@color-theme_2-font-label: fadeout(@color-theme_2-font, 40%);
@color-theme_2-line: lighten(@color-theme, 35%);
@color-theme_2-line: transparent;
// @color-theme_2-line: lighten(@color-theme, 35%);
@color-theme-sidebar: @color-theme;
@color-btn: lighten(@color-theme, 5%);
@color-btn-background: fadeout(lighten(@color-theme, 35%), 70%);
@@ -88,7 +89,8 @@
@color-green-theme_2-active: fadeout(lighten(@color-green-theme, 10%), 70%);
@color-green-theme_2-font: darken(@color-green-theme_2, 70%);
@color-green-theme_2-font-label: fadeout(@color-green-theme_2-font, 40%);
@color-green-theme_2-line: lighten(@color-green-theme, 45%);
@color-green-theme_2-line: transparent;
// @color-green-theme_2-line: lighten(@color-green-theme, 45%);
@color-green-theme-sidebar: @color-green-theme;
@color-green-btn: lighten(@color-green-theme, 5%);
@color-green-btn-background: fadeout(lighten(@color-green-theme, 35%), 70%);
@@ -144,7 +146,8 @@
@color-yellow-theme_2-active: fadeout(lighten(@color-yellow-theme, 10%), 60%);
@color-yellow-theme_2-font: darken(@color-yellow-theme_2, 70%);
@color-yellow-theme_2-font-label: fadeout(@color-yellow-theme_2-font, 40%);
@color-yellow-theme_2-line: lighten(@color-yellow-theme, 28%);
@color-yellow-theme_2-line: transparent;
// @color-yellow-theme_2-line: lighten(@color-yellow-theme, 28%);
@color-yellow-theme-sidebar: @color-yellow-theme;
@color-yellow-btn: darken(@color-yellow-theme, 5%);
@color-yellow-btn-background: fadeout(lighten(@color-yellow-theme, 25%), 60%);
@@ -199,7 +202,8 @@
@color-orange-theme_2-active: fadeout(darken(@color-orange-theme, 5%), 70%);
@color-orange-theme_2-font: darken(@color-orange-theme_2, 70%);
@color-orange-theme_2-font-label: fadeout(@color-orange-theme_2-font, 40%);
@color-orange-theme_2-line: lighten(@color-orange-theme, 36%);
@color-orange-theme_2-line: transparent;
// @color-orange-theme_2-line: lighten(@color-orange-theme, 36%);
@color-orange-theme-sidebar: @color-orange-theme;
@color-orange-btn: lighten(@color-orange-theme, 5%);
@color-orange-btn-background: fadeout(lighten(@color-orange-theme, 25%), 60%);
@@ -254,7 +258,8 @@
@color-blue-theme_2-active: fadeout(lighten(@color-blue-theme, 10%), 70%);
@color-blue-theme_2-font: darken(@color-blue-theme_2, 70%);
@color-blue-theme_2-font-label: fadeout(@color-blue-theme_2-font, 40%);
@color-blue-theme_2-line: lighten(@color-blue-theme, 42%);
@color-blue-theme_2-line: transparent;
// @color-blue-theme_2-line: lighten(@color-blue-theme, 42%);
@color-blue-theme-sidebar: @color-blue-theme;
@color-blue-btn: lighten(@color-blue-theme, 5%);
@color-blue-btn-background: fadeout(lighten(@color-blue-theme, 35%), 50%);
@@ -309,7 +314,8 @@
@color-red-theme_2-background_2: fadeout(@color-red-theme_2-background_1, 2%);
@color-red-theme_2-font: darken(@color-red-theme_2, 70%);
@color-red-theme_2-font-label: fadeout(@color-red-theme_2-font, 40%);
@color-red-theme_2-line: lighten(@color-red-theme, 42%);
@color-red-theme_2-line: transparent;
// @color-red-theme_2-line: lighten(@color-red-theme, 42%);
@color-red-theme-sidebar: @color-red-theme;
@color-red-btn: lighten(@color-red-theme, 5%);
@color-red-btn-background: fadeout(lighten(@color-red-theme, 35%), 70%);
@@ -366,7 +372,8 @@
@color-pink-theme_2-active: fadeout(lighten(@color-pink-theme, 10%), 60%);
@color-pink-theme_2-font: darken(@color-pink-theme_2, 70%);
@color-pink-theme_2-font-label: fadeout(@color-pink-theme_2-font, 40%);
@color-pink-theme_2-line: lighten(@color-pink-theme, 25%);
@color-pink-theme_2-line: transparent;
// @color-pink-theme_2-line: lighten(@color-pink-theme, 25%);
@color-pink-theme-sidebar: @color-pink-theme;
@color-pink-btn: darken(@color-pink-theme, 3%);
@color-pink-btn-background: fadeout(lighten(@color-pink-theme, 20%), 50%);
@@ -421,7 +428,8 @@
@color-purple-theme_2-active: fadeout(lighten(@color-purple-theme, 10%), 70%);
@color-purple-theme_2-font: darken(@color-purple-theme_2, 70%);
@color-purple-theme_2-font-label: fadeout(@color-purple-theme_2-font, 40%);
@color-purple-theme_2-line: lighten(@color-purple-theme, 43%);
@color-purple-theme_2-line: transparent;
// @color-purple-theme_2-line: lighten(@color-purple-theme, 43%);
@color-purple-theme-sidebar: @color-purple-theme;
@color-purple-btn: lighten(@color-purple-theme, 5%);
@color-purple-btn-background: fadeout(lighten(@color-purple-theme, 35%), 70%);
@@ -476,7 +484,8 @@
@color-grey-theme_2-active: fadeout(lighten(@color-grey-theme, 10%), 70%);
@color-grey-theme_2-font: darken(@color-grey-theme_2, 70%);
@color-grey-theme_2-font-label: fadeout(@color-grey-theme_2-font, 40%);
@color-grey-theme_2-line: lighten(@color-grey-theme, 47%);
@color-grey-theme_2-line: transparent;
// @color-grey-theme_2-line: lighten(@color-grey-theme, 47%);
@color-grey-theme-sidebar: @color-grey-theme;
@color-grey-btn: lighten(@color-grey-theme, 5%);
@color-grey-btn-background: fadeout(lighten(@color-grey-theme, 35%), 70%);
@@ -532,7 +541,8 @@
@color-ming-theme_2-background_2: fadeout(@color-ming-theme_2-background_1, 2%);
@color-ming-theme_2-font: darken(@color-ming-theme_2, 70%);
@color-ming-theme_2-font-label: fadeout(@color-ming-theme_2-font, 40%);
@color-ming-theme_2-line: lighten(@color-ming-theme, 60%);
@color-ming-theme_2-line: transparent;
// @color-ming-theme_2-line: lighten(@color-ming-theme, 60%);
@color-ming-theme-sidebar: @color-ming-theme;
@color-ming-btn: lighten(@color-ming-theme, 5%);
@color-ming-btn-background: fadeout(lighten(@color-ming-theme, 35%), 75%);
@@ -574,22 +584,81 @@
@color-ming-badge-info: #6376a2;
@color-ming-badge-info-font: #fff;
@color-blue2-theme: #4f62d0;
@color-blue2-theme-bgimg: none;
@color-blue2-theme-bgposition: center;
@color-blue2-theme-bgsize: auto auto;
@color-blue2-theme-hover: fadeout(lighten(@color-blue2-theme, 10%), 30%);
@color-blue2-theme-active: fadeout(darken(@color-blue2-theme, 20%), 60%);
@color-blue2-theme-font: #fff;
@color-blue2-theme-font-label: lighten(@color-blue2-theme, 35%);
@color-blue2-theme_2: #fff;
@color-blue2-theme_2-background_1: #fff;
@color-blue2-theme_2-background_2: fadeout(@color-blue2-theme_2-background_1, 2%);
@color-blue2-theme_2-hover: fadeout(lighten(@color-blue2-theme, 10%), 80%);
@color-blue2-theme_2-active: fadeout(lighten(@color-blue2-theme, 10%), 70%);
@color-blue2-theme_2-font: darken(@color-blue2-theme_2, 70%);
@color-blue2-theme_2-font-label: fadeout(@color-blue2-theme_2-font, 40%);
@color-blue2-theme_2-line: transparent;
// @color-blue2-theme_2-line: lighten(@color-blue2-theme, 47%);
@color-blue2-theme-sidebar: @color-blue2-theme;
@color-blue2-btn: lighten(@color-blue2-theme, 5%);
@color-blue2-btn-background: fadeout(lighten(@color-blue2-theme, 30%), 70%);
@color-blue2-btn-hover: fadeout(lighten(@color-blue2-theme, 5%), 70%);
@color-blue2-btn-active: fadeout(darken(@color-blue2-theme, 5%), 70%);
@color-blue2-btn-select: fadeout(lighten(@color-blue2-theme, 5%), 50%);
@color-blue2-pagination-background: fadeout(lighten(@color-blue2-theme, 35%), 30%);
@color-blue2-pagination-hover: fadeout(lighten(@color-blue2-theme, 10%), 70%);
@color-blue2-pagination-active: fadeout(darken(@color-blue2-theme, 10%), 70%);
@color-blue2-pagination-select: fadeout(lighten(@color-blue2-theme, 10%), 50%);
@color-blue2-search-form-background: fadeout(lighten(@color-blue2-theme, 35%), 10%);
@color-blue2-search-list-hover: fadeout(darken(@color-blue2-theme, 10%), 70%);
@color-blue2-scrollbar-track: fadeout(lighten(@color-blue2-theme, 10%), 75%);
@color-blue2-scrollbar-thumb: fadeout(lighten(@color-blue2-theme, 10%), 50%);
@color-blue2-scrollbar-thumb-hover: fadeout(lighten(@color-blue2-theme, 10%), 35%);
@color-blue2-player-pic-c1: fadeout(@color-blue2-theme_2, 50%);
@color-blue2-player-pic-c2: darken(@color-blue2-theme_2, 30%);
@color-blue2-player-progress: darken(@color-blue2-theme_2, 6%);
@color-blue2-player-progress-bar1: darken(@color-blue2-theme_2, 12%);
@color-blue2-player-progress-bar2: lighten(@color-blue2-theme, 12%);
@color-blue2-player-status-text: lighten(@color-blue2-theme_2-font, 10%);
@color-blue2-player-detail-play-btn: lighten(@color-blue2-theme, 7%);
@color-blue2-tab-btn-background: fadeout(lighten(@color-blue2-theme, 10%), 80%);
@color-blue2-tab-btn-background-hover: @color-blue2-theme_2-hover;
@color-blue2-tab-border-top: fadeout(lighten(@color-blue2-theme, 5%), 50%);
@color-blue2-tab-border-bottom: lighten(@color-blue2-theme, 5%);
@color-blue2-hideBtn: #3bc2b2;
@color-blue2-minBtn: #85c43b;
@color-blue2-maxBtn: #e7aa36;
@color-blue2-closeBtn: #ea6e4d;
@color-blue2-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-blue2-minBtn-hover: fadeout(@color-blue2-minBtn, 10%);
@color-blue2-maxBtn-hover: fadeout(@color-blue2-maxBtn, 10%);
@color-blue2-closeBtn-hover: fadeout(@color-blue2-closeBtn, 10%);
@color-blue2-badge-success: lighten(@color-blue2-theme, 15%);
@color-blue2-badge-success-font: #fff;
@color-blue2-badge-info: #6376a2;
@color-blue2-badge-info-font: #fff;
@color-mid_autumn-theme: rgba(74, 55, 82, 1);
@color-mid_autumn-theme-bgimg: url(../images/jqbg.jpg);
@color-mid_autumn-theme-bgposition: center;
@color-mid_autumn-theme-bgsize: auto 100%;
@color-mid_autumn-theme-bgsize: cover;
@color-mid_autumn-theme-hover: fadeout(lighten(@color-mid_autumn-theme, 10%), 40%);
@color-mid_autumn-theme-active: fadeout(lighten(@color-mid_autumn-theme, 15%), 60%);
@color-mid_autumn-theme-font: rgba(246, 233, 255, 0.9);
@color-mid_autumn-theme-font-label: fadeout(lighten(@color-mid_autumn-theme, 20%), 20%);
@color-mid_autumn-theme_2: rgba(255, 255, 255, .93);
@color-mid_autumn-theme_2: rgba(255, 255, 255, .9);
@color-mid_autumn-theme_2-background_1: #eeedef;
@color-mid_autumn-theme_2-background_2: fadeout(@color-mid_autumn-theme_2-background_1, 2%);
@color-mid_autumn-theme_2-hover: fadeout(lighten(@color-mid_autumn-theme, 15%), 80%);
@color-mid_autumn-theme_2-active: fadeout(lighten(@color-mid_autumn-theme, 15%), 70%);
@color-mid_autumn-theme_2-font: darken(@color-mid_autumn-theme_2, 70%);
@color-mid_autumn-theme_2-font-label: desaturate(lighten(@color-mid_autumn-theme, 30%), 45%);
@color-mid_autumn-theme_2-line: lighten(@color-mid_autumn-theme, 63%);
@color-mid_autumn-theme_2-line: transparent;
// @color-mid_autumn-theme_2-line: lighten(@color-mid_autumn-theme, 63%);
@color-mid_autumn-theme-sidebar: rgba(255, 255, 255, 0);
@color-mid_autumn-btn: lighten(@color-mid_autumn-theme, 10%);
@color-mid_autumn-btn-background: fadeout(lighten(@color-mid_autumn-theme, 35%), 70%);
@@ -630,9 +699,9 @@
@color-mid_autumn-badge-info-font: #fff;
@color-naruto-theme: rgb(87, 144, 167);
@color-naruto-theme-bgimg: url(../images/myzcbg.jpeg);
@color-naruto-theme-bgimg: url(../images/myzcbg.jpg);
@color-naruto-theme-bgposition: center;
@color-naruto-theme-bgsize: auto 100%;
@color-naruto-theme-bgsize: cover;
@color-naruto-theme-hover: fadeout(lighten(@color-naruto-theme, 10%), 45%);
@color-naruto-theme-active: fadeout(lighten(@color-naruto-theme, 15%), 60%);
@color-naruto-theme-font: rgba(67, 118, 148, 0.9);
@@ -644,7 +713,8 @@
@color-naruto-theme_2-active: fadeout(lighten(@color-naruto-theme, 10%), 65%);
@color-naruto-theme_2-font: darken(@color-naruto-theme_2, 80%);
@color-naruto-theme_2-font-label: desaturate(lighten(@color-naruto-theme, 10%), 45%);
@color-naruto-theme_2-line: fadeout(lighten(@color-naruto-theme, 36%), 70%);
@color-naruto-theme_2-line: transparent;
// @color-naruto-theme_2-line: fadeout(lighten(@color-naruto-theme, 36%), 70%);
@color-naruto-theme-sidebar: rgba(255, 255, 255, .3);
@color-naruto-btn: lighten(@color-naruto-theme, 2%);
@color-naruto-btn-background: fadeout(lighten(@color-naruto-theme, 35%), 70%);
@@ -687,7 +757,7 @@
@color-happy_new_year-theme: rgb(252, 57, 57);
@color-happy_new_year-theme-bgimg: url(../images/xnkl.jpg);
@color-happy_new_year-theme-bgposition: center;
@color-happy_new_year-theme-bgsize: auto 100%;
@color-happy_new_year-theme-bgsize: cover;
@color-happy_new_year-theme-hover: fadeout(lighten(@color-happy_new_year-theme, 10%), 45%);
@color-happy_new_year-theme-active: fadeout(lighten(@color-happy_new_year-theme, 15%), 60%);
@color-happy_new_year-theme-font: rgba(255, 255, 255, 0.9);
@@ -699,7 +769,8 @@
@color-happy_new_year-theme_2-active: fadeout(lighten(@color-happy_new_year-theme, 10%), 55%);
@color-happy_new_year-theme_2-font: darken(@color-happy_new_year-theme_2, 90%);
@color-happy_new_year-theme_2-font-label: desaturate(darken(@color-happy_new_year-theme, 5%), 50%);
@color-happy_new_year-theme_2-line: fadeout(lighten(@color-happy_new_year-theme, 16%), 70%);
@color-happy_new_year-theme_2-line: transparent;
// @color-happy_new_year-theme_2-line: fadeout(lighten(@color-happy_new_year-theme, 16%), 70%);
@color-happy_new_year-theme-sidebar: rgba(119, 37, 18, 0.1);
@color-happy_new_year-btn: desaturate(@color-happy_new_year-theme, 10%);
@color-happy_new_year-btn-background: fadeout(lighten(@color-happy_new_year-theme, 15%), 60%);
+100 -50
View File
@@ -55,18 +55,19 @@ div(:class="$style.player")
<script>
import Lyric from 'lrc-file-parser'
import { rendererSend } from '../../../common/ipc'
import { rendererSend, rendererOn, NAMES } from '../../../common/ipc'
import { formatPlayTime2, getRandom, checkPath, setTitle, clipboardWriteText, debounce, assertApiSupport } from '../../utils'
import { mapGetters, mapActions, mapMutations } from 'vuex'
import { requestMsg } from '../../utils/message'
import { isMac } from '../../../common/utils'
import path from 'path'
let audio
export default {
data() {
return {
show: true,
audio: null,
volume: 0,
nowPlayTime: 0,
maxPlayTime: 0,
@@ -135,6 +136,32 @@ export default {
this.setVolume(volume)
}, 300)
rendererOn(NAMES.mainWindow.get_lyric_info, (event, info) => {
switch (info.action) {
case 'info':
this.handleUpdateWinLyricInfo('info', {
songmid: this.musicInfo.songmid,
singer: this.musicInfo.singer,
name: this.musicInfo.name,
album: this.musicInfo.album,
lyric: this.musicInfo.lrc,
isPlay: this.isPlay,
line: this.lyric.line,
played_time: audio.currentTime * 1000,
}, info)
break
case 'status':
this.handleUpdateWinLyricInfo('status', {
isPlay: this.isPlay,
line: this.lyric.line,
played_time: audio.currentTime * 1000,
}, info)
break
default:
break
}
})
navigator.mediaDevices.addEventListener('devicechange', this.handleMediaListChange)
document.addEventListener('mousemove', this.handleVolumeMsMove)
document.addEventListener('mouseup', this.handleVolumeMsUp)
@@ -157,7 +184,7 @@ export default {
this.play()
},
'setting.player.togglePlayMethod'(n) {
this.audio.loop = n === 'singleLoop'
audio.loop = n === 'singleLoop'
},
'setting.player.mediaDeviceId'(n) {
this.setMediaDevice()
@@ -204,40 +231,40 @@ export default {
...mapMutations('list', ['updateMusicInfo']),
...mapMutations(['setMediaDeviceId']),
init() {
this.audio = document.createElement('audio')
audio = new window.Audio()
this.setMediaDevice()
this.volume = this.audio.volume = this.setting.player.volume
this.audio.controls = false
this.audio.autoplay = true
this.audio.preload = 'auto'
this.audio.loop = this.setting.player.togglePlayMethod === 'singleLoop'
this.volume = audio.volume = this.setting.player.volume
audio.controls = false
audio.autoplay = true
audio.preload = 'auto'
audio.loop = this.setting.player.togglePlayMethod === 'singleLoop'
this.audio.addEventListener('playing', () => {
audio.addEventListener('playing', () => {
console.log('开始播放')
this.statusText = this.$t('core.player.playing')
this.status = ''
this.startPlay()
})
this.audio.addEventListener('pause', () => {
audio.addEventListener('pause', () => {
console.log('暂停播放')
window.lrc.pause()
this.stopPlay()
// this.status = this.statusText = this.$t('core.player.stop')
})
this.audio.addEventListener('ended', () => {
audio.addEventListener('ended', () => {
console.log('播放完毕')
this.stopPlay()
this.status = this.statusText = this.$t('core.player.end')
this.handleNext()
})
this.audio.addEventListener('error', () => {
// console.log('code', this.audio.error.code)
audio.addEventListener('error', () => {
// console.log('code', audio.error.code)
if (!this.musicInfo.songmid) return
console.log('出错')
this.stopPlay()
if (this.listId != 'download' && this.audio.error.code !== 1 && this.retryNum < 2) { // 若音频URL无效则尝试刷新2次URL
if (this.listId != 'download' && audio.error.code !== 1 && this.retryNum < 2) { // 若音频URL无效则尝试刷新2次URL
// console.log(this.retryNum)
if (!this.audioErrorTime) this.audioErrorTime = this.audio.currentTime // 记录出错的播放时间
if (!this.audioErrorTime) this.audioErrorTime = audio.currentTime // 记录出错的播放时间
this.retryNum++
this.setUrl(this.list[this.playIndex], true)
this.status = this.statusText = this.$t('core.player.refresh_url')
@@ -248,37 +275,37 @@ export default {
this.status = this.statusText = this.$t('core.player.error')
this.addDelayNextTimeout()
})
this.audio.addEventListener('loadeddata', () => {
this.maxPlayTime = this.audio.duration
audio.addEventListener('loadeddata', () => {
this.maxPlayTime = audio.duration
if (this.audioErrorTime) {
this.audio.currentTime = this.audioErrorTime
audio.currentTime = this.audioErrorTime
this.audioErrorTime = 0
}
if (!this.targetSong.interval && this.listId != 'download') this.updateMusicInfo({ id: this.listId, index: this.playIndex, data: { interval: formatPlayTime2(this.maxPlayTime) } })
this.status = this.statusText = this.$t('core.player.loading')
})
this.audio.addEventListener('loadstart', () => {
audio.addEventListener('loadstart', () => {
this.status = this.statusText = this.$t('core.player.loading')
})
this.audio.addEventListener('canplay', () => {
audio.addEventListener('canplay', () => {
console.log('加载完成开始播放')
if (this.mediaBuffer.playTime) {
let playTime = this.mediaBuffer.playTime
this.mediaBuffer.playTime = 0
this.audio.currentTime = playTime
audio.currentTime = playTime
}
if (this.mediaBuffer.timeout) {
this.clearBufferTimeout()
}
// if (this.musicInfo.lrc) window.lrc.play(this.audio.currentTime * 1000)
// if (this.musicInfo.lrc) window.lrc.play(audio.currentTime * 1000)
this.status = this.statusText = this.$t('core.player.loading')
})
// this.audio.addEventListener('canplaythrough', () => {
// audio.addEventListener('canplaythrough', () => {
// console.log('音乐加载完毕')
// // if (this.musicInfo.lyric.orgLrc) this.musicInfo.lyric.lrc.play(this.audio.currentTime * 1000)
// // if (this.musicInfo.lyric.orgLrc) this.musicInfo.lyric.lrc.play(audio.currentTime * 1000)
// this.status = this.statusText = '播放中...'
// })
this.audio.addEventListener('emptied', () => {
audio.addEventListener('emptied', () => {
this.mediaBuffer.playTime = 0
this.clearBufferTimeout()
@@ -286,11 +313,11 @@ export default {
// this.status = this.statusText = '媒介资源元素突然为空,网络错误?'
})
this.audio.addEventListener('timeupdate', () => {
this.nowPlayTime = this.audio.currentTime
audio.addEventListener('timeupdate', () => {
this.nowPlayTime = audio.currentTime
})
this.audio.addEventListener('waiting', () => {
audio.addEventListener('waiting', () => {
// this.musicInfo.lyric.lrc.pause()
// console.log('缓冲中...')
this.stopPlay()
@@ -330,11 +357,12 @@ export default {
this.musicInfo.singer = targetSong.musicInfo.singer
this.musicInfo.name = targetSong.musicInfo.name
this.musicInfo.album = targetSong.albumName
this.audio.src = filePath
audio.src = filePath
// console.log(filePath)
this.setImg(targetSong.musicInfo)
this.setLrc(targetSong.musicInfo)
} else {
if (!this.assertApiSupport(targetSong.source)) return this.handleNext()
this.musicInfo.songmid = targetSong.songmid
this.musicInfo.singer = targetSong.singer
this.musicInfo.name = targetSong.name
@@ -343,6 +371,12 @@ export default {
this.setImg(targetSong)
this.setLrc(targetSong)
}
this.handleUpdateWinLyricInfo('music_info', {
songmid: this.musicInfo.songmid,
singer: this.musicInfo.singer,
name: this.musicInfo.name,
album: this.musicInfo.album,
})
},
checkDelayNextTimeout() {
// console.log(this.delayNextTimeout)
@@ -423,13 +457,15 @@ export default {
},
startPlay() {
this.isPlay = true
if (this.musicInfo.lrc) window.lrc.play(this.audio.currentTime * 1000)
if (this.musicInfo.lrc) window.lrc.play(audio.currentTime * 1000)
this.handleUpdateWinLyricInfo('play', audio.currentTime * 1000)
this.setAppTitle()
this.sendProgressEvent(this.progress, 'normal')
},
stopPlay() {
this.isPlay = false
window.lrc.pause()
this.handleUpdateWinLyricInfo('pause')
this.sendProgressEvent(this.progress, 'paused')
this.clearAppTitle()
},
@@ -437,7 +473,7 @@ export default {
this.setProgress(event.offsetX / this.pregessWidth)
},
setProgress(pregress) {
if (!this.audio.src) return
if (!audio.src) return
const time = pregress * this.maxPlayTime
if (this.audioErrorTime) this.audioErrorTime = time
if (this.mediaBuffer.playTime) {
@@ -445,9 +481,9 @@ export default {
this.mediaBuffer.playTime = time
this.startBuffering()
}
this.audio.currentTime = time
audio.currentTime = time
if (!this.isPlay) this.audio.play()
if (!this.isPlay) audio.play()
},
setProgressWidth() {
this.pregessWidth = parseInt(
@@ -455,12 +491,12 @@ export default {
)
},
togglePlay() {
if (!this.audio.src) return
if (!audio.src) return
if (this.isPlay) {
this.audio.pause()
audio.pause()
this.clearBufferTimeout()
} else {
this.audio.play()
audio.play()
}
},
imgError(e) {
@@ -479,7 +515,7 @@ export default {
this.status = this.statusText = this.$t('core.player.geting_url')
return this.getUrl({ musicInfo: targetSong, type, isRefresh }).then(() => {
this.audio.src = this.musicInfo.url = targetSong.typeUrl[type]
audio.src = this.musicInfo.url = targetSong.typeUrl[type]
}).catch(err => {
// console.log('err', err.message)
if (err.message == requestMsg.cancelRequest) return
@@ -510,16 +546,21 @@ export default {
lrcP
.then(() => {
window.lrc.setLyric(this.musicInfo.lrc)
if (this.isPlay && (this.musicInfo.url || this.listId == 'download')) window.lrc.play(this.audio.currentTime * 1000)
this.handleUpdateWinLyricInfo('lyric', this.musicInfo.lrc)
if (this.isPlay && (this.musicInfo.url || this.listId == 'download')) {
window.lrc.play(audio.currentTime * 1000)
this.handleUpdateWinLyricInfo('play', audio.currentTime * 1000)
}
})
.catch(() => {
this.handleUpdateWinLyricInfo('lyric', this.musicInfo.lrc)
this.status = this.statusText = this.$t('core.player.lyric_error')
})
},
handleRemoveMusic() {
this.stopPlay()
this.audio.src = null
this.audio.removeAttribute('src')
audio.src = null
audio.removeAttribute('src')
this.statusText = '^-^'
this.musicInfo.img = null
this.status = this.musicInfo.name = this.musicInfo.singer = ''
@@ -531,10 +572,12 @@ export default {
this.lyric.lines = []
this.lyric.line = -1
this.lyric.text = 0
this.handleUpdateWinLyricInfo('lines', [])
this.handleUpdateWinLyricInfo('line', 0)
},
sendProgressEvent(status, mode) {
// console.log(status)
this.setting.player.isShowTaskProgess && rendererSend('progress', {
this.setting.player.isShowTaskProgess && rendererSend(NAMES.mainWindow.progress, {
status: status < 0.01 ? 0.01 : status,
mode: mode || 'normal',
})
@@ -556,7 +599,7 @@ export default {
this.volume = val
this.volumeEvent.msDownVolume = val
// console.log(val)
if (this.audio) this.audio.volume = this.volume
if (audio) audio.volume = this.volume
},
handleVolumeMsUp(e) {
this.volumeEvent.isMsDown = false
@@ -565,7 +608,7 @@ export default {
if (!this.volumeEvent.isMsDown) return
let val = this.volumeEvent.msDownVolume + (e.clientX - this.volumeEvent.msDownX) / 70
this.volume = val < 0 ? 0 : val > 1 ? 1 : val
if (this.audio) this.audio.volume = this.volume
if (audio) audio.volume = this.volume
// console.log(val)
},
handleCopy(text) {
@@ -597,18 +640,18 @@ export default {
if (this.mediaBuffer.timeout) return
this.mediaBuffer.timeout = setTimeout(() => {
this.mediaBuffer.timeout = null
if (!this.mediaBuffer.playTime) this.mediaBuffer.playTime = this.audio.currentTime
let skipTime = this.audio.currentTime + getRandom(3, 6)
if (skipTime > this.maxPlayTime) skipTime = (this.maxPlayTime - this.audio.currentTime) / 2
if (!this.mediaBuffer.playTime) this.mediaBuffer.playTime = audio.currentTime
let skipTime = audio.currentTime + getRandom(3, 6)
if (skipTime > this.maxPlayTime) skipTime = (this.maxPlayTime - audio.currentTime) / 2
if (skipTime - this.mediaBuffer.playTime < 1 || this.maxPlayTime - skipTime < 1) {
this.mediaBuffer.playTime = 0
this.handleNext()
return
}
this.startBuffering()
this.audio.currentTime = skipTime
audio.currentTime = skipTime
console.log(this.mediaBuffer.playTime)
console.log(this.audio.currentTime)
console.log(audio.currentTime)
}, 3000)
},
clearBufferTimeout() {
@@ -634,7 +677,7 @@ export default {
this.prevDeviceLabel = label
// console.log(device)
this.audio.setSinkId(mediaDeviceId).catch(err => {
audio.setSinkId(mediaDeviceId).catch(err => {
console.log(err)
this.setMediaDeviceId('default')
})
@@ -680,6 +723,13 @@ export default {
assertApiSupport(source) {
return assertApiSupport(source)
},
handleUpdateWinLyricInfo(type, data, info) {
rendererSend(NAMES.mainWindow.set_lyric_info, {
type,
data,
info,
})
},
},
}
</script>
+12 -12
View File
@@ -59,7 +59,7 @@
<script>
import { mapGetters, mapMutations } from 'vuex'
import { rendererSend } from 'common/ipc'
import { rendererSend, NAMES } from 'common/ipc'
import { scrollTo } from '../../utils'
let cancelScrollFn = null
@@ -119,14 +119,14 @@ export default {
},
},
watch: {
'musicInfo.img': {
handler(n) {
if (n) {
this.bgStyle.backgroundImage = `url(${n})`
}
},
immediate: true,
},
// 'musicInfo.img': {
// handler(n) {
// if (n) {
// this.bgStyle.backgroundImage = `url(${n})`
// }
// },
// immediate: true,
// },
'lyric.lines': {
handler(n, o) {
this.isSetedLines = true
@@ -299,13 +299,13 @@ export default {
this.lyricEvent.timeout = null
},
min() {
rendererSend('min')
rendererSend(NAMES.mainWindow.min)
},
max() {
rendererSend('max')
rendererSend(NAMES.mainWindow.max)
},
close() {
rendererSend('close')
rendererSend(NAMES.mainWindow.close)
},
},
}
+4 -4
View File
@@ -12,7 +12,7 @@
</template>
<script>
import { rendererSend } from 'common/ipc'
import { rendererSend, NAMES } from 'common/ipc'
import { mapGetters, mapMutations } from 'vuex'
import music from '../../utils/music'
import { debounce } from '../../utils'
@@ -113,13 +113,13 @@ export default {
},
min() {
rendererSend('min')
rendererSend(NAMES.mainWindow.min)
},
max() {
rendererSend('max')
rendererSend(NAMES.mainWindow.max)
},
close() {
rendererSend('close')
rendererSend(NAMES.mainWindow.close)
},
},
}
@@ -57,7 +57,7 @@ material-modal(:show="!setting.isAgreePact || globalObj.isShowPact" @close="hand
<script>
import { mapGetters, mapMutations } from 'vuex'
import { rendererSend } from '../../../common/ipc'
import { rendererSend, NAMES } from '../../../common/ipc'
import { openUrl } from '../../utils'
export default {
data() {
@@ -98,7 +98,7 @@ export default {
this.setAgreePact()
},
handleClose(isExit) {
if (isExit) return rendererSend('close', true)
if (isExit) return rendererSend(NAMES.mainWindow.close, true)
this.globalObj.isShowPact = false
},
openUrl(url) {
@@ -127,7 +127,7 @@ material-modal(:show="version.showModal" @close="handleClose" v-if="version.newV
<script>
import { mapGetters, mapMutations } from 'vuex'
import { rendererSend } from '../../../common/ipc'
import { rendererSend, NAMES } from '../../../common/ipc'
import { checkVersion, openUrl, clipboardWriteText, sizeFormate } from '../../utils'
export default {
@@ -165,7 +165,7 @@ export default {
handleRestartClick(event) {
this.handleClose()
event.target.disabled = true
rendererSend('quit-update')
rendererSend(NAMES.mainWindow.quit_update)
},
handleCopy(text) {
clipboardWriteText(text)
@@ -139,7 +139,7 @@ export default {
margin-bottom: 15px;
height: 36px;
line-height: 36px;
padding: 0 10px;
padding: 0 10px !important;
width: 150px;
.mixin-ellipsis-1;
}
@@ -136,7 +136,7 @@ export default {
margin-bottom: 15px;
height: 36px;
line-height: 36px;
padding: 0 10px;
padding: 0 10px !important;
width: 150px;
.mixin-ellipsis-1;
}
-82
View File
@@ -1,82 +0,0 @@
import path from 'path'
import os from 'os'
const defaultSetting = {
version: '1.0.26',
player: {
togglePlayMethod: 'listLoop',
highQuality: false,
isShowTaskProgess: true,
volume: 1,
mediaDeviceId: 'default',
isMediaDeviceRemovedStopPlay: false,
},
list: {
isShowAlbumName: true,
isShowSource: true,
prevSelectListId: 'default',
isSaveScrollLocation: true,
},
download: {
savePath: path.join(os.homedir(), 'Desktop'),
fileName: '歌名 - 歌手',
maxDownloadNum: 3,
isDownloadLrc: false,
isEmbedPic: true,
},
leaderboard: {
source: 'kw',
tabId: 'kwbiaosb',
},
songList: {
source: 'kg',
sortId: '5',
tagInfo: {
name: '默认',
id: null,
},
},
odc: {
isAutoClearSearchInput: false,
isAutoClearSearchList: false,
},
search: {
searchSource: 'kw',
tempSearchSource: 'kw',
isShowHotSearch: false,
isShowHistorySearch: false,
isFocusSearchBox: false,
},
network: {
proxy: {
enable: false,
host: '',
port: '',
username: '',
password: '',
},
},
tray: {
isShow: false,
isToTray: false,
},
windowSizeId: 2,
themeId: 0,
langId: 'cns',
sourceId: 'kw',
apiSource: 'temp',
sourceNameType: 'alias',
randomAnimate: true,
ignoreVersion: null,
isAgreePact: false,
}
const overwriteSetting = {
}
// 使用新年皮肤
if (new Date().getMonth() < 2) defaultSetting.themeId = 9
export { defaultSetting, overwriteSetting }
+2 -2
View File
@@ -1,6 +1,6 @@
import Vue from 'vue'
import keyBind from '../utils/keyBind'
import { rendererOn } from '../../common/ipc'
import { rendererOn, NAMES } from '../../common/ipc'
const eventHub = window.eventHub = new Vue()
@@ -12,7 +12,7 @@ eventHub.$on('bindKey', () => {
})
eventHub.$on('unbindKey', keyBind.unbindKey)
rendererOn('focus', () => {
rendererOn(NAMES.mainWindow.focus, () => {
keyBind.clearDownKeys()
eventHub.$emit('focus')
})
+15
View File
@@ -0,0 +1,15 @@
html(lang="cn")
head
meta(charset="UTF-8")
meta(name="viewport" content="width=device-width, initial-scale=1.0")
meta(http-equiv="X-UA-Compatible" content="ie=edge")
title 洛雪音乐助手
body
#root
//- if htmlWebpackPlugin.options.isProd
//- script.
//- window.__static = '!{require('path').join(htmlWebpackPlugin.options.__dirname, '/static').replace(/\\/g, '\\\\')}'
//- if !htmlWebpackPlugin.options.browser && htmlWebpackPlugin.options.isProd
script.
window.__static = require('path').join(__dirname, '/resources').replace(/\\/g, '\\\\')
+15
View File
@@ -0,0 +1,15 @@
{
"close": "关闭",
"back": "返回",
"lock": "锁定歌词",
"unlock": "解锁歌词",
"theme": "主题配色",
"font_increase": "增加字体大小",
"font_decrease": "减小字体大小",
"opactiy_increase": "减小透明度",
"opactiy_decrease": "增加透明度",
"lrc_active_zoom_on": "缩放当前播放的歌词",
"lrc_active_zoom_off": "取消缩放当前播放的歌词",
"win_top_on": "置顶歌词界面",
"win_top_off": "取消置顶歌词界面"
}
+1
View File
@@ -8,6 +8,7 @@
"theme_purple": "重斤球紫",
"theme_grey": "灰常美丽",
"theme_ming": "青出于黑",
"theme_blue2": "清热版蓝",
"theme_mid_autumn": "月里嫦娥",
"theme_naruto": "木叶之村",
"theme_happy_new_year": "新年快乐",
+5
View File
@@ -41,6 +41,11 @@
"play_mediaDevice_remove_stop_play": "音频输出设备被改变时是否暂停播放",
"play_mediaDevice_remove_stop_play_title": "当前的声音输出设备被改变时是否暂停播放歌曲",
"desktop_lyric": "桌面歌词设置",
"desktop_lyric_enable": "显示歌词",
"desktop_lyric_lock": "锁定歌词",
"desktop_lyric_always_on_top": "使歌词总是在其他窗口之上",
"search": "搜索设置",
"search_hot_title": "是否显示热门搜索",
"search_hot": "热门搜索",
+15
View File
@@ -0,0 +1,15 @@
{
"close": "關閉",
"back": "返回",
"lock": "鎖定歌詞",
"unlock": "解鎖歌詞",
"theme": "主題配色",
"font_increase": "增加字體大小",
"font_decrease": "減小字體大小",
"opactiy_increase": "減小透明度",
"opactiy_decrease": "增加透明度",
"lrc_active_zoom_on": "縮放當前播放的歌詞",
"lrc_active_zoom_off": "取消縮放當前播放的歌詞",
"win_top_on": "置頂歌詞界面",
"win_top_off": "取消置頂歌詞界面"
}
+1
View File
@@ -8,6 +8,7 @@
"theme_purple": "重斤球紫",
"theme_grey": "灰常美麗",
"theme_ming": "青出於黑",
"theme_blue2": "清熱版藍",
"theme_mid_autumn": "月裡嫦娥",
"theme_naruto": "木葉之村",
"theme_happy_new_year": "新年快樂",
+4
View File
@@ -39,6 +39,10 @@
"play_mediaDevice": "音頻輸出",
"play_mediaDevice_remove_stop_play": "音頻輸出設備被改變時是否暫停播放",
"play_mediaDevice_remove_stop_play_title": "當前的聲音輸出設備被改變時是否暫停播放歌曲",
"desktop_lyric": "桌面歌詞設置",
"desktop_lyric_enable": "顯示歌詞",
"desktop_lyric_lock": "鎖定歌詞",
"desktop_lyric_always_on_top": "使歌詞總是在其他窗口之上",
"search": "搜索設置",
"search_hot_title": "是否顯示熱門搜索",
"search_hot": "熱門搜索",
+15
View File
@@ -0,0 +1,15 @@
{
"close": "Close",
"back": "Back",
"lock": "Lock Lyrics",
"unlock": "Unlock Lyrics",
"theme": "Theme Color",
"font_increase": "Increase font size",
"font_decrease": "Reduce font size",
"opactiy_increase": "Decrease Transparency",
"opactiy_decrease": "Increase Transparency",
"lrc_active_zoom_on": "Zoom the currently playing lyrics",
"lrc_active_zoom_off": "Unzoom the currently playing lyrics",
"win_top_on": "Top lyrics interface",
"win_top_off": "Cancel the top lyrics interface"
}
+1
View File
@@ -8,6 +8,7 @@
"theme_purple": "Purple",
"theme_grey": "Grey",
"theme_ming": "Ming",
"theme_blue2": "Purple Blue",
"theme_mid_autumn": "Mid-Autumn",
"theme_naruto": "Naruto",
"theme_happy_new_year": "New Year",
+5
View File
@@ -41,6 +41,11 @@
"play_mediaDevice_remove_stop_play": "Whether to pause playback when the audio output device is changed",
"play_mediaDevice_remove_stop_play_title": "Whether to pause the song when the current sound output device is changed",
"desktop_lyric": "Desktop Lyric Settings",
"desktop_lyric_enable": "Display lyrics",
"desktop_lyric_lock": "Lock lyrics",
"desktop_lyric_always_on_top": "Make the lyrics always above other windows",
"search": "Search",
"search_hot_title": "Select whether to show popular searches",
"search_hot": "Top Searches",
+3
View File
@@ -51,4 +51,7 @@ export default {
setPrevSelectListId(state, val) {
state.setting.list.prevSelectListId = val
},
setDesktopLyricConfig(state, config) {
state.setting.desktopLyric = Object.assign(state.setting.desktopLyric, config)
},
}
+9 -33
View File
@@ -1,47 +1,18 @@
// const isDev = process.env.NODE_ENV === 'development'
import Store from 'electron-store'
import { updateSetting } from '../utils'
import { windowSizeList } from '../../common/config'
import { version } from '../../../package.json'
const electronStore_list = window.electronStore_list = new Store({
window.electronStore_list = new Store({
name: 'playList',
})
const electronStore_config = window.electronStore_config = new Store({
name: 'config',
})
let setting = electronStore_config.get('setting')
if (!electronStore_config.get('version') && setting) { // 迁移配置
electronStore_config.set('version', electronStore_config.get('setting.version'))
electronStore_config.delete('setting.version')
const list = electronStore_config.get('list')
if (list) {
if (list.defaultList) electronStore_list.set('defaultList', list.defaultList)
if (list.loveList) electronStore_list.set('loveList', list.loveList)
electronStore_config.delete('list')
}
const downloadList = electronStore_config.get('download')
if (downloadList) {
if (downloadList.list) electronStore_list.set('downloadList', downloadList.list)
electronStore_config.delete('download')
}
}
let settingVersion = electronStore_config.get('version')
// 迁移列表滚动位置设置 ^0.18.3
if (setting && setting.list.scroll) {
let scroll = setting.list.scroll
const electronStore_list = window.electronStore_list = new Store({
name: 'playList',
})
electronStore_list.set('defaultList.location', scroll.locations.defaultList || 0)
electronStore_list.set('loveList.location', scroll.locations.loveList || 0)
electronStore_config.delete('setting.list.scroll')
electronStore_config.set('setting.list.isSaveScrollLocation', scroll.enable)
}
const { version: settingVersion, setting: newSetting } = updateSetting(setting, electronStore_config.get('version'))
electronStore_config.set('version', settingVersion)
electronStore_config.set('setting', setting)
process.versions.app = version
window.i18n.locale = setting.langId
@@ -93,6 +64,11 @@ export default {
name: '青出于黑',
class: 'ming',
},
{
id: 12,
name: '青出于黑',
class: 'blue2',
},
{
id: 7,
name: '月里嫦娥',
@@ -122,7 +98,7 @@ export default {
downloadProgress: null,
},
userInfo: null,
setting: newSetting,
setting,
settingVersion,
windowSizeList,
+16 -46
View File
@@ -1,9 +1,7 @@
import fs from 'fs'
import { shell, clipboard } from 'electron'
import crypto from 'crypto'
import { rendererSend, rendererInvoke } from '../../common/ipc'
import { defaultSetting, overwriteSetting } from '../config/defaultSetting'
import apiSource from '../config/api-source'
import { rendererSend, rendererInvoke, NAMES } from '../../common/ipc'
/**
* 获取两个数之间的随机整数,大于等于min,小于max
@@ -133,13 +131,13 @@ export const checkPath = (path) => new Promise(resolve => {
* 选择路径
* @param {*} 选项
*/
export const selectDir = options => rendererInvoke('selectDir', options)
export const selectDir = options => rendererInvoke(NAMES.mainWindow.select_dir, options)
/**
* 打开保存对话框
* @param {*} 选项
*/
export const openSaveDir = options => rendererInvoke('showSaveDialog', options)
export const openSaveDir = options => rendererInvoke(NAMES.mainWindow.show_save_dialog, options)
/**
* 在资源管理器中打开目录
@@ -176,20 +174,21 @@ export const isObject = item => item && typeof item === 'object' && !Array.isArr
/**
* 对象深度合并
* 注意:循环引用的对象会出现死循环
* @param {} target 要合并源对象
* @param {} source 要合并目标对象
*/
export const objectDeepMerge = (target, source) => {
export const objectDeepMerge = (target, source, mergedObj) => {
if (!mergedObj) {
mergedObj = new Set()
mergedObj.add(target)
}
let base = {}
Object.keys(source).forEach(item => {
if (Array.isArray(source[item])) {
let arr = Array.isArray(target[item]) ? target[item] : []
target[item] = arr.concat(source[item])
return
} else if (isObject(source[item])) {
if (isObject(source[item])) {
if (mergedObj.has(source[item])) return
if (!isObject(target[item])) target[item] = {}
objectDeepMerge(target[item], source[item])
mergedObj.add(source[item])
objectDeepMerge(target[item], source[item], mergedObj)
return
}
base[item] = source[item]
@@ -197,35 +196,6 @@ export const objectDeepMerge = (target, source) => {
Object.assign(target, base)
}
/**
* 升级设置
* @param {*} setting
*/
export const updateSetting = (setting, version) => {
const defaultVersion = defaultSetting.version
if (!version) {
if (setting) {
version = setting.version
delete setting.version
}
}
if (!setting) {
setting = defaultSetting
} else if (checkVersion(version, defaultVersion)) {
objectDeepMerge(defaultSetting, setting)
objectDeepMerge(defaultSetting, overwriteSetting)
setting = defaultSetting
}
if (!apiSource.some(api => api.id === setting.apiSource && !api.disabled)) {
let api = apiSource.find(api => !api.disabled)
if (api) setting.apiSource = api.id
}
return { setting, version: defaultVersion }
}
/**
* 在浏览器打开URL
* @param {*} url
@@ -267,7 +237,7 @@ export const clipboardReadText = str => clipboard.readText()
* @param {*} meta
*/
export const setMeta = (filePath, meta) => {
rendererSend('setMusicMeta', { filePath, meta })
rendererSend(NAMES.mainWindow.set_music_meta, { filePath, meta })
}
/**
@@ -357,19 +327,19 @@ export const findParentNode = (target, tagName) => target.tagName == tagName ? t
/**
* 获取缓存大小
*/
export const getCacheSize = () => rendererInvoke('getCacheSize')
export const getCacheSize = () => rendererInvoke(NAMES.mainWindow.get_cache_size)
/**
* 清除缓存
*/
export const clearCache = () => rendererInvoke('clearCache')
export const clearCache = () => rendererInvoke(NAMES.mainWindow.clear_cache)
/**
* 设置窗口大小
* @param {*} width
* @param {*} height
*/
export const setWindowSize = (width, height) => rendererSend('setWindowSize', { width, height })
export const setWindowSize = (width, height) => rendererSend(NAMES.mainWindow.set_window_size, { width, height })
export const getProxyInfo = () => window.globalObj.proxy.enable
@@ -1,6 +1,6 @@
// Support qualitys: 128k 320k flac wav
export default [
module.exports = [
{
id: 'test',
name: '测试接口',
+2 -2
View File
@@ -1,9 +1,9 @@
import apiSource from '../../config/api-source'
import apiSourceInfo from './api-source-info'
const apiList = {}
const supportQuality = {}
for (const api of apiSource) {
for (const api of apiSourceInfo) {
supportQuality[api.id] = api.supportQualitys
for (const source of Object.keys(api.supportQualitys)) {
apiList[`${api.id}_api_${source}`] = require(`./${source}/api-${api.id}`).default
+1 -1
View File
@@ -7,7 +7,7 @@ export default {
_requestObj_list: null,
_requestObj_listRecommend: null,
_requestObj_listDetail: null,
limit_list: 20,
limit_list: 30,
limit_song: 10000,
successCode: 22000,
sortList: [
+1 -1
View File
@@ -7,7 +7,7 @@ export default {
_requestObj_hotTags: null,
_requestObj_list: null,
_requestObj_listDetail: null,
limit_list: 25,
limit_list: 36,
limit_song: 10000,
successCode: 200,
sortList: [
+2 -2
View File
@@ -1,5 +1,5 @@
import { httpGet } from '../../request'
import { rendererInvoke } from '../../../../common/ipc'
import { rendererInvoke, NAMES } from '../../../../common/ipc'
if (!window.kw_token) {
window.kw_token = {
@@ -34,4 +34,4 @@ export const getToken = () => new Promise((resolve, reject) => {
})
})
export const decodeLyric = base64Data => rendererInvoke('kw_decodeLyric', base64Data)
export const decodeLyric = base64Data => rendererInvoke(NAMES.mainWindow.handle_kw_decode_lyric, base64Data)
+1 -1
View File
@@ -1,6 +1,6 @@
import { httpFetch } from '../../request'
import { weapi } from './utils/crypto'
import { formatPlayTime, sizeFormate } from '../../.'
import { formatPlayTime, sizeFormate } from '../..'
// https://github.com/Binaryify/NeteaseCloudMusicApi/blob/master/module/song_detail.js
export default {
+3 -3
View File
@@ -1,7 +1,7 @@
import { httpGet, httpFetch } from '../../request'
import { toMD5 } from '../../index'
// import crateIsg from './isg'
import { rendererInvoke } from '../../../../common/ipc'
import { rendererInvoke, NAMES } from '../../../../common/ipc'
if (!window.xm_token) {
let data = window.localStorage.getItem('xm_token')
@@ -96,7 +96,7 @@ export const xmRequest = (path, params = '') => {
if (resp.body.code !== 'SUCCESS' && resp.body.rgv587_flag == 'sm') {
window.globalObj.xm.isShowVerify = true
return wait(300).then(() => {
return rendererInvoke('xm_verify_open', 'https:' + resp.body.url).then(x5sec => {
return rendererInvoke(NAMES.mainWindow.handle_xm_verify_open, 'https:' + resp.body.url).then(x5sec => {
handleSaveToken({ cookies: { x5sec } })
// console.log(x5sec)
window.globalObj.xm.isShowVerify = false
@@ -117,6 +117,6 @@ export const xmRequest = (path, params = '') => {
export const closeVerifyModal = async() => {
if (!window.globalObj.xm.isShowVerify) return
await rendererInvoke('xm_verify_close')
await rendererInvoke(NAMES.mainWindow.handle_xm_verify_close)
window.globalObj.xm.isShowVerify = false
}
+14 -17
View File
@@ -14,11 +14,11 @@
li(:class="[$style.listsItem, item.id == tabId ? $style.active : null]" :title="item.name" v-for="item in boardList" :key="item.id" @click="handleToggleList(item.id)")
span(:class="$style.listsLabel") {{item.name}}
div(:class="$style.list")
material-song-list(v-model="selectdData" :rowWidth="{r1: '5%', r2: 'auto', r3: '22%', r4: '22%', r5: '9%', r6: '15%'}" @action="handleSongListAction" :source="source" :page="page" :limit="info.limit" :total="info.total" :noItem="$t('material.song_list.loding_list')" :list="list")
material-song-list(v-model="selectedData" :rowWidth="{r1: '5%', r2: 'auto', r3: '22%', r4: '22%', r5: '9%', r6: '15%'}" @action="handleSongListAction" :source="source" :page="page" :limit="info.limit" :total="info.total" :noItem="$t('material.song_list.loding_list')" :list="list")
material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectdData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectedData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
material-list-add-modal(:show="isShowListAdd" :musicInfo="musicInfo" @close="isShowListAdd = false")
material-list-add-multiple-modal(:show="isShowListAddMultiple" :musicList="selectdData" @close="handleListAddModalClose")
material-list-add-multiple-modal(:show="isShowListAddMultiple" :musicList="selectedData" @close="handleListAddModalClose")
</template>
<script>
@@ -32,7 +32,7 @@ export default {
page: 1,
isShowDownload: false,
musicInfo: null,
selectdData: [],
selectedData: [],
isShowDownloadMultiple: false,
isShowListAdd: false,
isShowListAddMultiple: false,
@@ -101,7 +101,7 @@ export default {
handleMenuClick(info) {
switch (info.action) {
case 'download':
if (this.selectdData.length) {
if (this.selectedData.length) {
this.isShowDownloadMultiple = true
} else {
this.musicInfo = this.list[info.index]
@@ -111,13 +111,17 @@ export default {
}
break
case 'play':
if (this.selectedData.length) {
this.listAddMultiple({ id: 'default', list: this.selectedData })
this.resetSelect()
}
this.testPlay(info.index)
break
case 'search':
this.handleSearch(info.index)
break
case 'addTo':
if (this.selectdData.length) {
if (this.selectedData.length) {
this.$nextTick(() => {
this.isShowListAddMultiple = true
})
@@ -131,15 +135,8 @@ export default {
}
},
testPlay(index) {
let targetSong
if (index == null) {
targetSong = this.selectdData[0]
this.listAddMultiple({ id: 'default', list: this.selectdData })
this.resetSelect()
} else {
targetSong = this.list[index]
this.listAdd({ id: 'default', musicInfo: targetSong })
}
let targetSong = this.list[index]
this.listAdd({ id: 'default', musicInfo: targetSong })
let targetIndex = this.defaultList.list.findIndex(
s => s.songmid === targetSong.songmid,
)
@@ -170,7 +167,7 @@ export default {
},
handleAddDownloadMultiple(type) {
if (this.source == 'xm' && type == 'flac') type = 'wav'
this.createDownloadMultiple({ list: [...this.selectdData], type })
this.createDownloadMultiple({ list: [...this.selectedData], type })
this.isShowDownloadMultiple = false
this.resetSelect()
},
@@ -212,7 +209,7 @@ export default {
this.tabId = id
},
resetSelect() {
this.selectdData = []
this.selectedData = []
},
},
}
+8 -5
View File
@@ -777,6 +777,8 @@ export default {
display: flex;
position: relative;
}
@lists-item-height: 36px;
.lists {
flex: none;
width: 16%;
@@ -857,18 +859,19 @@ export default {
}
.listsLabel {
display: block;
height: 36px;
height: @lists-item-height;
padding: 0 10px;
font-size: 13px;
line-height: 36px;
line-height: @lists-item-height;
.mixin-ellipsis-1;
}
.listsInput {
width: 100%;
height: 36px;
height: @lists-item-height;
border: none;
padding: 0;
line-height: 36px;
// padding-bottom: 1px;
line-height: @lists-item-height;
background: none;
outline: none;
font-size: 13px;
@@ -884,7 +887,7 @@ export default {
}
}
.newLeave {
margin-top: -36px;
margin-top: -@lists-item-height;
z-index: -1;
}
+25 -27
View File
@@ -52,10 +52,10 @@
div(v-else :class="$style.noitem_list")
p {{$t('view.search.no_item')}}
material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectdData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectedData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
//- material-flow-btn(:show="isShowEditBtn && (searchSourceId == 'all' || assertApiSupport(searchSourceId))" :remove-btn="false" @btn-click="handleFlowBtnClick")
material-list-add-modal(:show="isShowListAdd" :musicInfo="musicInfo" @close="handleListAddModalClose")
material-list-add-multiple-modal(:show="isShowListAddMultiple" :musicList="selectdData" @close="handleListAddMultipleModalClose")
material-list-add-multiple-modal(:show="isShowListAddMultiple" :musicList="selectedData" @close="handleListAddMultipleModalClose")
material-menu(:menus="listItemMenu" :location="listMenu.menuLocation" item-name="name" :isShow="listMenu.isShowItemMenu" @menu-click="handleListItemMenuClick")
</template>
@@ -73,7 +73,7 @@ export default {
clickIndex: -1,
isShowDownload: false,
musicInfo: null,
selectdData: [],
selectedData: [],
// isShowEditBtn: false,
isShowDownloadMultiple: false,
searchSourceId: null,
@@ -133,7 +133,7 @@ export default {
this.handleGetHotSearch()
},
watch: {
// selectdData(n) {
// selectedData(n) {
// const len = n.length
// if (len) {
// this.isShowEditBtn = true
@@ -277,8 +277,8 @@ export default {
},
handleSelectData(event, clickIndex) {
if (this.keyEvent.isShiftDown) {
if (this.selectdData.length) {
let lastSelectIndex = this.listInfo.list.indexOf(this.selectdData[this.selectdData.length - 1])
if (this.selectedData.length) {
let lastSelectIndex = this.listInfo.list.indexOf(this.selectedData[this.selectedData.length - 1])
this.removeAllSelect()
if (lastSelectIndex != clickIndex) {
let isNeedReverse = false
@@ -288,8 +288,8 @@ export default {
clickIndex = temp
isNeedReverse = true
}
this.selectdData = this.listInfo.list.slice(lastSelectIndex, clickIndex + 1)
if (isNeedReverse) this.selectdData.reverse()
this.selectedData = this.listInfo.list.slice(lastSelectIndex, clickIndex + 1)
if (isNeedReverse) this.selectedData.reverse()
let nodes = this.$refs.dom_tbody.childNodes
do {
nodes[lastSelectIndex].classList.add('active')
@@ -298,22 +298,22 @@ export default {
}
} else {
event.currentTarget.classList.add('active')
this.selectdData.push(this.listInfo.list[clickIndex])
this.selectedData.push(this.listInfo.list[clickIndex])
}
} else if (this.keyEvent.isModDown) {
let item = this.listInfo.list[clickIndex]
let index = this.selectdData.indexOf(item)
let index = this.selectedData.indexOf(item)
if (index < 0) {
this.selectdData.push(item)
this.selectedData.push(item)
event.currentTarget.classList.add('active')
} else {
this.selectdData.splice(index, 1)
this.selectedData.splice(index, 1)
event.currentTarget.classList.remove('active')
}
} else if (this.selectdData.length) this.removeAllSelect()
} else if (this.selectedData.length) this.removeAllSelect()
},
removeAllSelect() {
this.selectdData = []
this.selectedData = []
let dom_tbody = this.$refs.dom_tbody
if (!dom_tbody) return
let nodes = dom_tbody.querySelectorAll('.active')
@@ -322,15 +322,9 @@ export default {
}
},
testPlay(index) {
let targetSong
if (index == null) {
targetSong = this.selectdData[0]
this.listAddMultiple({ id: 'default', list: this.filterList(this.selectdData) })
} else {
if (!this.assertApiSupport(this.listInfo.list[index].source)) return
targetSong = this.listInfo.list[index]
this.listAdd({ id: 'default', musicInfo: targetSong })
}
let targetSong = this.listInfo.list[index]
// if (!targetSong || !this.assertApiSupport(targetSong.source)) return
this.listAdd({ id: 'default', musicInfo: targetSong })
let targetIndex = this.defaultList.list.findIndex(
s => s.songmid === targetSong.songmid,
)
@@ -349,13 +343,13 @@ export default {
this.isShowDownload = false
},
handleAddDownloadMultiple(type) {
this.createDownloadMultiple({ list: this.filterList(this.selectdData), type })
this.createDownloadMultiple({ list: this.filterList(this.selectedData), type })
this.removeAllSelect()
this.isShowDownloadMultiple = false
},
handleSelectAllData() {
this.removeAllSelect()
this.selectdData = [...this.listInfo.list]
this.selectedData = [...this.listInfo.list]
let nodes = this.$refs.dom_tbody.childNodes
for (const node of nodes) {
node.classList.add('active')
@@ -441,10 +435,14 @@ export default {
let minfo
switch (action && action.action) {
case 'play':
if (this.selectedData.length) {
this.listAddMultiple({ id: 'default', list: this.filterList(this.selectedData) })
this.removeAllSelect()
}
this.testPlay(index)
break
case 'addTo':
if (this.selectdData.length) {
if (this.selectedData.length) {
this.$nextTick(() => {
this.isShowListAddMultiple = true
})
@@ -456,7 +454,7 @@ export default {
}
break
case 'download':
if (this.selectdData.length) {
if (this.selectedData.length) {
this.isShowDownloadMultiple = true
} else {
minfo = this.listInfo.list[index]
+37 -15
View File
@@ -25,7 +25,7 @@ div.scroll(:class="$style.setting")
dd(:title="$t('view.setting.basic_to_tray_title')")
h3 {{$t('view.setting.basic_to_tray')}}
div
material-checkbox(id="setting_to_tray" v-model="current_setting.tray.isToTray" @change="handleToTrayChange" :label="$t('view.setting.is_enable')")
material-checkbox(id="setting_to_tray" v-model="current_setting.tray.isToTray" :label="$t('view.setting.is_enable')")
dd(:title="$t('view.setting.basic_window_size_title')")
h3 {{$t('view.setting.basic_window_size')}}
@@ -68,7 +68,14 @@ div.scroll(:class="$style.setting")
h3 {{$t('view.setting.play_mediaDevice')}}
div
material-selection(:list="mediaDevices" :class="$style.gapLeft" v-model="current_setting.player.mediaDeviceId" item-key="deviceId" item-name="label")
dt {{$t('view.setting.desktop_lyric')}}
dd
div(:class="$style.gapTop")
material-checkbox(id="setting_desktop_lyric_enable" v-model="current_setting.desktopLyric.enable" :label="$t('view.setting.desktop_lyric_enable')")
div(:class="$style.gapTop")
material-checkbox(id="setting_desktop_lyric_lock" v-model="current_setting.desktopLyric.isLock" :label="$t('view.setting.desktop_lyric_lock')")
div(:class="$style.gapTop")
material-checkbox(id="setting_desktop_lyric_alwaysOnTop" v-model="current_setting.desktopLyric.isAlwaysOnTop" :label="$t('view.setting.desktop_lyric_always_on_top')")
dt {{$t('view.setting.search')}}
dd(:title="$t('view.setting.search_hot_title')")
h3 {{$t('view.setting.search_hot')}}
@@ -221,7 +228,6 @@ import {
openDirInExplorer,
selectDir,
openSaveDir,
updateSetting,
openUrl,
clipboardWriteText,
getCacheSize,
@@ -229,8 +235,9 @@ import {
sizeFormate,
setWindowSize,
} from '../utils'
import { rendererSend } from '../../common/ipc'
import apiSource from '../config/api-source'
import { rendererSend, NAMES } from '../../common/ipc'
import { mergeSetting } from '../../common/utils'
import apiSourceInfo from '../utils/music/api-source-info'
import fs from 'fs'
import languageList from '@/lang/languages.json'
@@ -268,7 +275,7 @@ export default {
]
},
apiSources() {
return apiSource.map(api => ({
return apiSourceInfo.map(api => ({
id: api.id,
label: this.$t('view.setting.basic_source_' + api.id) || api.name,
disabled: api.disabled,
@@ -314,6 +321,20 @@ export default {
mediaDeviceId: 'default',
isMediaDeviceRemovedStopPlay: false,
},
desktopLyric: {
enable: false,
isLock: false,
width: 600,
height: 700,
x: -1,
y: -1,
theme: '',
style: {
fontSize: 125,
opacity: 80,
isZoomActiveLrc: true,
},
},
list: {
isShowAlbumName: true,
isShowSource: true,
@@ -366,6 +387,7 @@ export default {
current_setting: {
handler(n, o) {
if (!this.settingVersion) return
if (JSON.stringify(this.setting) === JSON.stringify(n)) return
this.setSetting(JSON.parse(JSON.stringify(n)))
},
deep: true,
@@ -379,7 +401,7 @@ export default {
'current_setting.player.isShowTaskProgess'(n) {
if (n) return
this.$nextTick(() => {
rendererSend('progress', {
rendererSend(NAMES.mainWindow.progress, {
status: -1,
mode: 'normal',
})
@@ -388,10 +410,12 @@ export default {
},
mounted() {
navigator.mediaDevices.addEventListener('devicechange', this.getMediaDevice)
window.eventHub.$on('set_config', this.handleUpdateSetting)
this.init()
},
beforeDestroy() {
navigator.mediaDevices.removeEventListener('devicechange', this.getMediaDevice)
window.eventHub.$off('set_config', this.handleUpdateSetting)
},
methods: {
...mapMutations(['setSetting', 'setSettingVersion', 'setVersionModalVisible']),
@@ -424,7 +448,7 @@ export default {
return
}
if (settingData.type !== 'setting') return
const { version: settingVersion, setting } = updateSetting(settingData.data)
const { version: settingVersion, setting } = mergeSetting(settingData.data)
setting.isAgreePact = false
this.refreshSetting(setting, settingVersion)
},
@@ -478,7 +502,7 @@ export default {
return
}
if (allData.type !== 'allData') return
const { version: settingVersion, setting } = updateSetting(allData.setting)
const { version: settingVersion, setting } = mergeSetting(allData.setting)
setting.isAgreePact = false
this.refreshSetting(setting, settingVersion)
@@ -610,7 +634,6 @@ export default {
}
this.init()
this.handleLangChange(this.current_setting.langId)
this.handleToTrayChange()
},
handleLangChange(id) {
this.$i18n.locale = id
@@ -621,13 +644,12 @@ export default {
this.mediaDevices = audioDevices
// console.log(this.mediaDevices)
},
handleToTrayChange(isToTray) {
if (isToTray != null) this.current_setting.tray.isShow = isToTray
rendererSend('changeTray', this.current_setting.tray)
},
handleShowPact() {
window.globalObj.isShowPact = true
},
handleUpdateSetting(config) {
this.current_setting = JSON.parse(JSON.stringify(config))
},
},
}
</script>
@@ -737,7 +759,7 @@ export default {
height: 100%;
border-radius: @radius-border;
background-position: center;
background-size: auto 100%;
background-size: cover;
background-repeat: no-repeat;
}
}
+62 -47
View File
@@ -3,8 +3,8 @@
transition(enter-active-class="animated-fast fadeIn" leave-active-class="animated-fast fadeOut")
div(:class="$style.songListDetailContent" v-if="isVisibleListDetail")
div(:class="$style.songListHeader")
div(:class="$style.songListHeaderLeft")
img(:src="listDetail.info.img || selectListInfo.img")
div(:class="$style.songListHeaderLeft" :style="{ backgroundImage: 'url('+(selectListInfo.img || listDetail.info.img)+')' }")
//- img(:src="listDetail.info.img || selectListInfo.img")
span(:class="$style.playNum" v-if="listDetail.info.play_count || selectListInfo.play_count") {{listDetail.info.play_count || selectListInfo.play_count}}
div(:class="$style.songListHeaderMiddle")
h3(:title="listDetail.info.name || selectListInfo.name") {{listDetail.info.name || selectListInfo.name}}
@@ -15,7 +15,7 @@
//- material-btn(:class="$style.closeDetailButton" :disabled="detailLoading" @click="playSongListDetail") 播放
//- | &nbsp;
material-btn(:class="$style.closeDetailButton" @click="hideListDetail") {{$t('view.song_list.back')}}
material-song-list(v-model="selectdData" @action="handleSongListAction" :source="source" :page="listDetail.page" :limit="listDetail.limit"
material-song-list(v-model="selectedData" @action="handleSongListAction" :source="source" :page="listDetail.page" :limit="listDetail.limit"
:total="listDetail.total" :noItem="isGetDetailFailed ? $t('view.song_list.loding_list_fail') : $t('view.song_list.loding_list')" :list="listDetail.list")
transition(enter-active-class="animated-fast fadeIn" leave-active-class="animated-fast fadeOut")
div(:class="$style.songListContainer" v-if="!isVisibleListDetail")
@@ -30,12 +30,13 @@
div.scroll(:class="$style.songList" v-if="sortId !== 'importSongList'" ref="dom_scrollContent")
ul
li(:class="$style.item" v-for="(item, index) in listData.list" @click="handleItemClick(index)")
div(:class="$style.left")
img(:src="item.img")
div(:class="$style.left" :style="{ backgroundImage: 'url('+item.img+')' }")
//- img(:src="item.img")
div(:class="$style.right" :src="item.img")
h4(:title="item.name") {{item.name}}
p(:title="item.desc") {{item.desc}}
li(:class="$style.item" style="cursor: default;" v-if="listData.list && listData.list.length && listData.list.length % 3 == 2")
p(:class="$style.play_count") {{item.play_count}}
p(:class="$style.author") {{item.author}}
li(:class="$style.item" style="cursor: default;" v-for="i in spaceNum")
div(:class="$style.pagination")
material-pagination(:count="listData.total" :limit="listData.limit" :page="listData.page" @btn-click="handleToggleListPage")
transition(enter-active-class="animated-fast fadeIn" leave-active-class="animated-fast fadeOut")
@@ -53,9 +54,9 @@
div(v-show="!listData.list.length" :class="$style.noitem")
p {{$t('view.song_list.loding_list')}}
material-download-modal(:show="isShowDownload" :musicInfo="musicInfo" @select="handleAddDownload" @close="isShowDownload = false")
material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectdData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
material-download-multiple-modal(:show="isShowDownloadMultiple" :list="selectedData" @select="handleAddDownloadMultiple" @close="isShowDownloadMultiple = false")
material-list-add-modal(:show="isShowListAdd" :musicInfo="musicInfo" @close="isShowListAdd = false" :list-name="listDetail.info.name")
material-list-add-multiple-modal(:show="isShowListAddMultiple" :musicList="selectdData" @close="handleListAddModalClose" :list-name="listDetail.info.name")
material-list-add-multiple-modal(:show="isShowListAddMultiple" :musicList="selectedData" @close="handleListAddModalClose" :list-name="listDetail.info.name")
</template>
<script>
@@ -74,7 +75,7 @@ export default {
source: null,
isShowDownload: false,
musicInfo: null,
selectdData: [],
selectedData: [],
isShowDownloadMultiple: false,
isToggleSource: false,
isShowListAdd: false,
@@ -112,6 +113,10 @@ export default {
let tagInfo = this.tags[this.source]
return tagInfo ? [{ name: '热门标签', list: [...tagInfo.hotTag] }, ...tagInfo.tags] : []
},
spaceNum() {
let num = this.listData.list ? this.listData.list.length % 3 : 0
return num > 0 ? 3 - num : 0
},
},
watch: {
sortId(n, o) {
@@ -200,7 +205,7 @@ export default {
handleMenuClick(info) {
switch (info.action) {
case 'download':
if (this.selectdData.length) {
if (this.selectedData.length) {
this.isShowDownloadMultiple = true
} else {
this.musicInfo = this.listDetail.list[info.index]
@@ -210,13 +215,17 @@ export default {
}
break
case 'play':
if (this.selectedData.length) {
this.listAddMultiple({ id: 'default', list: this.filterList(this.selectedData) })
this.resetSelect()
}
this.testPlay(info.index)
break
case 'search':
this.handleSearch(info.index)
break
case 'addTo':
if (this.selectdData.length) {
if (this.selectedData.length) {
this.$nextTick(() => {
this.isShowListAddMultiple = true
})
@@ -230,16 +239,9 @@ export default {
}
},
testPlay(index) {
let targetSong
if (index == null) {
targetSong = this.selectdData[0]
this.listAddMultiple({ id: 'default', list: this.filterList(this.selectdData) })
this.resetSelect()
} else {
targetSong = this.listDetail.list[index]
if (!this.assertApiSupport(targetSong.source)) return
this.listAdd({ id: 'default', musicInfo: targetSong })
}
let targetSong = this.listDetail.list[index]
// if (!this.assertApiSupport(targetSong.source)) return
this.listAdd({ id: 'default', musicInfo: targetSong })
let targetIndex = this.defaultList.list.findIndex(
s => s.songmid === targetSong.songmid,
)
@@ -279,7 +281,7 @@ export default {
},
handleAddDownloadMultiple(type) {
if (this.source == 'xm' && type == 'flac') type = 'wav'
this.createDownloadMultiple({ list: this.filterList(this.selectdData), type })
this.createDownloadMultiple({ list: this.filterList(this.selectedData), type })
this.resetSelect()
this.isShowDownloadMultiple = false
},
@@ -321,7 +323,7 @@ export default {
}
},
resetSelect() {
this.selectdData = []
this.selectedData = []
},
hideListDetail() {
setTimeout(async() => {
@@ -441,11 +443,14 @@ export default {
flex: none;
margin-left: 5px;
width: 60px;
height: 60px;
position: relative;
img {
max-width: 100%;
max-height: 100%;
}
overflow: hidden;
border-radius: 4px;
background-position: center;
background-size: cover;
opacity: .9;
.play-num {
position: absolute;
bottom: 0;
@@ -515,36 +520,46 @@ export default {
}
.left {
flex: none;
width: 66px;
height: 66px;
width: 88px;
height: 88px;
display: flex;
img {
max-width: 100%;
max-height: 100%;
}
background-position: center;
background-size: cover;
border-radius: 4px;
overflow: hidden;
opacity: .9;
// box-shadow: 0 0 2px 0 rgba(0,0,0,.2);
}
.right {
flex: auto;
padding: 5px 15px 5px 7px;
padding: 3px 15px 5px 7px;
overflow: hidden;
h4 {
font-size: 14px;
height: 2.6em;
text-align: justify;
line-height: 1.2;
.mixin-ellipsis-1;
}
p {
margin-top: 12px;
font-size: 12px;
line-height: 1.3;
.mixin-ellipsis-2;
text-align: justify;
line-height: 1.2;
// text-indent: 24px;
color: @color-theme_2-font-label;
}
}
.play_count {
margin-top: 12px;
font-size: 12px;
.mixin-ellipsis-1;
text-align: justify;
line-height: 1.2;
// text-indent: 24px;
color: @color-theme_2-font-label;
}
.author {
margin-top: 6px;
font-size: 12px;
.mixin-ellipsis-1;
text-align: justify;
line-height: 1.2;
// text-indent: 24px;
color: @color-theme_2-font-label;
}
.pagination {
text-align: center;
padding: 15px 0;