diff --git a/src/components/ZoneMusic.vue b/src/components/ZoneMusic.vue index 3634bd6..e902bfc 100644 --- a/src/components/ZoneMusic.vue +++ b/src/components/ZoneMusic.vue @@ -22,7 +22,7 @@ diff --git a/src/hooks/useSpotify.ts b/src/hooks/useSpotify.ts index 2457743..e5ec113 100644 --- a/src/hooks/useSpotify.ts +++ b/src/hooks/useSpotify.ts @@ -20,9 +20,6 @@ export const useSpotify = (onPlay: () => void, onPause: () => void) => { const { accessToken, hasValidAccessToken } = useGetters< GetterTree >(['accessToken', 'hasValidAccessToken']) - const { setAccessToken, setTokenExpire, setHasSpotify } = useActions< - RootActions - >(['setAccessToken', 'setTokenExpire', 'setHasSpotify']) onMounted(() => { window.onSpotifyWebPlaybackSDKReady = async () => { @@ -40,26 +37,11 @@ export const useSpotify = (onPlay: () => void, onPause: () => void) => { ready.value = true }) spotify.player.addListener('player_state_changed', (state) => { - console.log('player state changed', state) if (!state) { return } !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() } import('@/lib/spotify-player') @@ -69,7 +51,6 @@ export const useSpotify = (onPlay: () => void, onPause: () => void) => { try { if (spotify.player && ready.value) { const playerState = await spotify.player.getCurrentState() - console.log(playerState) if (!playerState) { playOnSpotify(accessToken.value, deviceId.value) diff --git a/src/locales/en.json b/src/locales/en.json index b4569fb..adeee2f 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -11,6 +11,6 @@ }, "music": { "loading": "loading...", - "useSpotify": "For the best experience, use" + "useSpotify": "For a pure experience, connect to" } } diff --git a/src/locales/fr.json b/src/locales/fr.json index bae1ce4..787003b 100644 --- a/src/locales/fr.json +++ b/src/locales/fr.json @@ -11,6 +11,6 @@ }, "music": { "loading": "loading...", - "useSpotify": "Ayez une meilleure expérience avec" + "useSpotify": "Pour une meilleure expérience, utilisez" } } diff --git a/src/utils/spotify.ts b/src/utils/spotify.ts index a90b054..dc325f2 100644 --- a/src/utils/spotify.ts +++ b/src/utils/spotify.ts @@ -1,10 +1,27 @@ -const LOFI = 'spotify:playlist:0vvXsWCC9xrXsKd4FyS8kM' -const LOFI_MAX = 250 +const PLAYLIST_IDS = [ + 'spotify:playlist:0vvXsWCC9xrXsKd4FyS8kM', + 'spotify:playlist:5G1gAuXjmJHgEoI7XzrXOP', + 'spotify:playlist:5OJs7eATLrvZ2Ea9als3lK', + 'spotify:playlist:5NKv3Ucc0kqe1Me7CEdWty', + 'spotify:playlist:0jGkhFr4yxLlHnpRg2Njj4' +] + +interface SpotifyTracks { + items: Array<{ track: { name: string } }> +} const random = (max: number) => { return Math.floor(Math.random() * Math.floor(max)) } +const getHeaders = (token: string) => ({ + headers: { + accept: 'application/json', + 'content-type': 'application/json', + authorization: `Bearer ${token}` + } +}) + export const redirectToSpotifyConnect = () => { const authorizeURL = new URL('https://accounts.spotify.com/authorize') authorizeURL.searchParams.append( @@ -23,19 +40,21 @@ export const redirectToSpotifyConnect = () => { } export const playOnSpotify = async (token: string, deviceId: string) => { + const playlistId = PLAYLIST_IDS[random(PLAYLIST_IDS.length - 1)] + const trackResult = await fetch( + `https://api.spotify.com/v1/playlists/${playlistId}/tracks?fields=items(track(name))` + ) + const tracks = (await trackResult.json()) as SpotifyTracks + await fetch( `https://api.spotify.com/v1/me/player/play?device_id=${deviceId}`, { method: 'PUT', - headers: { - accept: 'application/json', - 'content-type': 'application/json', - authorization: `Bearer ${token}` - }, + ...getHeaders(token), body: JSON.stringify({ - context_uri: LOFI, + context_uri: PLAYLIST_IDS[random(PLAYLIST_IDS.length - 1)], offset: { - position: random(LOFI_MAX) + position: random(tracks?.items?.length || 0) } }) } @@ -47,11 +66,7 @@ export const pauseOnSpotify = async (token: string, deviceId: string) => { `https://api.spotify.com/v1/me/player/pause?device_id=${deviceId}`, { method: 'PUT', - headers: { - accept: 'application/json', - 'content-type': 'application/json', - authorization: `Bearer ${token}` - } + ...getHeaders(token) } ) }