From 3941da1144b9b08500ebd7b930b0ad5ac1d64d8e Mon Sep 17 00:00:00 2001 From: advplyr Date: Sat, 27 Nov 2021 20:11:35 -0600 Subject: [PATCH] Add:Experimental change bookshelf texture #186 --- client/assets/app.css | 4 ++ client/components/app/Appbar.vue | 3 + client/components/app/BookShelf.vue | 14 +++- .../components/app/BookShelfCategorized.vue | 12 +++- client/components/app/BookShelfRow.vue | 7 +- .../modals/BookshelfTextureModal.vue | 68 ++++++++++++++++++ client/components/modals/Modal.vue | 6 +- client/layouts/default.vue | 1 + client/package.json | 2 +- client/pages/config/index.vue | 7 ++ client/static/textures/leather1.jpg | Bin 0 -> 58447 bytes client/static/textures/wood1.png | Bin 0 -> 144054 bytes client/static/textures/wood2.png | Bin 0 -> 214313 bytes client/static/textures/wood3.png | Bin 0 -> 524710 bytes client/static/textures/wood4.png | Bin 0 -> 134716 bytes .../wood_default.jpg} | Bin client/store/globals.js | 7 +- client/store/index.js | 11 ++- package-lock.json | 2 +- package.json | 2 +- 20 files changed, 136 insertions(+), 10 deletions(-) create mode 100644 client/components/modals/BookshelfTextureModal.vue create mode 100644 client/static/textures/leather1.jpg create mode 100644 client/static/textures/wood1.png create mode 100644 client/static/textures/wood2.png create mode 100644 client/static/textures/wood3.png create mode 100644 client/static/textures/wood4.png rename client/static/{wood_panels.jpg => textures/wood_default.jpg} (100%) diff --git a/client/assets/app.css b/client/assets/app.css index a7dda9d0..25b8b451 100644 --- a/client/assets/app.css +++ b/client/assets/app.css @@ -2,6 +2,10 @@ @import './transitions.css'; @import './draggable.css'; +:root { + --bookshelf-texture-img: url(/textures/wood_default.jpg); +} + .page { width: 100%; height: calc(100% - 64px); diff --git a/client/components/app/Appbar.vue b/client/components/app/Appbar.vue index cdd26666..70afc10a 100644 --- a/client/components/app/Appbar.vue +++ b/client/components/app/Appbar.vue @@ -133,6 +133,9 @@ export default { } }, methods: { + toggleBookshelfTexture() { + this.$store.dispatch('setBookshelfTexture', 'wood2.png') + }, async back() { var popped = await this.$store.dispatch('popRoute') if (popped) this.$store.commit('setIsRoutingBack', true) diff --git a/client/components/app/BookShelf.vue b/client/components/app/BookShelf.vue index 0d5fa595..c06661a7 100644 --- a/client/components/app/BookShelf.vue +++ b/client/components/app/BookShelf.vue @@ -2,13 +2,17 @@
-
+
remove

{{ bookCoverWidth }}

add
+ +
+

Texture

+

Your Audiobookshelf is empty!

@@ -110,6 +114,9 @@ export default { } }, computed: { + showExperimentalFeatures() { + return this.$store.state.showExperimentalFeatures + }, isGridMode() { return this.viewMode === 'grid' }, @@ -226,6 +233,9 @@ export default { } }, methods: { + showBookshelfTextureModal() { + this.$store.commit('globals/setShowBookshelfTextureModal', true) + }, editBook(audiobook) { var bookIds = this.entities.map((e) => e.id) this.$store.commit('setBookshelfBookIds', bookIds) @@ -455,7 +465,7 @@ export default {