♻️ (spotify) simplify hook
This commit is contained in:
@@ -22,7 +22,7 @@
|
|||||||
<span v-t="'chill'"></span>
|
<span v-t="'chill'"></span>
|
||||||
<SpotifyMusic
|
<SpotifyMusic
|
||||||
v-if="hasSpotify"
|
v-if="hasSpotify"
|
||||||
:play="play"
|
:play="play && hasMusic"
|
||||||
@play="onPlay"
|
@play="onPlay"
|
||||||
@pause="onPause"
|
@pause="onPause"
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -20,9 +20,6 @@ export const useSpotify = (onPlay: () => void, onPause: () => void) => {
|
|||||||
const { accessToken, hasValidAccessToken } = useGetters<
|
const { accessToken, hasValidAccessToken } = useGetters<
|
||||||
GetterTree<State, State>
|
GetterTree<State, State>
|
||||||
>(['accessToken', 'hasValidAccessToken'])
|
>(['accessToken', 'hasValidAccessToken'])
|
||||||
const { setAccessToken, setTokenExpire, setHasSpotify } = useActions<
|
|
||||||
RootActions
|
|
||||||
>(['setAccessToken', 'setTokenExpire', 'setHasSpotify'])
|
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
window.onSpotifyWebPlaybackSDKReady = async () => {
|
window.onSpotifyWebPlaybackSDKReady = async () => {
|
||||||
@@ -40,26 +37,11 @@ export const useSpotify = (onPlay: () => void, onPause: () => void) => {
|
|||||||
ready.value = true
|
ready.value = true
|
||||||
})
|
})
|
||||||
spotify.player.addListener('player_state_changed', (state) => {
|
spotify.player.addListener('player_state_changed', (state) => {
|
||||||
console.log('player state changed', state)
|
|
||||||
if (!state) {
|
if (!state) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
!state.paused ? onPlay() : onPause()
|
!state.paused ? onPlay() : onPause()
|
||||||
})
|
})
|
||||||
spotify.player.addListener('not_ready', () => {
|
|
||||||
setAccessToken(null)
|
|
||||||
setTokenExpire(null)
|
|
||||||
setHasSpotify(false)
|
|
||||||
})
|
|
||||||
spotify.player.on('playback_error', (error) => {
|
|
||||||
console.error('Failed to perform playback', error)
|
|
||||||
})
|
|
||||||
spotify.player.on('account_error', (error) => {
|
|
||||||
console.error('account_error', error)
|
|
||||||
})
|
|
||||||
spotify.player.on('initialization_error', (error) => {
|
|
||||||
console.error('initialization_error', error)
|
|
||||||
})
|
|
||||||
await spotify.player.connect()
|
await spotify.player.connect()
|
||||||
}
|
}
|
||||||
import('@/lib/spotify-player')
|
import('@/lib/spotify-player')
|
||||||
@@ -69,7 +51,6 @@ export const useSpotify = (onPlay: () => void, onPause: () => void) => {
|
|||||||
try {
|
try {
|
||||||
if (spotify.player && ready.value) {
|
if (spotify.player && ready.value) {
|
||||||
const playerState = await spotify.player.getCurrentState()
|
const playerState = await spotify.player.getCurrentState()
|
||||||
console.log(playerState)
|
|
||||||
|
|
||||||
if (!playerState) {
|
if (!playerState) {
|
||||||
playOnSpotify(accessToken.value, deviceId.value)
|
playOnSpotify(accessToken.value, deviceId.value)
|
||||||
|
|||||||
@@ -11,6 +11,6 @@
|
|||||||
},
|
},
|
||||||
"music": {
|
"music": {
|
||||||
"loading": "loading...",
|
"loading": "loading...",
|
||||||
"useSpotify": "For the best experience, use"
|
"useSpotify": "For a pure experience, connect to"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -11,6 +11,6 @@
|
|||||||
},
|
},
|
||||||
"music": {
|
"music": {
|
||||||
"loading": "loading...",
|
"loading": "loading...",
|
||||||
"useSpotify": "Ayez une meilleure expérience avec"
|
"useSpotify": "Pour une meilleure expérience, utilisez"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user