mirror of
https://github.com/owntone/owntone-server.git
synced 2025-02-25 04:19:15 -05:00
[web] Add filter for Spotify content on "Artist Tracks" and "Artist Album" pages. Partially answer #1650
This commit is contained in:
parent
f657780a42
commit
04feda45c9
@ -262,8 +262,8 @@
|
||||
"hide-spotify-help": "Nach Aktivierung werden keine Alben angezeigt, die nur in der Spotify-Bibliothek enthalten sind.",
|
||||
"hide-spotify": "Verbirgt Spotify-Alben",
|
||||
"title": "Alben",
|
||||
"sort-by": {
|
||||
"title": "Sortieren nach",
|
||||
"sort": {
|
||||
"title": "Sortieren",
|
||||
"name": "Name",
|
||||
"recently-added": "Kürzlich hinzugefügt",
|
||||
"recently-released": "Kürzlich erschienen"
|
||||
@ -271,10 +271,13 @@
|
||||
},
|
||||
"artist": {
|
||||
"album-count": "{count} Album|{count} Album|{count} Alben",
|
||||
"filter": "Filter",
|
||||
"hide-spotify-help": "Nach Aktivierung wird kein Inhalt angezeigt, der nur in der Spotify-Bibliothek enthalten ist.",
|
||||
"hide-spotify": "Verbirgt Spotify-Inhalt",
|
||||
"shuffle": "Zufallswiedergabe",
|
||||
"track-count": "{count} Track|{count} Track|{count} Tracks",
|
||||
"sort-by": {
|
||||
"title": "Sortieren nach",
|
||||
"sort": {
|
||||
"title": "Sortieren",
|
||||
"name": "Name",
|
||||
"rating": "Bewertung",
|
||||
"release-date": "Erscheinungsdatum"
|
||||
@ -283,8 +286,8 @@
|
||||
"artists": {
|
||||
"count": "{count} Künstler",
|
||||
"filter": "Filter",
|
||||
"sort-by": {
|
||||
"title": "Sortieren nach",
|
||||
"sort": {
|
||||
"title": "Sortieren",
|
||||
"name": "Namen",
|
||||
"recently-added": "Kürzlich hinzugefügt"
|
||||
},
|
||||
@ -321,8 +324,8 @@
|
||||
"album-count": "{count} Album|{count} Album|{count} Alben",
|
||||
"shuffle": "Zufallswiedergabe",
|
||||
"track-count": "{count} Track|{count} Track|{count} Tracks",
|
||||
"sort-by": {
|
||||
"title": "Sortieren nach",
|
||||
"sort": {
|
||||
"title": "Sortieren",
|
||||
"name": "Name",
|
||||
"rating": "Bewertung"
|
||||
}
|
||||
@ -339,8 +342,8 @@
|
||||
"album-count": "{count} Album|{count} Album|{count} Alben",
|
||||
"shuffle": "Zufallswiedergabe",
|
||||
"track-count": "{count} Track|{count} Track|{count} Tracks",
|
||||
"sort-by": {
|
||||
"title": "Sortieren nach",
|
||||
"sort": {
|
||||
"title": "Sortieren",
|
||||
"name": "Name",
|
||||
"rating": "Bewertung"
|
||||
}
|
||||
|
@ -262,8 +262,8 @@
|
||||
"hide-spotify-help": "If active, hides albums that only appear in your Spotify library.",
|
||||
"hide-spotify": "Hide albums from Spotify",
|
||||
"title": "Albums",
|
||||
"sort-by": {
|
||||
"title": "Sort by",
|
||||
"sort": {
|
||||
"title": "Sort",
|
||||
"name": "Name",
|
||||
"recently-added": "Recently added",
|
||||
"recently-released": "Recently released"
|
||||
@ -271,10 +271,13 @@
|
||||
},
|
||||
"artist": {
|
||||
"album-count": "{count} album|{count} album|{count} albums",
|
||||
"filter": "Filter",
|
||||
"hide-spotify-help": "If active, hides the content only appearing in your Spotify library.",
|
||||
"hide-spotify": "Hide the content from Spotify",
|
||||
"shuffle": "Shuffle",
|
||||
"track-count": "{count} track|{count} track|{count} tracks",
|
||||
"sort-by": {
|
||||
"title": "Sort by",
|
||||
"sort": {
|
||||
"title": "Sort",
|
||||
"name": "Name",
|
||||
"rating": "Rating",
|
||||
"release-date": "Release date"
|
||||
@ -283,8 +286,8 @@
|
||||
"artists": {
|
||||
"count": "{count} artist|{count} artist|{count} artists",
|
||||
"filter": "Filter",
|
||||
"sort-by": {
|
||||
"title": "Sort by",
|
||||
"sort": {
|
||||
"title": "Sort",
|
||||
"name": "Name",
|
||||
"recently-added": "Recently added"
|
||||
},
|
||||
@ -321,8 +324,8 @@
|
||||
"album-count": "{count} album|{count} album|{count} albums",
|
||||
"shuffle": "Shuffle",
|
||||
"track-count": "{count} track|{count} track|{count} tracks",
|
||||
"sort-by": {
|
||||
"title": "Sort by",
|
||||
"sort": {
|
||||
"title": "Sort",
|
||||
"name": "Name",
|
||||
"rating": "Rating"
|
||||
}
|
||||
@ -339,8 +342,8 @@
|
||||
"album-count": "{count} album|{count} album|{count} albums",
|
||||
"shuffle": "Shuffle",
|
||||
"track-count": "{count} track|{count} track|{count} tracks",
|
||||
"sort-by": {
|
||||
"title": "Sort by",
|
||||
"sort": {
|
||||
"title": "Sort",
|
||||
"name": "Name",
|
||||
"rating": "Rating"
|
||||
}
|
||||
|
@ -256,14 +256,14 @@
|
||||
},
|
||||
"albums": {
|
||||
"count": "{count} album|{count} album|{count} albums",
|
||||
"filter": "Filtre",
|
||||
"filter": "Filtrer",
|
||||
"hide-singles-help": "Si actif, masque les singles et les albums dont les pistes n’apparaissent que dans les listes de lecture.",
|
||||
"hide-singles": "Masquer les singles",
|
||||
"hide-spotify-help": "Si actif, masque les albums qui n’apparaissent que dans votre bibliothèque Spotify.",
|
||||
"hide-spotify": "Masquer les albums de Spotify",
|
||||
"title": "Albums",
|
||||
"sort-by": {
|
||||
"title": "Trier par",
|
||||
"sort": {
|
||||
"title": "Trier",
|
||||
"name": "Nom",
|
||||
"recently-added": "Ajouts récents",
|
||||
"recently-released": "Sorties récentes"
|
||||
@ -271,10 +271,13 @@
|
||||
},
|
||||
"artist": {
|
||||
"album-count": "{count} album|{count} album|{count} albums",
|
||||
"filter": "Filtrer",
|
||||
"hide-spotify-help": "Si actif, masque le contenu qui n’apparaît que dans votre bibliothèque Spotify.",
|
||||
"hide-spotify": "Masquer le contenu de Spotify",
|
||||
"shuffle": "Lecture aléatoire",
|
||||
"track-count": "{count} piste|{count} piste|{count} pistes",
|
||||
"sort-by": {
|
||||
"title": "Trier par",
|
||||
"sort": {
|
||||
"title": "Trier",
|
||||
"name": "Nom",
|
||||
"rating": "Classement",
|
||||
"release-date": "Date de sortie"
|
||||
@ -282,9 +285,9 @@
|
||||
},
|
||||
"artists": {
|
||||
"count": "{count} artiste|{count} artiste|{count} artistes",
|
||||
"filter": "Filtre",
|
||||
"sort-by": {
|
||||
"title": "Trier par",
|
||||
"filter": "Filtrer",
|
||||
"sort": {
|
||||
"title": "Trier",
|
||||
"name": "Nom",
|
||||
"recently-added": "Ajouts récents"
|
||||
},
|
||||
@ -321,8 +324,8 @@
|
||||
"album-count": "{count} album|{count} album|{count} albums",
|
||||
"shuffle": "Lecture aléatoire",
|
||||
"track-count": "{count} piste|{count} piste|{count} pistes",
|
||||
"sort-by": {
|
||||
"title": "Trier par",
|
||||
"sort": {
|
||||
"title": "Trier",
|
||||
"name": "Nom",
|
||||
"rating": "Classement"
|
||||
}
|
||||
@ -339,8 +342,8 @@
|
||||
"album-count": "{count} album|{count} album|{count} albums",
|
||||
"shuffle": "Lecture aléatoire",
|
||||
"track-count": "{count} piste|{count} piste|{count} pistes",
|
||||
"sort-by": {
|
||||
"title": "Trier par",
|
||||
"sort": {
|
||||
"title": "Trier",
|
||||
"name": "Nom",
|
||||
"rating": "Classement"
|
||||
}
|
||||
|
@ -262,8 +262,8 @@
|
||||
"hide-spotify-help": "如果激活,将隐藏仅在Spotify资料库出现的专辑",
|
||||
"hide-spotify": "隐藏来自Spotify的专辑",
|
||||
"title": "专辑",
|
||||
"sort-by": {
|
||||
"title": "排序方式",
|
||||
"sort": {
|
||||
"title": "分类",
|
||||
"name": "名称",
|
||||
"recently-added": "最近添加",
|
||||
"recently-released": "最近发行"
|
||||
@ -271,10 +271,13 @@
|
||||
},
|
||||
"artist": {
|
||||
"album-count": "{count} 张专辑|{count} 张专辑",
|
||||
"filter": "筛选",
|
||||
"hide-spotify-help": "如果激活,将隐藏只出现在Spotify库中的内容",
|
||||
"hide-spotify": "隐藏来自Spotify的内容",
|
||||
"shuffle": "随机播放",
|
||||
"track-count": "{count} 只曲目|{count} 只曲目",
|
||||
"sort-by": {
|
||||
"title": "排序方式",
|
||||
"sort": {
|
||||
"title": "分类",
|
||||
"name": "名称",
|
||||
"rating": "评级",
|
||||
"release-date": "发行日期"
|
||||
@ -283,8 +286,8 @@
|
||||
"artists": {
|
||||
"count": "{count} 位艺人|{count} 位艺人",
|
||||
"filter": "筛选",
|
||||
"sort-by": {
|
||||
"title": "排序方式",
|
||||
"sort": {
|
||||
"title": "分类",
|
||||
"name": "名称",
|
||||
"recently-added": "最近添加"
|
||||
},
|
||||
@ -321,8 +324,8 @@
|
||||
"album-count": "{count} 张专辑|{count} 张专辑",
|
||||
"shuffle": "随机播放",
|
||||
"track-count": "{count} 只曲目|{count} 只曲目",
|
||||
"sort-by": {
|
||||
"title": "排序方式",
|
||||
"sort": {
|
||||
"title": "分类",
|
||||
"name": "名称",
|
||||
"rating": "评级"
|
||||
}
|
||||
@ -339,8 +342,8 @@
|
||||
"album-count": "{count} 张专辑|{count} 张专辑",
|
||||
"shuffle": "随机播放",
|
||||
"track-count": "{count} 只曲目|{count} 只曲目",
|
||||
"sort-by": {
|
||||
"title": "排序方式",
|
||||
"sort": {
|
||||
"title": "分类",
|
||||
"name": "名称",
|
||||
"rating": "评级"
|
||||
}
|
||||
|
@ -39,7 +39,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<p class="heading mb-5" v-text="$t('page.albums.sort-by.title')" />
|
||||
<p class="heading mb-5" v-text="$t('page.albums.sort.title')" />
|
||||
<control-dropdown
|
||||
v-model:value="selected_groupby_option_id"
|
||||
:options="groupby_options"
|
||||
@ -116,19 +116,19 @@ export default {
|
||||
groupby_options: [
|
||||
{
|
||||
id: 1,
|
||||
name: this.$t('page.albums.sort-by.name'),
|
||||
name: this.$t('page.albums.sort.name'),
|
||||
options: byName('name_sort', true)
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: this.$t('page.albums.sort-by.recently-added'),
|
||||
name: this.$t('page.albums.sort.recently-added'),
|
||||
options: byYear('time_added', {
|
||||
direction: 'desc'
|
||||
})
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: this.$t('page.albums.sort-by.recently-released'),
|
||||
name: this.$t('page.albums.sort.recently-released'),
|
||||
options: byYear('date_released', {
|
||||
direction: 'desc'
|
||||
})
|
||||
|
@ -4,7 +4,25 @@
|
||||
<template #options>
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<p class="heading mb-5" v-text="$t('page.artist.sort-by.title')" />
|
||||
<p class="heading mb-5" v-text="$t('page.artist.filter')" />
|
||||
<div v-if="spotify_enabled" class="field">
|
||||
<div class="control">
|
||||
<input
|
||||
id="switchHideSpotify"
|
||||
v-model="hide_spotify"
|
||||
type="checkbox"
|
||||
class="switch is-rounded"
|
||||
/>
|
||||
<label
|
||||
for="switchHideSpotify"
|
||||
v-text="$t('page.artist.hide-spotify')"
|
||||
/>
|
||||
</div>
|
||||
<p class="help" v-text="$t('page.artist.hide-spotify-help')" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<p class="heading mb-5" v-text="$t('page.artist.sort.title')" />
|
||||
<control-dropdown
|
||||
v-model:value="selected_groupby_option_id"
|
||||
:options="groupby_options"
|
||||
@ -32,17 +50,13 @@
|
||||
<template #content>
|
||||
<p class="heading has-text-centered-mobile">
|
||||
<span
|
||||
v-text="
|
||||
$t('page.artist.album-count', { count: artist.album_count })
|
||||
"
|
||||
v-text="$t('page.artist.album-count', { count: albums.count })"
|
||||
/>
|
||||
<span> | </span>
|
||||
<a
|
||||
class="has-text-link"
|
||||
@click="open_tracks"
|
||||
v-text="
|
||||
$t('page.artist.track-count', { count: artist.track_count })
|
||||
"
|
||||
v-text="$t('page.artist.track-count', { count: track_count })"
|
||||
/>
|
||||
</p>
|
||||
<list-albums :albums="albums" :hide_group_title="true" />
|
||||
@ -108,12 +122,12 @@ export default {
|
||||
groupby_options: [
|
||||
{
|
||||
id: 1,
|
||||
name: this.$t('page.artist.sort-by.name'),
|
||||
name: this.$t('page.artist.sort.name'),
|
||||
options: byName('name_sort', true)
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: this.$t('page.artist.sort-by.release-date'),
|
||||
name: this.$t('page.artist.sort.release-date'),
|
||||
options: byYear('date_released', {
|
||||
direction: 'asc'
|
||||
})
|
||||
@ -128,11 +142,19 @@ export default {
|
||||
const groupBy = this.groupby_options.find(
|
||||
(o) => o.id === this.selected_groupby_option_id
|
||||
)
|
||||
this.albums_list.group(groupBy.options)
|
||||
|
||||
this.albums_list.group(groupBy.options, [
|
||||
(album) => !this.hide_spotify || album.data_kind !== 'spotify'
|
||||
])
|
||||
return this.albums_list
|
||||
},
|
||||
|
||||
hide_spotify: {
|
||||
get() {
|
||||
return this.$store.state.hide_spotify
|
||||
},
|
||||
set(value) {
|
||||
this.$store.commit(types.HIDE_SPOTIFY, value)
|
||||
}
|
||||
},
|
||||
selected_groupby_option_id: {
|
||||
get() {
|
||||
return this.$store.state.artist_albums_sort
|
||||
@ -140,6 +162,16 @@ export default {
|
||||
set(value) {
|
||||
this.$store.commit(types.ARTIST_ALBUMS_SORT, value)
|
||||
}
|
||||
},
|
||||
spotify_enabled() {
|
||||
return this.$store.state.spotify.webapi_token_valid
|
||||
},
|
||||
track_count() {
|
||||
// The count of tracks is incorrect when albums have Spotify tracks.
|
||||
return [...this.albums].reduce(
|
||||
(total, album) => total + (album.isItem ? album.item.track_count : 0),
|
||||
0
|
||||
)
|
||||
}
|
||||
},
|
||||
|
||||
|
@ -5,7 +5,25 @@
|
||||
<index-button-list :index="tracks.indexList" />
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<p class="heading mb-5" v-text="$t('page.artist.sort-by.title')" />
|
||||
<p class="heading mb-5" v-text="$t('page.artist.filter')" />
|
||||
<div v-if="spotify_enabled" class="field">
|
||||
<div class="control">
|
||||
<input
|
||||
id="switchHideSpotify"
|
||||
v-model="hide_spotify"
|
||||
type="checkbox"
|
||||
class="switch is-rounded"
|
||||
/>
|
||||
<label
|
||||
for="switchHideSpotify"
|
||||
v-text="$t('page.artist.hide-spotify')"
|
||||
/>
|
||||
</div>
|
||||
<p class="help" v-text="$t('page.artist.hide-spotify-help')" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<p class="heading mb-5" v-text="$t('page.artist.sort.title')" />
|
||||
<control-dropdown
|
||||
v-model:value="selected_groupby_option_id"
|
||||
:options="groupby_options"
|
||||
@ -35,15 +53,11 @@
|
||||
<a
|
||||
class="has-text-link"
|
||||
@click="open_artist"
|
||||
v-text="
|
||||
$t('page.artist.album-count', { count: artist.album_count })
|
||||
"
|
||||
v-text="$t('page.artist.album-count', { count: album_count })"
|
||||
/>
|
||||
<span> | </span>
|
||||
<span
|
||||
v-text="
|
||||
$t('page.artist.track-count', { count: artist.track_count })
|
||||
"
|
||||
v-text="$t('page.artist.track-count', { count: tracks.count })"
|
||||
/>
|
||||
</p>
|
||||
<list-tracks :tracks="tracks" :uris="track_uris" />
|
||||
@ -110,12 +124,12 @@ export default {
|
||||
groupby_options: [
|
||||
{
|
||||
id: 1,
|
||||
name: this.$t('page.artist.sort-by.name'),
|
||||
name: this.$t('page.artist.sort.name'),
|
||||
options: byName('title_sort')
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: this.$t('page.artist.sort-by.rating'),
|
||||
name: this.$t('page.artist.sort.rating'),
|
||||
options: byRating('rating', {
|
||||
direction: 'desc'
|
||||
})
|
||||
@ -127,6 +141,21 @@ export default {
|
||||
},
|
||||
|
||||
computed: {
|
||||
album_count() {
|
||||
return new Set(
|
||||
[...this.tracks]
|
||||
.filter((track) => track.isItem)
|
||||
.map((track) => track.item.album_id)
|
||||
).size
|
||||
},
|
||||
hide_spotify: {
|
||||
get() {
|
||||
return this.$store.state.hide_spotify
|
||||
},
|
||||
set(value) {
|
||||
this.$store.commit(types.HIDE_SPOTIFY, value)
|
||||
}
|
||||
},
|
||||
selected_groupby_option_id: {
|
||||
get() {
|
||||
return this.$store.state.artist_tracks_sort
|
||||
@ -135,11 +164,16 @@ export default {
|
||||
this.$store.commit(types.ARTIST_TRACKS_SORT, value)
|
||||
}
|
||||
},
|
||||
spotify_enabled() {
|
||||
return this.$store.state.spotify.webapi_token_valid
|
||||
},
|
||||
tracks() {
|
||||
const groupBy = this.groupby_options.find(
|
||||
(o) => o.id === this.selected_groupby_option_id
|
||||
)
|
||||
this.tracks_list.group(groupBy.options)
|
||||
this.tracks_list.group(groupBy.options, [
|
||||
(track) => !this.hide_spotify || track.data_kind !== 'spotify'
|
||||
])
|
||||
return this.tracks_list
|
||||
},
|
||||
track_uris() {
|
||||
|
@ -39,7 +39,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<p class="heading mb-5" v-text="$t('page.artists.sort-by.title')" />
|
||||
<p class="heading mb-5" v-text="$t('page.artists.sort.title')" />
|
||||
<control-dropdown
|
||||
v-model:value="selected_groupby_option_id"
|
||||
:options="groupby_options"
|
||||
@ -116,12 +116,12 @@ export default {
|
||||
groupby_options: [
|
||||
{
|
||||
id: 1,
|
||||
name: this.$t('page.artists.sort-by.name'),
|
||||
name: this.$t('page.artists.sort.name'),
|
||||
options: byName('name_sort', true)
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: this.$t('page.artists.sort-by.recently-added'),
|
||||
name: this.$t('page.artists.sort.recently-added'),
|
||||
options: byYear('time_added', {
|
||||
direction: 'desc'
|
||||
})
|
||||
|
@ -5,7 +5,7 @@
|
||||
<index-button-list :index="tracks.indexList" />
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<p class="heading mb-5" v-text="$t('page.artist.sort-by.title')" />
|
||||
<p class="heading mb-5" v-text="$t('page.artist.sort.title')" />
|
||||
<control-dropdown
|
||||
v-model:value="selected_groupby_option_id"
|
||||
:options="groupby_options"
|
||||
@ -112,12 +112,12 @@ export default {
|
||||
groupby_options: [
|
||||
{
|
||||
id: 1,
|
||||
name: this.$t('page.composer.sort-by.name'),
|
||||
name: this.$t('page.composer.sort.name'),
|
||||
options: byName('title_sort')
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: this.$t('page.composer.sort-by.rating'),
|
||||
name: this.$t('page.composer.sort.rating'),
|
||||
options: byRating('rating', {
|
||||
direction: 'desc'
|
||||
})
|
||||
|
@ -5,7 +5,7 @@
|
||||
<index-button-list :index="tracks.indexList" />
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<p class="heading mb-5" v-text="$t('page.genre.sort-by.title')" />
|
||||
<p class="heading mb-5" v-text="$t('page.genre.sort.title')" />
|
||||
<control-dropdown
|
||||
v-model:value="selected_groupby_option_id"
|
||||
:options="groupby_options"
|
||||
@ -111,12 +111,12 @@ export default {
|
||||
groupby_options: [
|
||||
{
|
||||
id: 1,
|
||||
name: this.$t('page.genre.sort-by.name'),
|
||||
name: this.$t('page.genre.sort.name'),
|
||||
options: byName('title_sort')
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: this.$t('page.genre.sort-by.rating'),
|
||||
name: this.$t('page.genre.sort.rating'),
|
||||
options: byRating('rating', {
|
||||
direction: 'desc'
|
||||
})
|
||||
|
Loading…
x
Reference in New Issue
Block a user