MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-03-20 04:24:20 -04:00
Code Issues Packages Projects Releases Wiki Activity

[web-src] Show cover art in spotify album dialog

Browse Source
This commit is contained in:
chme 2018-12-19 13:13:29 +01:00
parent 1d5d6f4858
commit 63be54313f
1 changed files with 26 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
web-src/src/components/SpotifyModalDialogAlbum.vue
View File

@ -6,6 +6,9 @@
<div class="modal-content fd-modal-card"> <div class="modal-content fd-modal-card">
<div class="card"> <div class="card">
<div class="card-content"> <div class="card-content">
<figure class="image is-square fd-has-margin-bottom" v-show="artwork_visible">
<img :src="artwork_url" @load="artwork_loaded" @error="artwork_error" class="fd-has-shadow">
</figure>
<p class="title is-4"> <p class="title is-4">
<a class="has-text-link" @click="open_album">{{ album.name }}</a> <a class="has-text-link" @click="open_album">{{ album.name }}</a>
</p> </p>
@ -50,6 +53,21 @@ export default {
name: 'SpotifyModalDialogAlbum', name: 'SpotifyModalDialogAlbum',
props: [ 'show', 'album' ], props: [ 'show', 'album' ],
data () {
return {
artwork_visible: false
}
},
computed: {
artwork_url: function () {
if (this.album.images && this.album.images.length > 0) {
return this.album.images[0].url
}
return ''
}
},
methods: { methods: {
play: function () { play: function () {
this.$emit('close') this.$emit('close')
@ -76,6 +94,14 @@ export default {
open_artist: function () { open_artist: function () {
this.$router.push({ path: '/music/spotify/artists/' + this.album.artists[0].id }) this.$router.push({ path: '/music/spotify/artists/' + this.album.artists[0].id })
},
artwork_loaded: function () {
this.artwork_visible = true
},
artwork_error: function () {
this.artwork_visible = false
} }
} }
} }