From 0890a44c0bc9a4e3e998bd174c897379be3f889c Mon Sep 17 00:00:00 2001 From: advplyr Date: Sat, 17 Dec 2022 14:48:56 -0600 Subject: [PATCH] Update:Remove call to server for settings filter/sort/playback rate --- components/app/AudioPlayerContainer.vue | 4 +- components/bookshelf/LazyBookshelf.vue | 4 +- components/home/BookshelfToolbar.vue | 7 +- ios/App/Podfile | 12 ++-- layouts/default.vue | 7 +- plugins/init.client.js | 6 +- plugins/localStore.js | 2 +- store/user.js | 85 ++++++++++--------------- 8 files changed, 52 insertions(+), 75 deletions(-) diff --git a/components/app/AudioPlayerContainer.vue b/components/app/AudioPlayerContainer.vue index c96ab6b8..618e8865 100644 --- a/components/app/AudioPlayerContainer.vue +++ b/components/app/AudioPlayerContainer.vue @@ -273,7 +273,7 @@ export default { this.$eventBus.$on('pause-item', this.pauseItem) this.$eventBus.$on('close-stream', this.closeStreamOnly) this.$eventBus.$on('cast-local-item', this.castLocalItem) - this.$store.commit('user/addSettingsListener', { id: 'streamContainer', meth: this.settingsUpdated }) + this.$eventBus.$on('user-settings', this.settingsUpdated) }, beforeDestroy() { if (this.onLocalMediaProgressUpdateListener) this.onLocalMediaProgressUpdateListener.remove() @@ -286,7 +286,7 @@ export default { this.$eventBus.$off('pause-item', this.pauseItem) this.$eventBus.$off('close-stream', this.closeStreamOnly) this.$eventBus.$off('cast-local-item', this.castLocalItem) - this.$store.commit('user/removeSettingsListener', 'streamContainer') + this.$eventBus.$off('user-settings', this.settingsUpdated) } } \ No newline at end of file diff --git a/components/bookshelf/LazyBookshelf.vue b/components/bookshelf/LazyBookshelf.vue index 3fd0aaf0..d3db9dea 100644 --- a/components/bookshelf/LazyBookshelf.vue +++ b/components/bookshelf/LazyBookshelf.vue @@ -453,7 +453,7 @@ export default { } this.$eventBus.$on('library-changed', this.libraryChanged) - this.$store.commit('user/addSettingsListener', { id: 'lazy-bookshelf', meth: this.settingsUpdated }) + this.$eventBus.$on('user-settings', this.settingsUpdated) this.$socket.$on('item_updated', this.libraryItemUpdated) this.$socket.$on('item_added', this.libraryItemAdded) @@ -468,7 +468,7 @@ export default { } this.$eventBus.$off('library-changed', this.libraryChanged) - this.$store.commit('user/removeSettingsListener', 'lazy-bookshelf') + this.$eventBus.$off('user-settings', this.settingsUpdated) this.$socket.$off('item_updated', this.libraryItemUpdated) this.$socket.$off('item_added', this.libraryItemAdded) diff --git a/components/home/BookshelfToolbar.vue b/components/home/BookshelfToolbar.vue index 45b8ec0d..912aa0c7 100644 --- a/components/home/BookshelfToolbar.vue +++ b/components/home/BookshelfToolbar.vue @@ -87,8 +87,7 @@ export default { this.saveSettings() }, saveSettings() { - this.$store.commit('user/setSettings', this.settings) // Immediate update - this.$store.dispatch('user/updateUserSettings', this.settings) // TODO: No need to update settings on server... + this.$store.dispatch('user/updateUserSettings', this.settings) }, async init() { this.bookshelfListView = await this.$localStore.getBookshelfListView() @@ -111,11 +110,11 @@ export default { mounted() { this.init() this.$eventBus.$on('bookshelf-total-entities', this.setTotalEntities) - this.$store.commit('user/addSettingsListener', { id: 'bookshelftoolbar', meth: this.settingsUpdated }) + this.$eventBus.$on('user-settings', this.settingsUpdated) }, beforeDestroy() { this.$eventBus.$off('bookshelf-total-entities', this.setTotalEntities) - this.$store.commit('user/removeSettingsListener', 'bookshelftoolbar') + this.$eventBus.$off('user-settings', this.settingsUpdated) } } diff --git a/ios/App/Podfile b/ios/App/Podfile index f3ac5ff3..331b14d2 100644 --- a/ios/App/Podfile +++ b/ios/App/Podfile @@ -9,12 +9,12 @@ install! 'cocoapods', :disable_input_output_paths => true def capacitor_pods pod 'Capacitor', :path => '../../node_modules/@capacitor/ios' pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios' - pod 'CapacitorApp', :path => '../../node_modules/@capacitor/app' - pod 'CapacitorDialog', :path => '../../node_modules/@capacitor/dialog' - pod 'CapacitorHaptics', :path => '../../node_modules/@capacitor/haptics' - pod 'CapacitorNetwork', :path => '../../node_modules/@capacitor/network' - pod 'CapacitorStatusBar', :path => '../../node_modules/@capacitor/status-bar' - pod 'CapacitorStorage', :path => '../../node_modules/@capacitor/storage' + pod 'CapacitorApp', :path => '..\..\node_modules\@capacitor\app' + pod 'CapacitorDialog', :path => '..\..\node_modules\@capacitor\dialog' + pod 'CapacitorHaptics', :path => '..\..\node_modules\@capacitor\haptics' + pod 'CapacitorNetwork', :path => '..\..\node_modules\@capacitor\network' + pod 'CapacitorStatusBar', :path => '..\..\node_modules\@capacitor\status-bar' + pod 'CapacitorStorage', :path => '..\..\node_modules\@capacitor\storage' pod 'CordovaPlugins', :path => '../capacitor-cordova-ios-plugins' end diff --git a/layouts/default.vue b/layouts/default.vue index 1f5a76d6..3c4754b5 100644 --- a/layouts/default.vue +++ b/layouts/default.vue @@ -76,15 +76,12 @@ export default { } }, async loadSavedSettings() { - var userSavedServerSettings = await this.$localStore.getServerSettings() + const userSavedServerSettings = await this.$localStore.getServerSettings() if (userSavedServerSettings) { this.$store.commit('setServerSettings', userSavedServerSettings) } - var userSavedSettings = await this.$localStore.getUserSettings() - if (userSavedSettings) { - this.$store.commit('user/setSettings', userSavedSettings) - } + await this.$store.dispatch('user/loadUserSettings') }, async attemptConnection() { console.warn('[default] attemptConnection') diff --git a/plugins/init.client.js b/plugins/init.client.js index aab159f9..5fd70ea0 100644 --- a/plugins/init.client.js +++ b/plugins/init.client.js @@ -5,8 +5,6 @@ import { StatusBar, Style } from '@capacitor/status-bar'; import { formatDistance, format, addDays, isDate } from 'date-fns' import { Capacitor } from '@capacitor/core'; -Vue.prototype.$eventBus = new Vue() - if (Capacitor.getPlatform() != 'web') { const setStatusBarStyleDark = async () => { await StatusBar.setStyle({ style: Style.Dark }) @@ -206,7 +204,9 @@ Vue.prototype.$setOrientationLock = (orientationLockSetting) => { } } -export default ({ store, app }) => { +export default ({ store, app }, inject) => { + inject('eventBus', new Vue()) + // iOS Only // backButton event does not work with iOS swipe navigation so use this workaround if (app.router && Capacitor.getPlatform() === 'ios') { diff --git a/plugins/localStore.js b/plugins/localStore.js index b0ee0094..f7119512 100644 --- a/plugins/localStore.js +++ b/plugins/localStore.js @@ -15,7 +15,7 @@ class LocalStorage { async getUserSettings() { try { - var settingsObj = await Storage.get({ key: 'userSettings' }) || {} + const settingsObj = await Storage.get({ key: 'userSettings' }) || {} return settingsObj.value ? JSON.parse(settingsObj.value) : null } catch (error) { console.error('[LocalStorage] Failed to get user settings', error) diff --git a/store/user.js b/store/user.js index ae976964..1e3fc578 100644 --- a/store/user.js +++ b/store/user.js @@ -5,13 +5,8 @@ export const state = () => ({ mobileOrderBy: 'addedAt', mobileOrderDesc: true, mobileFilterBy: 'all', - orderBy: 'book.title', - orderDesc: false, - filterBy: 'all', - playbackRate: 1, - bookshelfCoverSize: 120 - }, - settingsListeners: [] + playbackRate: 1 + } }) export const getters = { @@ -54,7 +49,7 @@ export const getters = { export const actions = { // When changing libraries make sure sort and filter is still valid checkUpdateLibrarySortFilter({ state, dispatch, commit }, mediaType) { - var settingsUpdate = {} + const settingsUpdate = {} if (mediaType == 'podcast') { if (state.settings.mobileOrderBy == 'media.metadata.authorName' || state.settings.mobileOrderBy == 'media.metadata.authorNameLF') { settingsUpdate.mobileOrderBy = 'media.metadata.author' @@ -65,10 +60,10 @@ export const actions = { if (state.settings.mobileOrderBy == 'media.metadata.publishedYear') { settingsUpdate.mobileOrderBy = 'media.metadata.title' } - var invalidFilters = ['series', 'authors', 'narrators', 'languages', 'progress', 'issues'] - var filterByFirstPart = (state.settings.mobileFilterBy || '').split('.').shift() + const invalidFilters = ['series', 'authors', 'narrators', 'languages', 'progress', 'issues'] + const filterByFirstPart = (state.settings.mobileFilterBy || '').split('.').shift() if (invalidFilters.includes(filterByFirstPart)) { - settingsUpdate.filterBy = 'all' + settingsUpdate.mobileFilterBy = 'all' } } else { if (state.settings.mobileOrderBy == 'media.metadata.author') { @@ -83,24 +78,34 @@ export const actions = { } }, async updateUserSettings({ state, commit }, payload) { - if (state.serverConnectionConfig) { - var updatePayload = { - ...payload + if (!payload) return false + + let hasChanges = false + const existingSettings = { ...state.settings } + for (const key in existingSettings) { + if (payload[key] !== undefined && existingSettings[key] !== payload[key]) { + hasChanges = true + existingSettings[key] = payload[key] } - return this.$axios.$patch('/api/me/settings', updatePayload).then((result) => { - if (result.success) { - commit('setSettings', result.settings) - return true - } else { - return false + } + if (hasChanges) { + await this.$localStore.setUserSettings(existingSettings) + commit('setSettings', existingSettings) + this.$eventBus.$emit('user-settings', state.settings) + } + }, + async loadUserSettings({ state, commit }) { + const userSettingsFromLocal = await this.$localStore.getUserSettings() + + if (userSettingsFromLocal) { + const userSettings = { ...state.settings } + for (const key in userSettings) { + if (userSettingsFromLocal[key] !== undefined) { + userSettings[key] = userSettingsFromLocal[key] } - }).catch((error) => { - console.error('Failed to update settings', error) - return false - }) - } else { - console.log('Update settings without server') - commit('setSettings', payload) + } + commit('setSettings', userSettings) + this.$eventBus.$emit('user-settings', state.settings) } } } @@ -131,30 +136,6 @@ export const mutations = { }, setSettings(state, settings) { if (!settings) return - - var hasChanges = false - for (const key in settings) { - if (state.settings[key] !== settings[key]) { - if (key === 'mobileOrderBy' && settings[key] === 'recent') { - settings[key] = 'addedAt' - } - hasChanges = true - state.settings[key] = settings[key] - } - } - if (hasChanges) { - this.$localStore.setUserSettings({ ...state.settings }) - state.settingsListeners.forEach((listener) => { - listener.meth(state.settings) - }) - } - }, - addSettingsListener(state, listener) { - var index = state.settingsListeners.findIndex(l => l.id === listener.id) - if (index >= 0) state.settingsListeners.splice(index, 1, listener) - else state.settingsListeners.push(listener) - }, - removeSettingsListener(state, listenerId) { - state.settingsListeners = state.settingsListeners.filter(l => l.id !== listenerId) + state.settings = settings } } \ No newline at end of file