@@ -99,3 +98,5 @@ export const LyriceFlash = defineComponent({
)
}
})
+
+export default LyriceFlash
diff --git a/src/pages/footer/component/music-controller/index.tsx b/src/pages/footer/component/music-controller/index.tsx
index 6ef64e98..501dced2 100644
--- a/src/pages/footer/component/music-controller/index.tsx
+++ b/src/pages/footer/component/music-controller/index.tsx
@@ -1,11 +1,4 @@
-import {
- defineComponent,
- ref,
- toRefs,
- onMounted,
- watchEffect,
- computed
-} from 'vue'
+import { defineComponent, ref, toRefs, onMounted, computed } from 'vue'
import { uesModuleStore } from '@/hooks/index'
import { toFixed, formatTime } from '@/utils/index'
import { Block } from '@/components/process-bar/block'
@@ -17,8 +10,13 @@ import {
Size
} from '@/layout/module'
import './index.less'
+import { Platform } from '@/config/build'
+import { importIpc } from '@/electron/event/ipc-browser'
+import { Action } from '@/electron/event/action-types'
+import { ENV } from '@/interface/app'
const prefix = 'music'
+const { VUE_APP_PLATFORM } = window as ENV
export const MusicControl = defineComponent({
name: 'MusicControl',
@@ -65,8 +63,19 @@ export const MusicControl = defineComponent({
}
const handleVisibleFlash = () => {
- if (screenSize.value === Size.SM) {
- useMutations(Mutations.VISIBLE_FLASH, !visibleFlash.value)
+ if (VUE_APP_PLATFORM === Platform.BROWSER) {
+ if (screenSize.value === Size.SM) {
+ useMutations(Mutations.VISIBLE_FLASH, !visibleFlash.value)
+ }
+ }
+ if (VUE_APP_PLATFORM === Platform.ELECTRON) {
+ importIpc()
+ .then(event => {
+ event.sendSyncIpcRendererEvent(Action.CREATE_WINDOW)
+ })
+ .catch(e => {
+ console.log(e)
+ })
}
}
@@ -93,7 +102,9 @@ export const MusicControl = defineComponent({
if (audioElement.value && musicDetail.dt && !draging.value) {
const time = audioElement.value.currentTime
const width = toFixed((time / musicDetail.dt) * 100 * 1000, 6)
- currentIndicator.value = width > 100 ? 100 : width
+ if (width) {
+ currentIndicator.value = width > 100 ? 100 : width
+ }
useMutations(Mutations.UPDATE_CURRENT_TIME, time)
}
}
diff --git a/src/pages/footer/component/volume-history/index.tsx b/src/pages/footer/component/volume-history/index.tsx
index e8cd8fa9..0de2f71a 100644
--- a/src/pages/footer/component/volume-history/index.tsx
+++ b/src/pages/footer/component/volume-history/index.tsx
@@ -28,7 +28,9 @@ export const VolumeAndHistory = defineComponent({
const updateCurrent = (v: number) => {
current.value = v
const volume = toFixed(v / 100, 2)
- useMutations(Mutations.SET_VOLUME, volume < 0 ? 0 : volume)
+ if (volume) {
+ useMutations(Mutations.SET_VOLUME, volume < 0 ? 0 : volume)
+ }
}
return () => (
diff --git a/src/pages/footer/sage.ts b/src/pages/footer/sage.ts
index 409b5d23..8ae8d124 100644
--- a/src/pages/footer/sage.ts
+++ b/src/pages/footer/sage.ts
@@ -3,6 +3,9 @@ import { isNumber, timeTos, toFixed } from '@/utils/index'
import { getSongUrl, getSongDetail, getLyric } from './api/index'
import { State, Getter } from './state'
import { RootState } from '@/store/index'
+import { PostData } from './component/lyrice-flash/electron-lyrice'
+import { importIpc } from '@/electron/event/ipc-browser'
+import { Lyrice } from '@/electron/event/action-types'
export const enum Actions {
SET_MUSIC = 'SET_MUSIC_URL',
@@ -18,7 +21,8 @@ export const enum Mutations {
UPDATE_CURRENT_TIME = 'UPDATE_CURRENT_TIME',
CAN_PLAY = 'CAN_PLAY',
SET_VOLUME = 'SET_VOLUME',
- VISIBLE_FLASH = 'VISIBLE_FLASH'
+ VISIBLE_FLASH = 'VISIBLE_FLASH',
+ UPDATE_ELECTRON_LYRICE = 'UPDATE_electron_Lyrice'
}
const dominateMediaSession = (
title: string,
@@ -183,5 +187,18 @@ export const mutations: MutationTree = {
},
[Mutations.VISIBLE_FLASH](state, visible: boolean) {
state.visibleFlash = visible
+ },
+ [Mutations.UPDATE_ELECTRON_LYRICE](state, playond: PostData) {
+ state.electronLyrice = {
+ ...state.electronLyrice,
+ ...playond
+ }
+ importIpc().then(event => {
+ console.log('主窗口发送数据')
+ event.sendAsyncIpcRendererEvent(
+ Lyrice.LYRICE_UPDATE,
+ state.electronLyrice
+ )
+ })
}
}
diff --git a/src/pages/footer/state.ts b/src/pages/footer/state.ts
index 7e317658..a792f9c4 100644
--- a/src/pages/footer/state.ts
+++ b/src/pages/footer/state.ts
@@ -1,5 +1,7 @@
import { Artists, Albums, SongsDetail } from '@/interface/index'
import { AudioType, BackgroundAudio } from './component/music-controller/audio'
+import { PostData } from './component/lyrice-flash/electron-lyrice'
+import { Size } from '@/layout/module'
export interface Music {
id: number
@@ -29,6 +31,7 @@ export interface State {
audioElement: HTMLAudioElement | null
sourceElement: HTMLSourceElement | null
visibleFlash: boolean
+ electronLyrice: PostData
}
export const state: State = {
@@ -42,7 +45,17 @@ export const state: State = {
canplay: false,
audioElement: new Audio(),
sourceElement: null,
- visibleFlash: false
+ visibleFlash: false,
+ electronLyrice: {
+ screenSize: Size.SM,
+ visibleFlash: true,
+ lyrice: [],
+ index: 0,
+ playing: true,
+ flashMagic: {
+ animationDuration: ''
+ }
+ }
}
export interface Getter {
diff --git a/src/pages/footer/view/index.less b/src/pages/footer/view/index.less
index ca504787..02481186 100644
--- a/src/pages/footer/view/index.less
+++ b/src/pages/footer/view/index.less
@@ -30,6 +30,7 @@
.music-pic {
width: 62px;
height: 62px;
+ min-width: 62px;
margin-right: 10px;
border-radius: 4px;
background-size: contain;
@@ -39,6 +40,9 @@
}
}
&-des {
+ > div {
+ white-space: nowrap;
+ }
&--title {
font-size: 16px;
}
diff --git a/src/pages/footer/view/index.tsx b/src/pages/footer/view/index.tsx
index b27e55d7..0d363da6 100644
--- a/src/pages/footer/view/index.tsx
+++ b/src/pages/footer/view/index.tsx
@@ -1,4 +1,4 @@
-import { defineComponent, ref, toRefs, computed } from 'vue'
+import { defineComponent, ref, toRefs, computed, onMounted } from 'vue'
import { NAMESPACED, State, LayoutActions } from '@/layout/module'
import { uesModuleStore } from '@/hooks/index'
import { MusicControl } from '../component/music-controller'
@@ -19,12 +19,15 @@ import {
Size
} from '@/layout/module'
import { AsyncComponent } from '../component/lyrice/index'
-import { LyriceFlash } from '../component/lyrice-flash/index'
+import { BrowserLyriceFlash } from '../component/lyrice-flash/browser-lyrice'
+import { ENV } from '@/interface/app'
import classnames from 'classnames'
+import { Platform } from '@/config/build'
import './index.less'
// Fix JSX element type "AsyncComponent" does not have any construction signature or call signature.
const Com = AsyncComponent as any
+const { VUE_APP_PLATFORM } = window as ENV
export const Footer = defineComponent({
name: 'Footer',
@@ -79,8 +82,8 @@ export const Footer = defineComponent({
-
-
+
+
{/* Failed to locate Teleport target with selector "#cover-container" */}
{/* {} */}
diff --git a/src/pages/header/view/index.tsx b/src/pages/header/view/index.tsx
index 8eae2aec..e33dfdfb 100644
--- a/src/pages/header/view/index.tsx
+++ b/src/pages/header/view/index.tsx
@@ -1,7 +1,7 @@
import { defineComponent, ref } from 'vue'
import { Action } from '@/electron/event/action-types'
import { ENV } from '@/interface/app'
-import { IpcRenderer } from '@/electron/event/ipc-renderer'
+import { importIpc } from '@/electron/event/ipc-browser'
import { Logo } from '../component/logo'
import { PushShift } from '../component/push-shift'
import { Setting } from '../component/setting'
@@ -14,20 +14,12 @@ import './index.less'
const { VUE_APP_PLATFORM } = window as ENV
const actionToClass = {
[Action.CLOSE_WINDOW]: '',
+ [Action.CREATE_WINDOW]: '',
[Action.MAXIMIZE_WINDOW]: 'lg',
[Action.MINIMIZE_WINDOW]: 'sm',
[Action.RESTORE_WINDOW]: 'md'
}
-const importIpc = () => {
- return import('@/electron/event/ipc-renderer').then((v: IpcRenderer) => {
- return {
- sendAsyncIpcRendererEvent: v.sendAsyncIpcRendererEvent,
- sendSyncIpcRendererEvent: v.sendSyncIpcRendererEvent
- }
- })
-}
-
export const Header = defineComponent({
name: 'Header',
setup() {
diff --git a/src/router/index.ts b/src/router/index.ts
index 82d7ab89..0a72cdf9 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -16,6 +16,8 @@ export interface RouterChildren {
meta?: Meta
}
+export const LYRICE_PATH = '/electron-lyrice-flash'
+
// Internationalization is not currently supported
const baseRouter: RouteRecordRaw[] = [
{
@@ -23,8 +25,11 @@ const baseRouter: RouteRecordRaw[] = [
redirect: '/music'
},
{
- path: '/test',
- component: TestFull,
+ path: LYRICE_PATH,
+ component: () =>
+ import(
+ /* webpackChunkName: "layrice" */ '@/pages/footer/component/lyrice-flash/electron-lyrice'
+ ),
meta: {
full: true
}
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 5a176855..df05c0a1 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -72,7 +72,10 @@ export const isNumber = (n: unknown) => {
}
export const toFixed = (n: number, m: number) => {
- return Number(n.toFixed(m))
+ if (typeof n === 'number') {
+ return Number(n.toFixed(m))
+ }
+ return null
}
export const sleep = (n: number) => {
diff --git a/yarn.lock b/yarn.lock
index ff0eb1b5..9142741a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7155,7 +7155,7 @@ electron-to-chromium@^1.3.378, electron-to-chromium@^1.3.585:
resolved "https://registry.npm.taobao.org/electron-to-chromium/download/electron-to-chromium-1.3.588.tgz?cache=0&sync_timestamp=1604514816392&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Felectron-to-chromium%2Fdownload%2Felectron-to-chromium-1.3.588.tgz#c6515571737bfb42678115a5eaa818384593a9a5"
integrity sha1-xlFVcXN7+0JngRWl6qgYOEWTqaU=
-electron@^10.1.3:
+electron@^10.1.5:
version "10.1.5"
resolved "https://registry.npm.taobao.org/electron/download/electron-10.1.5.tgz#f2b161310f627063e73fbac44efcb35dece83a90"
integrity sha1-8rFhMQ9icGPnP7rETvyzXezoOpA=
@@ -16887,7 +16887,7 @@ void-elements@^3.1.0:
resolved "https://registry.npm.taobao.org/void-elements/download/void-elements-3.1.0.tgz#614f7fbf8d801f0bb5f0661f5b2f5785750e4f09"
integrity sha1-YU9/v42AHwu18GYfWy9XhXUOTwk=
-vue-cli-plugin-electron-builder@~2.0.0-rc.4:
+vue-cli-plugin-electron-builder@^2.0.0-rc.5:
version "2.0.0-rc.5"
resolved "https://registry.npm.taobao.org/vue-cli-plugin-electron-builder/download/vue-cli-plugin-electron-builder-2.0.0-rc.5.tgz#87cd8d09877f5f3ae339abc0bedc47d7d2b733ac"
integrity sha1-h82NCYd/XzrjOavAvtxH19K3M6w=