[web] Display info text if spotify track is not playable

Additionally set market query parameter for albums and tracks. According to the spotify documentation, this should not be necessary, as the market for the user account should be used if not set.
This commit is contained in:
chme 2021-12-26 19:49:23 +01:00
parent 4bc8719aaa
commit 791d3610fd
3 changed files with 7 additions and 4 deletions

View File

@ -1,8 +1,11 @@
<template>
<div class="media">
<div class="media-content fd-has-action is-clipped" v-on:click="play">
<h1 class="title is-6">{{ track.name }}</h1>
<h2 class="subtitle is-7 has-text-grey"><b>{{ track.artists[0].name }}</b></h2>
<h1 class="title is-6" :class="{ 'has-text-grey-light': !track.is_playable }">{{ track.name }}</h1>
<h2 class="subtitle is-7" :class="{ 'has-text-grey': track.is_playable, 'has-text-grey-light': !track.is_playable }"><b>{{ track.artists[0].name }}</b></h2>
<h2 class="subtitle is-7" v-if="!track.is_playable">
(Track is not playable, restriction reason: {{ track.restrictions.reason }})
</h2>
</div>
<div class="media-right">
<slot name="actions"></slot>

View File

@ -54,7 +54,7 @@ const albumData = {
load: function (to) {
const spotifyApi = new SpotifyWebApi()
spotifyApi.setAccessToken(store.state.spotify.webapi_token)
return spotifyApi.getAlbum(to.params.album_id)
return spotifyApi.getAlbum(to.params.album_id, { market: store.state.spotify.webapi_country })
},
set: function (vm, response) {

View File

@ -60,7 +60,7 @@ const artistData = {
spotifyApi.setAccessToken(store.state.spotify.webapi_token)
return Promise.all([
spotifyApi.getArtist(to.params.artist_id),
spotifyApi.getArtistAlbums(to.params.artist_id, { limit: 50, offset: 0, include_groups: 'album,single' })
spotifyApi.getArtistAlbums(to.params.artist_id, { limit: 50, offset: 0, include_groups: 'album,single', market: store.state.spotify.webapi_country })
])
},