From 831e5c93987a05a716f64a78312f6c354c1b63f9 Mon Sep 17 00:00:00 2001 From: Travis Shivers Date: Wed, 20 May 2020 20:26:42 -0500 Subject: [PATCH] Initial settings cleanup --- package-lock.json | 64 +++++++++++-------- package.json | 3 +- src/store.js | 23 +++++-- src/store/modules/config/config.store.js | 2 +- .../modules/settings}/constants.js | 9 +-- src/store/modules/settings/settings.store.js | 53 +++++++++++++++ src/utils/helpers.js | 12 ++++ src/utils/settings.js | 38 ----------- 8 files changed, 125 insertions(+), 79 deletions(-) rename src/{utils => store/modules/settings}/constants.js (65%) create mode 100644 src/store/modules/settings/settings.store.js delete mode 100644 src/utils/settings.js diff --git a/package-lock.json b/package-lock.json index 178b6eb6..d1b39a5d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3212,6 +3212,11 @@ "integrity": "sha1-s2nW+128E+7PUk+RsHD+7cNXzzQ=", "dev": true }, + "deepmerge": { + "version": "4.2.2", + "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz", + "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==" + }, "define-property": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/define-property/-/define-property-2.0.2.tgz", @@ -3371,9 +3376,9 @@ } }, "dlv": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.2.tgz", - "integrity": "sha512-xxD4VSH67GbRvSGUrckvha94RD7hjgOH7rqGxiytLpkaeMvixOHFZTGFK6EkIm3T761OVHT8ABHmGkq9gXgu6Q==", + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/dlv/-/dlv-1.1.3.tgz", + "integrity": "sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==", "dev": true }, "doctrine": { @@ -8251,15 +8256,15 @@ "dev": true }, "prettier": { - "version": "1.13.5", - "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.13.5.tgz", - "integrity": "sha512-4M90mfvLz6yRf2Dhzd+xPIE6b4xkI8nHMJhsSm9IlfG17g6wujrrm7+H1X8x52tC4cSNm6HmuhCUSNe6Hd5wfw==", + "version": "1.19.1", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-1.19.1.tgz", + "integrity": "sha512-s7PoyDv/II1ObgQunCbB9PdLmUcBZcnWOcxDh7O0N/UwDEsHyqkW+Qh28jW+mVuCdx7gLB0BotYI1Y6uI9iyew==", "dev": true }, "prettier-eslint": { - "version": "8.8.1", - "resolved": "https://registry.npmjs.org/prettier-eslint/-/prettier-eslint-8.8.1.tgz", - "integrity": "sha512-8YMkJZnA+XVfEW6fPet05jpNmSQbD+Htbh/QyOxQcVf2GIUEZsnGP7ZScaM9Mq2Ra2261eCu60E7/TRIy9coXQ==", + "version": "8.8.2", + "resolved": "https://registry.npmjs.org/prettier-eslint/-/prettier-eslint-8.8.2.tgz", + "integrity": "sha512-2UzApPuxi2yRoyMlXMazgR6UcH9DKJhNgCviIwY3ixZ9THWSSrUww5vkiZ3C48WvpFl1M1y/oU63deSy1puWEA==", "dev": true, "requires": { "babel-runtime": "^6.26.0", @@ -8270,10 +8275,11 @@ "lodash.merge": "^4.6.0", "loglevel-colored-level-prefix": "^1.0.0", "prettier": "^1.7.0", - "pretty-format": "^22.0.3", + "pretty-format": "^23.0.1", "require-relative": "^0.8.7", "typescript": "^2.5.1", - "typescript-eslint-parser": "^11.0.0" + "typescript-eslint-parser": "^16.0.0", + "vue-eslint-parser": "^2.0.2" } }, "prettier-eslint-cli": { @@ -8350,9 +8356,9 @@ } }, "pretty-format": { - "version": "22.4.3", - "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-22.4.3.tgz", - "integrity": "sha512-S4oT9/sT6MN7/3COoOy+ZJeA92VmOnveLHgrwBE3Z1W5N9S2A1QGNYiE1z75DAENbJrXXUb+OWXhpJcg05QKQQ==", + "version": "23.6.0", + "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-23.6.0.tgz", + "integrity": "sha512-zf9NV1NSlDLDjycnwm6hpFATCGl/K1lt0R/GdkAK2O5LN/rwJoB+Mh93gGJjut4YbmecbfgLWVGSTCr0Ewvvbw==", "dev": true, "requires": { "ansi-regex": "^3.0.0", @@ -9272,6 +9278,11 @@ "rechoir": "^0.6.2" } }, + "shvl": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/shvl/-/shvl-2.0.0.tgz", + "integrity": "sha512-WbpzSvI5XgVGJ3A4ySGe8hBxj0JgJktfnoLhhJmvITDdK21WPVWwgG8GPlYEh4xqdti3Ff7PJ5G0QrRAjNS0Ig==" + }, "sigmund": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/sigmund/-/sigmund-1.0.1.tgz", @@ -10106,21 +10117,13 @@ "dev": true }, "typescript-eslint-parser": { - "version": "11.0.0", - "resolved": "https://registry.npmjs.org/typescript-eslint-parser/-/typescript-eslint-parser-11.0.0.tgz", - "integrity": "sha512-/fBHTBRBSorWQGKWOOjeMPkzd3o8cOPtFjTRwU5JLNGgVtmMa3KDkiw0R2n+H6ovo9y3OX30/5usm6YTqY44PQ==", + "version": "16.0.1", + "resolved": "https://registry.npmjs.org/typescript-eslint-parser/-/typescript-eslint-parser-16.0.1.tgz", + "integrity": "sha512-IKawLTu4A2xN3aN/cPLxvZ0bhxZHILGDKTZWvWNJ3sLNhJ3PjfMEDQmR2VMpdRPrmWOadgWXRwjLBzSA8AGsaQ==", "dev": true, "requires": { "lodash.unescape": "4.0.1", - "semver": "5.4.1" - }, - "dependencies": { - "semver": { - "version": "5.4.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-5.4.1.tgz", - "integrity": "sha512-WfG/X9+oATh81XtllIo/I8gOiY9EXRdv1cQdyykeXK17YcUW3EXUAi2To4pcH6nZtJPr7ZOpM5OMyWJZm+8Rsg==", - "dev": true - } + "semver": "5.5.0" } }, "uglify-js": { @@ -10921,6 +10924,15 @@ "resolved": "https://registry.npmjs.org/vuex/-/vuex-2.5.0.tgz", "integrity": "sha512-5oJPOJySBgSgSzoeO+gZB/BbN/XsapgIF6tz34UwJqnGZMQurzIO3B4KIBf862gfc9ya+oduY5sSkq+5/oOilQ==" }, + "vuex-persistedstate": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/vuex-persistedstate/-/vuex-persistedstate-3.0.1.tgz", + "integrity": "sha512-2dH77+fIecAXO8GeJEXiYnC++gx48PFGUayB5d7rWrN3fblRCOHQoVnmu/VV9DXbHHJcJth/0W/ofl8vw12j1A==", + "requires": { + "deepmerge": "^4.2.2", + "shvl": "^2.0.0" + } + }, "walker": { "version": "1.0.7", "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.7.tgz", diff --git a/package.json b/package.json index 5d57f332..9e1b0532 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "vue-router": "^2.3.1", "vuetify": "^1.5.14", "vuex": "^2.3.1", + "vuex-persistedstate": "^3.0.1", "waterline": "^0.13.6", "waterline-mysql": "^0.6.0" }, @@ -66,7 +67,7 @@ "opn": "^4.0.2", "optimize-css-assets-webpack-plugin": "^1.3.0", "ora": "^1.2.0", - "prettier-eslint": "^8.7.0", + "prettier-eslint": "^8.8.2", "prettier-eslint-cli": "^4.7.0", "request": "^2.88.0", "rimraf": "^2.6.0", diff --git a/src/store.js b/src/store.js index ab6831eb..4cbad7d8 100644 --- a/src/store.js +++ b/src/store.js @@ -1,10 +1,11 @@ import Vue from 'vue'; import Vuex from 'vuex'; +import createPersistedState from 'vuex-persistedstate'; -import { get, set } from '@/utils/storage'; +import { set } from '@/utils/storage'; import { generateGuid } from '@/utils/helpers'; -import { getAll } from '@/utils/settings'; import config from './store/modules/config/config.store'; +import settings from './store/modules/settings/settings.store'; const plex = require('./store/modules/plex/').default; const syncLounge = require('./store/modules/synclounge.js').default; @@ -15,7 +16,6 @@ function sendNotification(message) { return window.EventBus.$emit('notification', message); } -console.log('Got settings', getAll()); // Set up out web app socket for fetching short urls const state = { @@ -40,7 +40,6 @@ const state = { upNextCache: {}, // SETTINGS - settings: getAll(), stats: {}, me: {}, }; @@ -186,6 +185,7 @@ const getters = { }, }), }; + const actions = { async PLAYBACK_CHANGE({ commit, state, dispatch }, data) { const [client, ratingKey, mediaContainer] = data; @@ -208,12 +208,12 @@ const actions = { if (metadata.type === 'movie') { sendNotification(`Now Playing: ${metadata.title} from ${ state.plex.servers[metadata.machineIdentifier].name - }`); + }`); } if (metadata.type === 'episode') { sendNotification(`Now Playing: ${metadata.grandparentTitle} S${metadata.parentIndex}E${ metadata.index - } from ${state.plex.servers[metadata.machineIdentifier].name}`); + } from ${state.plex.servers[metadata.machineIdentifier].name}`); } state.chosenClient.clientPlayingMetadata = metadata; const w = Math.round(Math.max(document.documentElement.clientWidth, window.innerWidth || 0)); @@ -342,9 +342,16 @@ const actions = { } state.synclounge._socket.emit('poll', endObj); } - }, + } }; + +const persistedState = createPersistedState({ + paths: [ + 'settings' + ] +}); + const store = new Vuex.Store({ state, mutations, @@ -354,7 +361,9 @@ const store = new Vuex.Store({ synclounge: syncLounge, plex, config, + settings }, + plugins: [persistedState] }); export default store; diff --git a/src/store/modules/config/config.store.js b/src/store/modules/config/config.store.js index 8245b2da..5d514744 100644 --- a/src/store/modules/config/config.store.js +++ b/src/store/modules/config/config.store.js @@ -20,7 +20,7 @@ export default { }, }, getters: { - getConfig: () => state => state.configuration, + configuration: state => state.configuration, }, }; diff --git a/src/utils/constants.js b/src/store/modules/settings/constants.js similarity index 65% rename from src/utils/constants.js rename to src/store/modules/settings/constants.js index 0024e80e..408a2033 100644 --- a/src/utils/constants.js +++ b/src/store/modules/settings/constants.js @@ -1,5 +1,3 @@ -import { generateGuid } from './helpers'; - export const defaultSettings = { CLIENTPOLLINTERVAL: 1000, AUTOPLAY: true, @@ -9,11 +7,10 @@ export const defaultSettings = { SYNCFLEXABILITY: 3000, CUSTOMSERVER: 'http://', SLPLAYERFORCETRANSCODE: true, - CLIENTIDENTIFIER: `${generateGuid()}-${generateGuid()}`, - blockedServers: [], - LASTSERVER: '', + PTPLAYERQUALITY: 'Original', + PTPLAYERVOLUME: 100 }; export default { defaultSettings, -}; +}; \ No newline at end of file diff --git a/src/store/modules/settings/settings.store.js b/src/store/modules/settings/settings.store.js new file mode 100644 index 00000000..8e424141 --- /dev/null +++ b/src/store/modules/settings/settings.store.js @@ -0,0 +1,53 @@ +import { coalesce, generateGuid } from '@/utils/helpers'; + +const mutations = { + initClientIdentifier(state, payload) { + state.count += payload.amount + } +}; + +// Use stored value if not null, othewise fallback to config, then default values +// TODO: generate uuid if not exists +const getters = { + GET_AUTOPLAY: ({ state, rootGetters }) => { coalesce(state.AUTOPLAY, rootGetters['config/configuration'].AUTOPLAY, defaultSettings.AUTOPLAY) }, + GET_CLIENTPOLLINTERVAL: ({ state, rootGetters }) => { coalesce(state.CLIENTPOLLINTERVAL, rootGetters['config/configuration'].CLIENTPOLLINTERVAL, defaultSettings.CLIENTPOLLINTERVAL) }, + GET_SYNCMODE: ({ state, rootGetters }) => { coalesce(state.SYNCMODE, rootGetters['config/configuration'].SYNCMODE, defaultSettings.SYNCMODE) }, + GET_SYNCFLEXABILITY: ({ state, rootGetters }) => { coalesce(state.SYNCFLEXABILITY, rootGetters['config/configuration'].SYNCFLEXABILITY, defaultSettings.SYNCFLEXABILITY) }, + GET_CUSTOMSERVER: ({ state, rootGetters }) => { coalesce(state.CUSTOMSERVER, rootGetters['config/configuration'].CUSTOMSERVER, defaultSettings.CUSTOMSERVER) }, + GET_BLOCKEDSERVERS: state => state.BLOCKEDSERVERS, + GET_HOMEINIT: state => state.HOMEINIT, + GET_PTPLAYERQUALITY: ({ state, rootGetters }) => { coalesce(state.PTPLAYERQUALITY, rootGetters['config/configuration'].PTPLAYERQUALITY, defaultSettings.PTPLAYERQUALITY) }, + GET_PTPLAYERVOLUME: ({ state, rootGetters }) => { coalesce(state.PTPLAYERVOLUME, rootGetters['config/configuration'].PTPLAYERVOLUME, defaultSettings.PTPLAYERVOLUME) }, + GET_SLPLAYERFORCETRANSCODE: ({ state, rootGetters }) => { coalesce(state.SLPLAYERFORCETRANSCODE, rootGetters['config/configuration'].SLPLAYERFORCETRANSCODE, defaultSettings.SLPLAYERFORCETRANSCODE) }, + GET_HIDEUSERNAME: ({ state, rootGetters }) => { coalesce(state.HIDEUSERNAME, rootGetters['config/configuration'].HIDEUSERNAME, defaultSettings.HIDEUSERNAME) }, + GET_ALTUSERNAME: ({ state, rootGetters }) => { coalesce(state.ALTUSERNAME, rootGetters['config/configuration'].ALTUSERNAME, defaultSettings.ALTUSERNAME) }, + GET_CLIENTIDENTIFIER: state => state.CLIENTIDENTIFIER, + GET_LASTSERVER: state => state.LASTSERVER +}; + +// The state must return a function +// to make the module reusable. +// See: https://vuex.vuejs.org/en/modules.html#module-reuse +const state = () => ({ + 'AUTOPLAY': null, + 'CLIENTPOLLINTERVAL': null, + 'SYNCMODE': null, + 'SYNCFLEXABILITY': null, + 'CUSTOMSERVER': null, + 'BLOCKEDSERVERS': [], + 'HOMEINIT': false, + 'PTPLAYERQUALITY': null, + 'PTPLAYERVOLUME': null, + 'SLPLAYERFORCETRANSCODE': null, + 'HIDEUSERNAME': null, + 'ALTUSERNAME': null, + 'CLIENTIDENTIFIER': `${generateGuid()}-${generateGuid()}`, + 'LASTSERVER': null +}); + +export default { + namespaced: true, + mutations, + getters, + state +}; \ No newline at end of file diff --git a/src/utils/helpers.js b/src/utils/helpers.js index 2c6af266..7f939dcc 100644 --- a/src/utils/helpers.js +++ b/src/utils/helpers.js @@ -7,6 +7,18 @@ export const generateGuid = () => { return `${s4() + s4()}-${s4()}${s4()}`; }; + +export const coalesce = () => { + const len = arguments.length; + for (let i = 0; i < len; i++) { + if (arguments[i] !== null && arguments[i] !== undefined) { + return arguments[i]; + } + } + return null; +} + + export default { generateGuid, }; diff --git a/src/utils/settings.js b/src/utils/settings.js deleted file mode 100644 index eba25104..00000000 --- a/src/utils/settings.js +++ /dev/null @@ -1,38 +0,0 @@ -import { defaultSettings } from './constants'; -import { get } from './storage'; - -const keys = [ - 'AUTOPLAY', - 'CLIENTPOLLINTERVAL', - 'SYNCMODE', - 'SYNCFLEXABILITY', - 'CUSTOMSERVER', - 'BLOCKEDSERVERS', - 'HOMEINIT', - 'PTPLAYERQUALITY', - 'PTPLAYERVOLUME', - 'SLPLAYERFORCETRANSCODE', - 'HIDEUSERNAME', - 'ALTUSERNAME', - 'CLIENTIDENTIFIER', - 'LASTSERVER', -]; - -export const getAll = () => { - const settings = {}; - keys.forEach((key) => { - settings[key] = get(key); - return true; - }); - // Accept the default setting if the persisted value is null or undefined - Object.keys(settings).forEach((key) => { - if (settings[key] === undefined || settings[key] === null) { - settings[key] = defaultSettings[key]; - } - }); - return settings; -}; - -export default { - getAll, -};