feat: 保存player状态到本地存储

This commit is contained in:
qier222 2022-04-05 23:02:37 +08:00
parent 49bb849982
commit abedbe7531
No known key found for this signature in database
GPG key ID: 9C85007ED905F14D
2 changed files with 27 additions and 10 deletions

View file

@ -1,6 +1,6 @@
import { proxy, subscribe } from 'valtio'
import { devtools } from 'valtio/utils'
import { player as PlayerCore } from '@/utils/player'
import { Player } from '@/utils/player'
interface Store {
uiStates: {
@ -28,8 +28,12 @@ subscribe(state, () => {
localStorage.setItem('state', JSON.stringify(state))
})
export const player = proxy(PlayerCore)
player.init()
const playerInLocalStorage = localStorage.getItem('player')
export const player = proxy(new Player())
player.init((playerInLocalStorage && JSON.parse(playerInLocalStorage)) || {})
subscribe(player, () => {
localStorage.setItem('player', JSON.stringify(player))
})
if (import.meta.env.DEV) {
;(window as any).player = player

View file

@ -57,8 +57,21 @@ export class Player {
repeatMode: RepeatMode = RepeatMode.OFF
fmTrack: Track | null = null
init() {
init(params: { [key: string]: any }) {
if (params._track) this._track = params._track
if (params._trackIndex) this._trackIndex = params._trackIndex
if (params._volume) this._volume = params._volume
if (params.state) this.trackList = params.state
if (params.mode) this.mode = params.mode
if (params.trackList) this.trackList = params.trackList
if (params.trackListSource) this.trackListSource = params.trackListSource
if (params.fmTrackList) this.fmTrackList = params.fmTrackList
if (params.shuffle) this.shuffle = params.shuffle
if (params.repeatMode) this.repeatMode = params.repeatMode
if (params.fmTrack) this.fmTrack = params.fmTrack
this.state = State.READY
this._playAudio(false) // just load the audio, not play
this._initFM()
}
@ -189,7 +202,7 @@ export class Player {
/**
* Play audio via howler
*/
private async _playAudio() {
private async _playAudio(autoplay: boolean = true) {
this._progress = 0
const { audio, id } = await this._fetchAudioSource(this.trackID)
if (!audio) {
@ -202,13 +215,15 @@ export class Player {
src: [`${audio}?id=${id}`],
format: ['mp3', 'flac'],
html5: true,
autoplay: true,
autoplay,
volume: 1,
onend: () => this._howlerOnEndCallback(),
})
_howler = howler
this.play()
this.state = State.PLAYING
if (autoplay) {
this.play()
this.state = State.PLAYING
}
_howler.once('load', () => {
this._cacheAudio((_howler as any)._src)
})
@ -428,8 +443,6 @@ export class Player {
}
}
export const player = new Player()
if (import.meta.env.DEV) {
;(window as any).howler = _howler
}