From 7fff11ef30806f548c3ce9e3f76a9aac3db785e0 Mon Sep 17 00:00:00 2001
From: chme
Date: Sat, 16 Apr 2022 10:14:03 +0200
Subject: [PATCH 1/4] [web] Only include icons in bundle that are used in the
web interface
---
web-src/package-lock.json | 40 ++++--
web-src/package.json | 3 +-
web-src/src/components/DropdownMenu.vue | 4 +-
web-src/src/components/ListAlbums.vue | 2 +-
web-src/src/components/ListArtists.vue | 2 +-
web-src/src/components/ListComposers.vue | 2 +-
web-src/src/components/ListDirectories.vue | 6 +-
web-src/src/components/ListGenres.vue | 2 +-
web-src/src/components/ListItemQueueItem.vue | 2 +-
web-src/src/components/ListPlaylists.vue | 21 ++--
web-src/src/components/ListTracks.vue | 4 +-
web-src/src/components/ModalDialog.vue | 6 +-
web-src/src/components/ModalDialogAddRss.vue | 10 +-
.../components/ModalDialogAddUrlStream.vue | 12 +-
web-src/src/components/ModalDialogAlbum.vue | 10 +-
web-src/src/components/ModalDialogArtist.vue | 10 +-
.../src/components/ModalDialogComposer.vue | 10 +-
.../src/components/ModalDialogDirectory.vue | 10 +-
web-src/src/components/ModalDialogGenre.vue | 10 +-
.../src/components/ModalDialogPlaylist.vue | 10 +-
.../components/ModalDialogPlaylistSave.vue | 10 +-
.../src/components/ModalDialogQueueItem.vue | 4 +-
.../components/ModalDialogRemotePairing.vue | 4 +-
web-src/src/components/ModalDialogTrack.vue | 10 +-
web-src/src/components/NavbarBottom.vue | 62 ++++------
web-src/src/components/NavbarItemOutput.vue | 14 +--
web-src/src/components/NavbarTop.vue | 34 ++---
.../src/components/PlayerButtonConsume.vue | 7 +-
web-src/src/components/PlayerButtonNext.vue | 9 +-
.../src/components/PlayerButtonPlayPause.vue | 27 ++--
.../src/components/PlayerButtonPrevious.vue | 9 +-
web-src/src/components/PlayerButtonRepeat.vue | 26 ++--
.../src/components/PlayerButtonSeekBack.vue | 10 +-
.../components/PlayerButtonSeekForward.vue | 12 +-
.../src/components/PlayerButtonShuffle.vue | 20 +--
.../components/SpotifyModalDialogAlbum.vue | 10 +-
.../components/SpotifyModalDialogArtist.vue | 10 +-
.../components/SpotifyModalDialogPlaylist.vue | 10 +-
.../components/SpotifyModalDialogTrack.vue | 10 +-
web-src/src/components/TabsAudiobooks.vue | 4 +-
web-src/src/components/TabsMusic.vue | 14 ++-
web-src/src/components/TabsSearch.vue | 16 ++-
web-src/src/icons.js | 117 ++++++++++++++++++
web-src/src/main copy.js | 31 -----
web-src/src/main.js | 6 +-
web-src/src/pages/PageAlbum.vue | 6 +-
web-src/src/pages/PageArtist.vue | 6 +-
web-src/src/pages/PageArtistTracks.vue | 4 +-
web-src/src/pages/PageAudiobooksAlbum.vue | 6 +-
web-src/src/pages/PageAudiobooksArtist.vue | 6 +-
web-src/src/pages/PageComposer.vue | 4 +-
web-src/src/pages/PageComposerTracks.vue | 4 +-
web-src/src/pages/PageFiles.vue | 4 +-
web-src/src/pages/PageGenre.vue | 4 +-
web-src/src/pages/PageGenreTracks.vue | 4 +-
web-src/src/pages/PagePlaylist.vue | 6 +-
web-src/src/pages/PagePodcast.vue | 6 +-
web-src/src/pages/PagePodcasts.vue | 6 +-
web-src/src/pages/PageQueue.vue | 14 +--
web-src/src/pages/PageSearch.vue | 2 +-
web-src/src/pages/SpotifyPageAlbum.vue | 8 +-
web-src/src/pages/SpotifyPageArtist.vue | 8 +-
web-src/src/pages/SpotifyPageBrowse.vue | 4 +-
.../SpotifyPageBrowseFeaturedPlaylists.vue | 2 +-
.../pages/SpotifyPageBrowseNewReleases.vue | 2 +-
web-src/src/pages/SpotifyPagePlaylist.vue | 8 +-
web-src/src/pages/SpotifyPageSearch.vue | 10 +-
web-src/src/templates/ContentWithHeading.vue | 4 +-
68 files changed, 476 insertions(+), 314 deletions(-)
create mode 100644 web-src/src/icons.js
delete mode 100644 web-src/src/main copy.js
diff --git a/web-src/package-lock.json b/web-src/package-lock.json
index 3b2d1eb9..c73f525b 100644
--- a/web-src/package-lock.json
+++ b/web-src/package-lock.json
@@ -9,13 +9,14 @@
"version": "2.0.0",
"dependencies": {
"@aacassandra/vue3-progressbar": "^1.0.3",
+ "@mdi/js": "^6.6.96",
"@ts-pro/vue-eternal-loading": "^1.2.0",
"@vueform/slider": "github:chme/slider#faff83ed8a77f2cdbcb7252505ef734301efd139",
"axios": "^0.26.1",
"bulma": "^0.9.3",
"bulma-switch": "^2.0.4",
"luxon": "^2.3.1",
- "mdi": "^2.2.43",
+ "mdi-vue": "^3.0.12",
"reconnectingwebsocket": "^1.0.0",
"spotify-web-api-js": "^1.5.2",
"string-to-color": "^2.2.2",
@@ -97,6 +98,11 @@
"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
"dev": true
},
+ "node_modules/@mdi/js": {
+ "version": "6.6.96",
+ "resolved": "https://registry.npmjs.org/@mdi/js/-/js-6.6.96.tgz",
+ "integrity": "sha512-ke9PN5DjPCOlMfhioxeZYADz8Yiz6v47W0IYRza01SSJD7y1EwESVpwFnnFUso+eCoWtE1CO9cTIvQF6sEreuA=="
+ },
"node_modules/@ts-pro/vue-eternal-loading": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@ts-pro/vue-eternal-loading/-/vue-eternal-loading-1.2.0.tgz",
@@ -1485,11 +1491,17 @@
"sourcemap-codec": "^1.4.8"
}
},
- "node_modules/mdi": {
- "version": "2.2.43",
- "resolved": "https://registry.npmjs.org/mdi/-/mdi-2.2.43.tgz",
- "integrity": "sha512-g3m6z4303qieltUM20JL2gdsJZvoVzIzO74qa2XxZ2kg9JPwrPEAgooVhRDHZi1vvRh0gB8Dg+c9XqNdz4jcIg==",
- "deprecated": "The mdi package was renamed to @mdi/font after v2.2.43. Please rename in your package.json for future updates."
+ "node_modules/mdi-vue": {
+ "version": "3.0.12",
+ "resolved": "https://registry.npmjs.org/mdi-vue/-/mdi-vue-3.0.12.tgz",
+ "integrity": "sha512-rc4rq99Hafa7v1u3KyfzGRr13v7/AzBvNrcXdhcgPQvj8wYafimbLGfNvQcGiAYZMow40KpXlZuG07132XccKw==",
+ "dependencies": {
+ "@mdi/js": "*"
+ },
+ "peerDependencies": {
+ "@mdi/js": "*",
+ "vue": "*"
+ }
},
"node_modules/minimatch": {
"version": "3.1.2",
@@ -2182,6 +2194,11 @@
"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
"dev": true
},
+ "@mdi/js": {
+ "version": "6.6.96",
+ "resolved": "https://registry.npmjs.org/@mdi/js/-/js-6.6.96.tgz",
+ "integrity": "sha512-ke9PN5DjPCOlMfhioxeZYADz8Yiz6v47W0IYRza01SSJD7y1EwESVpwFnnFUso+eCoWtE1CO9cTIvQF6sEreuA=="
+ },
"@ts-pro/vue-eternal-loading": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@ts-pro/vue-eternal-loading/-/vue-eternal-loading-1.2.0.tgz",
@@ -3145,10 +3162,13 @@
"sourcemap-codec": "^1.4.8"
}
},
- "mdi": {
- "version": "2.2.43",
- "resolved": "https://registry.npmjs.org/mdi/-/mdi-2.2.43.tgz",
- "integrity": "sha512-g3m6z4303qieltUM20JL2gdsJZvoVzIzO74qa2XxZ2kg9JPwrPEAgooVhRDHZi1vvRh0gB8Dg+c9XqNdz4jcIg=="
+ "mdi-vue": {
+ "version": "3.0.12",
+ "resolved": "https://registry.npmjs.org/mdi-vue/-/mdi-vue-3.0.12.tgz",
+ "integrity": "sha512-rc4rq99Hafa7v1u3KyfzGRr13v7/AzBvNrcXdhcgPQvj8wYafimbLGfNvQcGiAYZMow40KpXlZuG07132XccKw==",
+ "requires": {
+ "@mdi/js": "*"
+ }
},
"minimatch": {
"version": "3.1.2",
diff --git a/web-src/package.json b/web-src/package.json
index a4046106..5bdd391e 100644
--- a/web-src/package.json
+++ b/web-src/package.json
@@ -11,13 +11,14 @@
},
"dependencies": {
"@aacassandra/vue3-progressbar": "^1.0.3",
+ "@mdi/js": "^6.6.96",
"@ts-pro/vue-eternal-loading": "^1.2.0",
"@vueform/slider": "github:chme/slider#faff83ed8a77f2cdbcb7252505ef734301efd139",
"axios": "^0.26.1",
"bulma": "^0.9.3",
"bulma-switch": "^2.0.4",
"luxon": "^2.3.1",
- "mdi": "^2.2.43",
+ "mdi-vue": "^3.0.12",
"reconnectingwebsocket": "^1.0.0",
"spotify-web-api-js": "^1.5.2",
"string-to-color": "^2.2.2",
diff --git a/web-src/src/components/DropdownMenu.vue b/web-src/src/components/DropdownMenu.vue
index 988c47bd..db2a887a 100644
--- a/web-src/src/components/DropdownMenu.vue
+++ b/web-src/src/components/DropdownMenu.vue
@@ -12,8 +12,8 @@
@click="is_active = !is_active"
>
{{ modelValue }}
-
-
+
+
diff --git a/web-src/src/components/ListAlbums.vue b/web-src/src/components/ListAlbums.vue
index dcb37316..451e506e 100644
--- a/web-src/src/components/ListAlbums.vue
+++ b/web-src/src/components/ListAlbums.vue
@@ -41,7 +41,7 @@
diff --git a/web-src/src/components/ListArtists.vue b/web-src/src/components/ListArtists.vue
index b968e52d..c5dd309a 100644
--- a/web-src/src/components/ListArtists.vue
+++ b/web-src/src/components/ListArtists.vue
@@ -22,7 +22,7 @@
diff --git a/web-src/src/components/ListComposers.vue b/web-src/src/components/ListComposers.vue
index 9cb57ece..7103e453 100644
--- a/web-src/src/components/ListComposers.vue
+++ b/web-src/src/components/ListComposers.vue
@@ -22,7 +22,7 @@
diff --git a/web-src/src/components/ListDirectories.vue b/web-src/src/components/ListDirectories.vue
index 2fac055c..77e7418b 100644
--- a/web-src/src/components/ListDirectories.vue
+++ b/web-src/src/components/ListDirectories.vue
@@ -6,7 +6,7 @@
>
@@ -20,7 +20,7 @@
diff --git a/web-src/src/components/ModalDialogArtist.vue b/web-src/src/components/ModalDialogArtist.vue
index e11ebcf8..c3525a8e 100644
--- a/web-src/src/components/ModalDialogArtist.vue
+++ b/web-src/src/components/ModalDialogArtist.vue
@@ -34,15 +34,19 @@
diff --git a/web-src/src/components/ModalDialogComposer.vue b/web-src/src/components/ModalDialogComposer.vue
index 02228c51..546520f7 100644
--- a/web-src/src/components/ModalDialogComposer.vue
+++ b/web-src/src/components/ModalDialogComposer.vue
@@ -32,15 +32,19 @@
diff --git a/web-src/src/components/ModalDialogDirectory.vue b/web-src/src/components/ModalDialogDirectory.vue
index 36c7821c..a1289c6b 100644
--- a/web-src/src/components/ModalDialogDirectory.vue
+++ b/web-src/src/components/ModalDialogDirectory.vue
@@ -12,15 +12,19 @@
diff --git a/web-src/src/components/ModalDialogGenre.vue b/web-src/src/components/ModalDialogGenre.vue
index e4d0cb72..0bf9ea98 100644
--- a/web-src/src/components/ModalDialogGenre.vue
+++ b/web-src/src/components/ModalDialogGenre.vue
@@ -30,15 +30,19 @@
diff --git a/web-src/src/components/ModalDialogPlaylist.vue b/web-src/src/components/ModalDialogPlaylist.vue
index 051287ef..7ea0f473 100644
--- a/web-src/src/components/ModalDialogPlaylist.vue
+++ b/web-src/src/components/ModalDialogPlaylist.vue
@@ -24,15 +24,19 @@
diff --git a/web-src/src/components/ModalDialogPlaylistSave.vue b/web-src/src/components/ModalDialogPlaylistSave.vue
index 33cc1bb9..704de1d5 100644
--- a/web-src/src/components/ModalDialogPlaylistSave.vue
+++ b/web-src/src/components/ModalDialogPlaylistSave.vue
@@ -19,7 +19,7 @@
:disabled="loading"
/>
-
+
@@ -27,7 +27,7 @@
@@ -36,14 +36,16 @@
class="card-footer-item has-text-danger"
@click="$emit('close')"
>
-
+
Cancel
diff --git a/web-src/src/components/ModalDialogQueueItem.vue b/web-src/src/components/ModalDialogQueueItem.vue
index ee122722..4108f0f4 100644
--- a/web-src/src/components/ModalDialogQueueItem.vue
+++ b/web-src/src/components/ModalDialogQueueItem.vue
@@ -92,11 +92,11 @@
diff --git a/web-src/src/components/ModalDialogRemotePairing.vue b/web-src/src/components/ModalDialogRemotePairing.vue
index 8ae6de7a..dde17b51 100644
--- a/web-src/src/components/ModalDialogRemotePairing.vue
+++ b/web-src/src/components/ModalDialogRemotePairing.vue
@@ -29,14 +29,14 @@
class="card-footer-item has-text-danger"
@click="$emit('close')"
>
-
+
Cancel
diff --git a/web-src/src/components/ModalDialogTrack.vue b/web-src/src/components/ModalDialogTrack.vue
index 5e6607ab..cacad0fd 100644
--- a/web-src/src/components/ModalDialogTrack.vue
+++ b/web-src/src/components/ModalDialogTrack.vue
@@ -124,15 +124,19 @@
diff --git a/web-src/src/components/NavbarBottom.vue b/web-src/src/components/NavbarBottom.vue
index 229efd00..3d4f4394 100644
--- a/web-src/src/components/NavbarBottom.vue
+++ b/web-src/src/components/NavbarBottom.vue
@@ -12,7 +12,7 @@
-
+
@@ -39,31 +39,31 @@
@@ -72,12 +72,9 @@
@click="show_player_menu = !show_player_menu"
>
@@ -91,12 +88,9 @@
@click="show_player_menu = !show_player_menu"
>
@@ -114,12 +108,9 @@
@click="toggle_mute_volume"
>
@@ -173,7 +164,7 @@
'is-loading': loading
}"
@click="togglePlay"
- >
@@ -239,9 +230,9 @@
@@ -254,12 +245,9 @@
@@ -313,7 +301,7 @@
'is-loading': loading
}"
@click="togglePlay"
- >
+ >
diff --git a/web-src/src/components/NavbarItemOutput.vue b/web-src/src/components/NavbarItemOutput.vue
index fda97967..2527fc41 100644
--- a/web-src/src/components/NavbarItemOutput.vue
+++ b/web-src/src/components/NavbarItemOutput.vue
@@ -9,11 +9,7 @@
:class="{ 'has-text-grey-light': !output.selected }"
@click="set_enabled"
>
-
+
@@ -68,13 +64,13 @@ export default {
computed: {
type_class() {
if (this.output.type.startsWith('AirPlay')) {
- return 'mdi-airplay'
+ return 'cast-variant'
} else if (this.output.type === 'Chromecast') {
- return 'mdi-cast'
+ return 'cast'
} else if (this.output.type === 'fifo') {
- return 'mdi-pipe'
+ return 'pipe'
} else {
- return 'mdi-server'
+ return 'server'
}
},
diff --git a/web-src/src/components/NavbarTop.vue b/web-src/src/components/NavbarTop.vue
index 083cf6da..35a64f74 100644
--- a/web-src/src/components/NavbarTop.vue
+++ b/web-src/src/components/NavbarTop.vue
@@ -7,25 +7,25 @@
>
-
+
-
+
-
+
-
+
-
+
-
+
-
+
OwnTone
-
+
Playlists
-
+
Music
@@ -78,23 +80,25 @@
Spotify
-
+
Podcasts
-
+
Audiobooks
-
+
Radio
-
+
Files
-
+
Search
diff --git a/web-src/src/components/PlayerButtonConsume.vue b/web-src/src/components/PlayerButtonConsume.vue
index 031d937d..4b48175a 100644
--- a/web-src/src/components/PlayerButtonConsume.vue
+++ b/web-src/src/components/PlayerButtonConsume.vue
@@ -1,6 +1,6 @@
-
+
@@ -11,7 +11,10 @@ export default {
name: 'PlayerButtonConsume',
props: {
- icon_style: String
+ icon_size: {
+ type: Number,
+ default: 16
+ }
},
computed: {
diff --git a/web-src/src/components/PlayerButtonNext.vue b/web-src/src/components/PlayerButtonNext.vue
index 612d6b3e..8682e230 100644
--- a/web-src/src/components/PlayerButtonNext.vue
+++ b/web-src/src/components/PlayerButtonNext.vue
@@ -1,8 +1,6 @@
-
+
@@ -13,7 +11,10 @@ export default {
name: 'PlayerButtonNext',
props: {
- icon_style: String
+ icon_size: {
+ type: Number,
+ default: 16
+ }
},
computed: {
diff --git a/web-src/src/components/PlayerButtonPlayPause.vue b/web-src/src/components/PlayerButtonPlayPause.vue
index daedc8eb..59193f64 100644
--- a/web-src/src/components/PlayerButtonPlayPause.vue
+++ b/web-src/src/components/PlayerButtonPlayPause.vue
@@ -1,17 +1,6 @@
-
+
@@ -22,7 +11,10 @@ export default {
name: 'PlayerButtonPlayPause',
props: {
- icon_style: String,
+ icon_size: {
+ type: Number,
+ default: 16
+ },
show_disabled_message: Boolean
},
@@ -40,6 +32,15 @@ export default {
disabled() {
return !this.$store.state.queue || this.$store.state.queue.count <= 0
+ },
+
+ icon_name() {
+ if (!this.is_playing) {
+ return 'play'
+ } else if (this.is_pause_allowed) {
+ return 'pause'
+ }
+ return 'stop'
}
},
diff --git a/web-src/src/components/PlayerButtonPrevious.vue b/web-src/src/components/PlayerButtonPrevious.vue
index f38ec685..c354976e 100644
--- a/web-src/src/components/PlayerButtonPrevious.vue
+++ b/web-src/src/components/PlayerButtonPrevious.vue
@@ -1,8 +1,6 @@
-
+
@@ -13,7 +11,10 @@ export default {
name: 'PlayerButtonPrevious',
props: {
- icon_style: String
+ icon_size: {
+ type: Number,
+ default: 16
+ }
},
computed: {
diff --git a/web-src/src/components/PlayerButtonRepeat.vue b/web-src/src/components/PlayerButtonRepeat.vue
index 9deec80e..1a3e927d 100644
--- a/web-src/src/components/PlayerButtonRepeat.vue
+++ b/web-src/src/components/PlayerButtonRepeat.vue
@@ -1,17 +1,6 @@
-
+
@@ -22,7 +11,10 @@ export default {
name: 'PlayerButtonRepeat',
props: {
- icon_style: String
+ icon_size: {
+ type: Number,
+ default: 16
+ }
},
computed: {
@@ -34,6 +26,14 @@ export default {
},
is_repeat_off() {
return !this.is_repeat_all && !this.is_repeat_single
+ },
+ icon_name() {
+ if (this.is_repeat_all) {
+ return 'repeat'
+ } else if (this.is_repeat_single) {
+ return 'repeat-once'
+ }
+ return 'repeat-off'
}
},
diff --git a/web-src/src/components/PlayerButtonSeekBack.vue b/web-src/src/components/PlayerButtonSeekBack.vue
index e949cee6..94f4a256 100644
--- a/web-src/src/components/PlayerButtonSeekBack.vue
+++ b/web-src/src/components/PlayerButtonSeekBack.vue
@@ -1,6 +1,6 @@
-
+
@@ -9,7 +9,13 @@ import webapi from '@/webapi'
export default {
name: 'PlayerButtonSeekBack',
- props: ['seek_ms', 'icon_style'],
+ props: {
+ seek_ms: Number,
+ icon_size: {
+ type: Number,
+ default: 16
+ }
+ },
computed: {
now_playing() {
diff --git a/web-src/src/components/PlayerButtonSeekForward.vue b/web-src/src/components/PlayerButtonSeekForward.vue
index dd2072a5..54b57e9f 100644
--- a/web-src/src/components/PlayerButtonSeekForward.vue
+++ b/web-src/src/components/PlayerButtonSeekForward.vue
@@ -1,8 +1,6 @@
-
+
@@ -11,7 +9,13 @@ import webapi from '@/webapi'
export default {
name: 'PlayerButtonSeekForward',
- props: ['seek_ms', 'icon_style'],
+ props: {
+ seek_ms: Number,
+ icon_size: {
+ type: Number,
+ default: 16
+ }
+ },
computed: {
now_playing() {
diff --git a/web-src/src/components/PlayerButtonShuffle.vue b/web-src/src/components/PlayerButtonShuffle.vue
index a997e0fd..8392b62d 100644
--- a/web-src/src/components/PlayerButtonShuffle.vue
+++ b/web-src/src/components/PlayerButtonShuffle.vue
@@ -1,13 +1,6 @@
-
+
@@ -18,12 +11,21 @@ export default {
name: 'PlayerButtonShuffle',
props: {
- icon_style: String
+ icon_size: {
+ type: Number,
+ default: 16
+ }
},
computed: {
is_shuffle() {
return this.$store.state.player.shuffle
+ },
+ icon_name() {
+ if (this.is_shuffle) {
+ return 'shuffle'
+ }
+ return 'shuffle-disabled'
}
},
diff --git a/web-src/src/components/SpotifyModalDialogAlbum.vue b/web-src/src/components/SpotifyModalDialogAlbum.vue
index f1d6a9f7..66f92432 100644
--- a/web-src/src/components/SpotifyModalDialogAlbum.vue
+++ b/web-src/src/components/SpotifyModalDialogAlbum.vue
@@ -43,15 +43,19 @@
diff --git a/web-src/src/components/SpotifyModalDialogArtist.vue b/web-src/src/components/SpotifyModalDialogArtist.vue
index 96cb6711..09ad7557 100644
--- a/web-src/src/components/SpotifyModalDialogArtist.vue
+++ b/web-src/src/components/SpotifyModalDialogArtist.vue
@@ -27,15 +27,19 @@
diff --git a/web-src/src/components/SpotifyModalDialogPlaylist.vue b/web-src/src/components/SpotifyModalDialogPlaylist.vue
index 45c58d28..b35c8827 100644
--- a/web-src/src/components/SpotifyModalDialogPlaylist.vue
+++ b/web-src/src/components/SpotifyModalDialogPlaylist.vue
@@ -30,15 +30,19 @@
diff --git a/web-src/src/components/SpotifyModalDialogTrack.vue b/web-src/src/components/SpotifyModalDialogTrack.vue
index 5dfe46b9..bad0863a 100644
--- a/web-src/src/components/SpotifyModalDialogTrack.vue
+++ b/web-src/src/components/SpotifyModalDialogTrack.vue
@@ -51,15 +51,19 @@
diff --git a/web-src/src/components/TabsAudiobooks.vue b/web-src/src/components/TabsAudiobooks.vue
index be7ce5e7..29a86e03 100644
--- a/web-src/src/components/TabsAudiobooks.vue
+++ b/web-src/src/components/TabsAudiobooks.vue
@@ -13,7 +13,7 @@
Authors
@@ -27,7 +27,7 @@
Audiobooks
diff --git a/web-src/src/components/TabsMusic.vue b/web-src/src/components/TabsMusic.vue
index 38f8b2f4..f26d2595 100644
--- a/web-src/src/components/TabsMusic.vue
+++ b/web-src/src/components/TabsMusic.vue
@@ -12,7 +12,9 @@
>
-
+
Browse
@@ -25,7 +27,7 @@
Artists
@@ -39,7 +41,7 @@
Albums
@@ -53,7 +55,7 @@
Genres
@@ -67,7 +69,7 @@
Composers
@@ -82,7 +84,7 @@
Spotify
diff --git a/web-src/src/components/TabsSearch.vue b/web-src/src/components/TabsSearch.vue
index 23acc8df..6344fdf0 100644
--- a/web-src/src/components/TabsSearch.vue
+++ b/web-src/src/components/TabsSearch.vue
@@ -5,18 +5,26 @@
- -
+
-
Library
- -
+
-
Spotify
diff --git a/web-src/src/icons.js b/web-src/src/icons.js
new file mode 100644
index 00000000..b8a7c2ff
--- /dev/null
+++ b/web-src/src/icons.js
@@ -0,0 +1,117 @@
+import {
+ mdiAccountMusic,
+ mdiAlbum,
+ mdiArrowCollapseDown,
+ mdiBookOpenVariant,
+ mdiBookOpenPageVariant,
+ mdiBookshelf,
+ mdiCancel,
+ mdiCast,
+ mdiCastVariant,
+ mdiCellphone,
+ mdiCheck,
+ mdiChevronDown,
+ mdiChevronUp,
+ mdiContentSave,
+ mdiDelete,
+ mdiDeleteEmpty,
+ mdiDotsHorizontal,
+ mdiDotsVertical,
+ mdiDragHorizontal,
+ mdiFastForward,
+ mdiFileMusic,
+ mdiFileOutline,
+ mdiFire,
+ mdiFolder,
+ mdiFolderOpen,
+ mdiMagnify,
+ mdiMenu,
+ mdiMicrophone,
+ mdiMusic,
+ mdiMusicBoxMultiple,
+ mdiPause,
+ mdiPencil,
+ mdiPipe,
+ mdiPlay,
+ mdiPlaylistPlay,
+ mdiPlaylistPlus,
+ mdiRadio,
+ mdiRadioTower,
+ mdiRefresh,
+ mdiRepeat,
+ mdiRepeatOff,
+ mdiRepeatOnce,
+ mdiRewind,
+ mdiRss,
+ mdiServer,
+ mdiShuffle,
+ mdiShuffleDisabled,
+ mdiSkipBackward,
+ mdiSkipForward,
+ mdiSpeaker,
+ mdiSpotify,
+ mdiStop,
+ mdiSubdirectoryArrowLeft,
+ mdiVolumeHigh,
+ mdiVolumeOff,
+ mdiWeb
+} from '@mdi/js'
+
+export const icons = {
+ mdiAccountMusic,
+ mdiAlbum,
+ mdiArrowCollapseDown,
+ mdiBookOpenVariant,
+ mdiBookOpenPageVariant,
+ mdiBookshelf,
+ mdiCancel,
+ mdiCast,
+ mdiCastVariant,
+ mdiCellphone,
+ mdiCheck,
+ mdiChevronDown,
+ mdiChevronUp,
+ mdiContentSave,
+ mdiDelete,
+ mdiDeleteEmpty,
+ mdiDotsHorizontal,
+ mdiDotsVertical,
+ mdiDragHorizontal,
+ mdiFastForward,
+ mdiFileMusic,
+ mdiFileOutline,
+ mdiFire,
+ mdiFolder,
+ mdiFolderOpen,
+ mdiMagnify,
+ mdiMenu,
+ mdiMicrophone,
+ mdiMusic,
+ mdiMusicBoxMultiple,
+ mdiPause,
+ mdiPencil,
+ mdiPipe,
+ mdiPlay,
+ mdiPlaylistPlay,
+ mdiPlaylistPlus,
+ mdiRadio,
+ mdiRadioTower,
+ mdiRefresh,
+ mdiRepeat,
+ mdiRepeatOff,
+ mdiRepeatOnce,
+ mdiRewind,
+ mdiRss,
+ mdiServer,
+ mdiShuffle,
+ mdiShuffleDisabled,
+ mdiSkipBackward,
+ mdiSkipForward,
+ mdiSpeaker,
+ mdiSpotify,
+ mdiStop,
+ mdiSubdirectoryArrowLeft,
+ mdiVolumeHigh,
+ mdiVolumeOff,
+ mdiWeb
+}
diff --git a/web-src/src/main copy.js b/web-src/src/main copy.js
deleted file mode 100644
index 470febea..00000000
--- a/web-src/src/main copy.js
+++ /dev/null
@@ -1,31 +0,0 @@
-// The Vue build version to load with the `import` command
-// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
-import Vue from 'vue'
-import App from './App'
-import { router } from './router'
-import store from './store'
-import './filter'
-import './progress'
-import vClickOutside from 'v-click-outside'
-import VueTinyLazyloadImg from 'vue-tiny-lazyload-img'
-import VueObserveVisibility from 'vue-observe-visibility'
-import VueScrollTo from 'vue-scrollto'
-import 'mdi/css/materialdesignicons.css'
-import 'vue-range-slider/dist/vue-range-slider.css'
-import './mystyles.scss'
-
-Vue.config.productionTip = false
-
-Vue.use(vClickOutside)
-Vue.use(VueTinyLazyloadImg)
-Vue.use(VueObserveVisibility)
-Vue.use(VueScrollTo)
-
-/* eslint-disable no-new */
-new Vue({
- el: '#app',
- router,
- store,
- components: { App },
- template: ''
-})
diff --git a/web-src/src/main.js b/web-src/src/main.js
index 60414d4b..84e1c8ec 100644
--- a/web-src/src/main.js
+++ b/web-src/src/main.js
@@ -5,11 +5,12 @@ import VueProgressBar from '@aacassandra/vue3-progressbar'
import VueClickAway from 'vue3-click-away'
import VueLazyLoad from 'vue3-lazyload'
import VueScrollTo from 'vue-scrollto'
+import mdiVue from 'mdi-vue/v3'
import { filters } from './filter'
+import { icons } from './icons'
import App from './App.vue'
import './mystyles.scss'
-import 'mdi/css/materialdesignicons.css'
import '@vueform/slider/themes/default.css'
const app = createApp(App)
@@ -26,6 +27,9 @@ const app = createApp(App)
log: false
})
.use(VueScrollTo)
+ .use(mdiVue, {
+ icons: icons
+ })
app.config.globalProperties.$filters = filters
app.mount('#app')
diff --git a/web-src/src/pages/PageAlbum.vue b/web-src/src/pages/PageAlbum.vue
index b7fd9a3b..dc14a5c7 100644
--- a/web-src/src/pages/PageAlbum.vue
+++ b/web-src/src/pages/PageAlbum.vue
@@ -10,16 +10,14 @@
diff --git a/web-src/src/pages/PageArtist.vue b/web-src/src/pages/PageArtist.vue
index 9783618f..9b0049d7 100644
--- a/web-src/src/pages/PageArtist.vue
+++ b/web-src/src/pages/PageArtist.vue
@@ -22,12 +22,10 @@
class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true"
>
-
+
-
+
Shuffle
diff --git a/web-src/src/pages/PageArtistTracks.vue b/web-src/src/pages/PageArtistTracks.vue
index 2a2f7022..4e1499d7 100644
--- a/web-src/src/pages/PageArtistTracks.vue
+++ b/web-src/src/pages/PageArtistTracks.vue
@@ -16,11 +16,11 @@
@click="show_artist_details_modal = true"
>
-
+
Shuffle
diff --git a/web-src/src/pages/PageAudiobooksAlbum.vue b/web-src/src/pages/PageAudiobooksAlbum.vue
index b89b1d61..b7433caf 100644
--- a/web-src/src/pages/PageAudiobooksAlbum.vue
+++ b/web-src/src/pages/PageAudiobooksAlbum.vue
@@ -10,16 +10,14 @@
diff --git a/web-src/src/pages/PageAudiobooksArtist.vue b/web-src/src/pages/PageAudiobooksArtist.vue
index a69ada65..658a5b5a 100644
--- a/web-src/src/pages/PageAudiobooksArtist.vue
+++ b/web-src/src/pages/PageAudiobooksArtist.vue
@@ -11,12 +11,10 @@
class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true"
>
-
+
-
+
Shuffle
diff --git a/web-src/src/pages/PageComposer.vue b/web-src/src/pages/PageComposer.vue
index 95421ae9..da08b9e4 100644
--- a/web-src/src/pages/PageComposer.vue
+++ b/web-src/src/pages/PageComposer.vue
@@ -13,11 +13,11 @@
@click="show_composer_details_modal = true"
>
-
+
Shuffle
diff --git a/web-src/src/pages/PageComposerTracks.vue b/web-src/src/pages/PageComposerTracks.vue
index def23664..b8710cb5 100644
--- a/web-src/src/pages/PageComposerTracks.vue
+++ b/web-src/src/pages/PageComposerTracks.vue
@@ -13,11 +13,11 @@
@click="show_composer_details_modal = true"
>
-
+
Shuffle
diff --git a/web-src/src/pages/PageFiles.vue b/web-src/src/pages/PageFiles.vue
index 4ccd392b..4e3a2933 100644
--- a/web-src/src/pages/PageFiles.vue
+++ b/web-src/src/pages/PageFiles.vue
@@ -14,11 +14,11 @@
@click="open_directory_dialog({ path: current_directory })"
>
-
+
Play
diff --git a/web-src/src/pages/PageGenre.vue b/web-src/src/pages/PageGenre.vue
index 11eeee0f..965cf0f0 100644
--- a/web-src/src/pages/PageGenre.vue
+++ b/web-src/src/pages/PageGenre.vue
@@ -16,11 +16,11 @@
@click="show_genre_details_modal = true"
>
-
+
Shuffle
diff --git a/web-src/src/pages/PageGenreTracks.vue b/web-src/src/pages/PageGenreTracks.vue
index 985c5ce4..f0099201 100644
--- a/web-src/src/pages/PageGenreTracks.vue
+++ b/web-src/src/pages/PageGenreTracks.vue
@@ -16,11 +16,11 @@
@click="show_genre_details_modal = true"
>
-
+
Shuffle
diff --git a/web-src/src/pages/PagePlaylist.vue b/web-src/src/pages/PagePlaylist.vue
index b6855d90..7d31491a 100644
--- a/web-src/src/pages/PagePlaylist.vue
+++ b/web-src/src/pages/PagePlaylist.vue
@@ -11,12 +11,10 @@
class="button is-small is-light is-rounded"
@click="show_playlist_details_modal = true"
>
-
+
-
+
Shuffle
diff --git a/web-src/src/pages/PagePodcast.vue b/web-src/src/pages/PagePodcast.vue
index 7b0a118d..4cee531b 100644
--- a/web-src/src/pages/PagePodcast.vue
+++ b/web-src/src/pages/PagePodcast.vue
@@ -11,13 +11,11 @@
class="button is-small is-light is-rounded"
@click="show_album_details_modal = true"
>
-
+
-
+
Play
diff --git a/web-src/src/pages/PagePodcasts.vue b/web-src/src/pages/PagePodcasts.vue
index 831bc1d1..4a79395a 100644
--- a/web-src/src/pages/PagePodcasts.vue
+++ b/web-src/src/pages/PagePodcasts.vue
@@ -8,7 +8,7 @@
@@ -36,7 +34,7 @@
diff --git a/web-src/src/pages/SpotifyPageSearch.vue b/web-src/src/pages/SpotifyPageSearch.vue
index 7f76d15b..eec19025 100644
--- a/web-src/src/pages/SpotifyPageSearch.vue
+++ b/web-src/src/pages/SpotifyPageSearch.vue
@@ -17,7 +17,7 @@
autocomplete="off"
/>
-
+
@@ -55,7 +55,7 @@
@@ -105,7 +105,7 @@
@@ -166,7 +166,7 @@
@@ -215,7 +215,7 @@
diff --git a/web-src/src/templates/ContentWithHeading.vue b/web-src/src/templates/ContentWithHeading.vue
index cf649dcd..f499ebc9 100644
--- a/web-src/src/templates/ContentWithHeading.vue
+++ b/web-src/src/templates/ContentWithHeading.vue
@@ -15,14 +15,14 @@
class="button is-small is-white"
@click="scroll_to_top"
>
From 45b192255aa3fe580715ab7e1b4762a69732747b Mon Sep 17 00:00:00 2001
From: chme
Date: Sat, 16 Apr 2022 20:21:26 +0200
Subject: [PATCH 2/4] [web] Show stream playlists (rss, radio) only if config
option "radio_playlists" is set to `true`
---
web-src/src/components/ListPlaylists.vue | 10 +++----
.../src/components/ModalDialogPlaylist.vue | 4 +++
web-src/src/pages/PagePlaylists.vue | 27 ++++++++++++++++---
3 files changed, 32 insertions(+), 9 deletions(-)
diff --git a/web-src/src/components/ListPlaylists.vue b/web-src/src/components/ListPlaylists.vue
index ccf7f3ad..b5b60003 100644
--- a/web-src/src/components/ListPlaylists.vue
+++ b/web-src/src/components/ListPlaylists.vue
@@ -1,23 +1,23 @@
-
+
@@ -16,6 +16,7 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ListPlaylists from '@/components/ListPlaylists.vue'
import webapi from '@/webapi'
+import { GroupByList, noop } from '@/lib/GroupByList'
const dataObject = {
load: function (to) {
@@ -27,7 +28,7 @@ const dataObject = {
set: function (vm, response) {
vm.playlist = response[0].data
- vm.playlists = response[1].data
+ vm.playlists_list = new GroupByList(response[1].data)
}
}
@@ -51,7 +52,25 @@ export default {
data() {
return {
playlist: {},
- playlists: {}
+ playlists_list: new GroupByList()
+ }
+ },
+
+ computed: {
+ radio_playlists() {
+ return this.$store.state.config.radio_playlists
+ },
+
+ playlists() {
+ this.playlists_list.group(noop(), [
+ (playlist) =>
+ playlist.folder ||
+ this.radio_playlists ||
+ playlist.stream_count === 0 ||
+ playlist.item_count > playlist.stream_count
+ ])
+
+ return this.playlists_list
}
}
}
From 42e708fbb48cef88b10a2af82f61027aa1ad3788 Mon Sep 17 00:00:00 2001
From: chme
Date: Sun, 17 Apr 2022 07:48:58 +0200
Subject: [PATCH 3/4] [web] Fix display of search results for composer and
playlist
---
web-src/src/pages/PageSearch.vue | 18 +++++++-----------
1 file changed, 7 insertions(+), 11 deletions(-)
diff --git a/web-src/src/pages/PageSearch.vue b/web-src/src/pages/PageSearch.vue
index a229d6ab..3512c564 100644
--- a/web-src/src/pages/PageSearch.vue
+++ b/web-src/src/pages/PageSearch.vue
@@ -131,7 +131,7 @@
Composers
-
+
@@ -157,7 +157,7 @@
Playlists
-
+