From 9ea7af02156e6b11bb764a04437460b68e02d946 Mon Sep 17 00:00:00 2001 From: chme Date: Sat, 6 Jul 2019 08:11:30 +0200 Subject: [PATCH 1/7] [web-src] Opening burger menu should not change scroll position of current page --- web-src/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web-src/src/App.vue b/web-src/src/App.vue index 2286733d..51f38a4c 100644 --- a/web-src/src/App.vue +++ b/web-src/src/App.vue @@ -3,7 +3,7 @@ - + From 02478becf06eedc0e337739ad430719c90f400bd Mon Sep 17 00:00:00 2001 From: chme Date: Sat, 6 Jul 2019 08:31:00 +0200 Subject: [PATCH 2/7] [web-src] Small styling changes for the navbar/burger menu - remove arrows from volume and setting dropdown links - display categories in burger menu with bold text for better visual seperation --- web-src/src/components/NavbarTop.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/web-src/src/components/NavbarTop.vue b/web-src/src/components/NavbarTop.vue index d7fdda10..62954bc4 100644 --- a/web-src/src/components/NavbarTop.vue +++ b/web-src/src/components/NavbarTop.vue @@ -32,7 +32,7 @@
- Volume + Volume
@@ -111,7 +111,7 @@
- Settings + Settings
Admin From 7d9f6738eb93a29693b7cc1448c0cd804bb5860f Mon Sep 17 00:00:00 2001 From: chme Date: Sat, 6 Jul 2019 09:21:47 +0200 Subject: [PATCH 3/7] [web-src] Add helper function to append max size to artwork url --- web-src/src/components/ModalDialogAlbum.vue | 5 +---- web-src/src/pages/PageNowPlaying.vue | 5 +---- web-src/src/webapi/index.js | 10 ++++++++++ 3 files changed, 12 insertions(+), 8 deletions(-) diff --git a/web-src/src/components/ModalDialogAlbum.vue b/web-src/src/components/ModalDialogAlbum.vue index 760fbc79..e8cbcb75 100644 --- a/web-src/src/components/ModalDialogAlbum.vue +++ b/web-src/src/components/ModalDialogAlbum.vue @@ -61,10 +61,7 @@ export default { computed: { artwork_url: function () { - if (this.album.artwork_url && this.album.artwork_url.startsWith('/')) { - return this.album.artwork_url + '?maxwidth=600&maxheight=600' - } - return this.album.artwork_url + return webapi.artwork_url_append_size_params(this.album.artwork_url) } }, diff --git a/web-src/src/pages/PageNowPlaying.vue b/web-src/src/pages/PageNowPlaying.vue index 4ae0b8a6..9537b2da 100644 --- a/web-src/src/pages/PageNowPlaying.vue +++ b/web-src/src/pages/PageNowPlaying.vue @@ -107,10 +107,7 @@ export default { }, artwork_url: function () { - if (this.now_playing.artwork_url && this.now_playing.artwork_url.startsWith('/')) { - return this.now_playing.artwork_url + '?maxwidth=600&maxheight=600' - } - return this.now_playing.artwork_url + return webapi.artwork_url_append_size_params(this.now_playing.artwork_url) } }, diff --git a/web-src/src/webapi/index.js b/web-src/src/webapi/index.js index a7c3f84f..82cd0e34 100644 --- a/web-src/src/webapi/index.js +++ b/web-src/src/webapi/index.js @@ -302,5 +302,15 @@ export default { spotify () { return axios.get('/api/spotify') + }, + + artwork_url_append_size_params (artworkUrl, maxwidth = 600, maxheight = 600) { + if (artworkUrl && artworkUrl.startsWith('/')) { + if (artworkUrl.includes('?')) { + return artworkUrl + '&maxwidth=' + maxwidth + '&maxheight=' + maxheight + } + return artworkUrl + '?maxwidth=' + maxwidth + '&maxheight=' + maxheight + } + return artworkUrl } } From 79f3faf991f0d893424584bcd4cd51dbc5eef811 Mon Sep 17 00:00:00 2001 From: chme Date: Sat, 6 Jul 2019 10:21:37 +0200 Subject: [PATCH 4/7] [web-src] Dirty hack to avoid page jumping during navigation Without this vue (router) renders the page navigating to in the center first and then the page jumps to the top. --- web-src/src/App.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/web-src/src/App.vue b/web-src/src/App.vue index 51f38a4c..324fea86 100644 --- a/web-src/src/App.vue +++ b/web-src/src/App.vue @@ -3,7 +3,8 @@ - + + From 5fff68bb13dc88b22290c570cec28465599a62d2 Mon Sep 17 00:00:00 2001 From: chme Date: Sat, 6 Jul 2019 12:54:33 +0200 Subject: [PATCH 5/7] [web-src] Consolidate burger menu handling on route change in router/index.js --- web-src/src/App.vue | 3 --- web-src/src/router/index.js | 9 +++------ 2 files changed, 3 insertions(+), 9 deletions(-) diff --git a/web-src/src/App.vue b/web-src/src/App.vue index 324fea86..b84c1e18 100644 --- a/web-src/src/App.vue +++ b/web-src/src/App.vue @@ -182,9 +182,6 @@ export default { }, watch: { - '$route' (to, from) { - this.$store.commit(types.SHOW_BURGER_MENU, false) - }, 'show_burger_menu' () { if (this.show_burger_menu) { document.querySelector('html').classList.add('is-clipped') diff --git a/web-src/src/router/index.js b/web-src/src/router/index.js index 233230fb..1ea4cc7b 100644 --- a/web-src/src/router/index.js +++ b/web-src/src/router/index.js @@ -247,10 +247,7 @@ export const router = new VueRouter({ }) router.beforeEach((to, from, next) => { - if (store.state.show_burger_menu) { - store.commit(types.SHOW_BURGER_MENU, false) - next(false) - } else { - next() - } + const burgerMenuVisible = store.state.show_burger_menu + store.commit(types.SHOW_BURGER_MENU, false) + next(!burgerMenuVisible) }) From 03c50ba81ec88a6a28b29c9550e1d3b8f31ae90a Mon Sep 17 00:00:00 2001 From: chme Date: Sat, 6 Jul 2019 15:21:29 +0200 Subject: [PATCH 6/7] [web-src] Fix navbar links not working with burger menu visible --- web-src/src/components/NavbarItemLink.vue | 32 ++++++++++++++++++++ web-src/src/components/NavbarTop.vue | 37 ++++++++++------------- web-src/src/router/index.js | 4 ++- 3 files changed, 51 insertions(+), 22 deletions(-) create mode 100644 web-src/src/components/NavbarItemLink.vue diff --git a/web-src/src/components/NavbarItemLink.vue b/web-src/src/components/NavbarItemLink.vue new file mode 100644 index 00000000..5a1e85bf --- /dev/null +++ b/web-src/src/components/NavbarItemLink.vue @@ -0,0 +1,32 @@ + + + diff --git a/web-src/src/components/NavbarTop.vue b/web-src/src/components/NavbarTop.vue index 62954bc4..31ca1749 100644 --- a/web-src/src/components/NavbarTop.vue +++ b/web-src/src/components/NavbarTop.vue @@ -1,24 +1,24 @@