chore: removed unused store files; fix: removed global window.vol object in favor to a store property; chore: changed store module aboutInfo to appInfo

This commit is contained in:
Roberto Tonino 2020-11-10 21:07:25 +01:00
parent 333af201e0
commit 86e3cda64c
13 changed files with 145 additions and 148 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,10 +1,5 @@
import Vue from 'vue' import Vue from 'vue'
// Object is needed for vue change detection
window.vol = {
preview_max_volume: 100
}
import '@/styles/vendor/material-icons.css' import '@/styles/vendor/material-icons.css'
import '@/styles/vendor/OpenSans.css' import '@/styles/vendor/OpenSans.css'

View File

@ -8,11 +8,17 @@
import EventBus from '@/utils/EventBus' import EventBus from '@/utils/EventBus'
import { adjustVolume } from '@/utils/adjust-volume' import { adjustVolume } from '@/utils/adjust-volume'
import { mapGetters } from 'vuex'
export default { export default {
data: () => ({ data: () => ({
previewStopped: false previewStopped: false
}), }),
computed: {
...mapGetters({
previewVolume: 'getPreviewVolume'
})
},
mounted() { mounted() {
this.$refs.preview.volume = 1 this.$refs.preview.volume = 1
@ -31,7 +37,7 @@ export default {
this.previewStopped = false this.previewStopped = false
await adjustVolume(this.$refs.preview, window.vol.preview_max_volume / 100, { duration: 500 }) await adjustVolume(this.$refs.preview, this.previewVolume / 100, { duration: 500 })
}, },
async onTimeUpdate() { async onTimeUpdate() {
// Prevents first time entering in this function // Prevents first time entering in this function
@ -77,7 +83,7 @@ export default {
icon.innerText = 'pause' icon.innerText = 'pause'
await adjustVolume(this.$refs.preview, window.vol.preview_max_volume / 100, { duration: 500 }) await adjustVolume(this.$refs.preview, this.previewVolume / 100, { duration: 500 })
} else { } else {
this.previewStopped = true this.previewStopped = true

View File

@ -242,7 +242,7 @@ export default {
} }
}, },
computed: { computed: {
...mapGetters(['getAboutInfo']) ...mapGetters(['getAppInfo'])
}, },
methods: { methods: {
initUpdate(data) { initUpdate(data) {
@ -255,7 +255,7 @@ export default {
} }
}, },
mounted() { mounted() {
this.initUpdate(this.getAboutInfo) this.initUpdate(this.getAppInfo)
} }
} }
</script> </script>

View File

@ -599,16 +599,8 @@
<div class="input-group"> <div class="input-group">
<p class="input-group-text">{{ $t('settings.other.previewVolume') }}</p> <p class="input-group-text">{{ $t('settings.other.previewVolume') }}</p>
<input <input type="range" min="0" max="100" step="1" class="slider" v-model.number="modelVolume" />
type="range" <span>{{ previewVolume }}%</span>
@change="updateMaxVolume"
min="0"
max="100"
step="1"
class="slider"
v-model.number="previewVolume.preview_max_volume"
/>
<span>{{ previewVolume.preview_max_volume }}%</span>
</div> </div>
<div class="input-group"> <div class="input-group">
@ -760,6 +752,7 @@
<script> <script>
import { mapActions, mapGetters } from 'vuex' import { mapActions, mapGetters } from 'vuex'
import { debounce } from 'lodash-es'
import { getSettingsData } from '@/data/settings' import { getSettingsData } from '@/data/settings'
@ -789,7 +782,6 @@ export default {
spotifyUser: '', spotifyUser: '',
slimDownloads: false, slimDownloads: false,
slimSidebar: false, slimSidebar: false,
previewVolume: window.vol,
accountNum: 0, accountNum: 0,
accounts: [] accounts: []
} }
@ -799,8 +791,17 @@ export default {
arl: 'getARL', arl: 'getARL',
user: 'getUser', user: 'getUser',
isLoggedIn: 'isLoggedIn', isLoggedIn: 'isLoggedIn',
clientMode: 'getClientMode' clientMode: 'getClientMode',
previewVolume: 'getPreviewVolume'
}), }),
modelVolume: {
get() {
return this.previewVolume
},
set: debounce(function (value) {
this.setPreviewVolume(value)
}, 20)
},
needToWait() { needToWait() {
return Object.keys(this.getSettings).length === 0 return Object.keys(this.getSettings).length === 0
}, },
@ -863,7 +864,7 @@ export default {
localStorage.setItem('previewVolume', volume) localStorage.setItem('previewVolume', volume)
} }
window.vol.preview_max_volume = volume this.setPreviewVolume(volume)
socket.on('updateSettings', this.updateSettings) socket.on('updateSettings', this.updateSettings)
socket.on('accountChanged', this.accountChanged) socket.on('accountChanged', this.accountChanged)
@ -881,7 +882,8 @@ export default {
}, },
methods: { methods: {
...mapActions({ ...mapActions({
dispatchARL: 'setARL' dispatchARL: 'setARL',
setPreviewVolume: 'setPreviewVolume'
}), }),
revertSettings() { revertSettings() {
this.settings = JSON.parse(JSON.stringify(this.lastSettings)) this.settings = JSON.parse(JSON.stringify(this.lastSettings))
@ -906,8 +908,11 @@ export default {
this.currentLocale = newLocale this.currentLocale = newLocale
localStorage.setItem('locale', newLocale) localStorage.setItem('locale', newLocale)
}, },
/**
* @deprecated
*/
updateMaxVolume() { updateMaxVolume() {
localStorage.setItem('previewVolume', this.previewVolume.preview_max_volume) localStorage.setItem('previewVolume', this.previewVolume)
}, },
saveSettings() { saveSettings() {
this.lastSettings = JSON.parse(JSON.stringify(this.settings)) this.lastSettings = JSON.parse(JSON.stringify(this.settings))

View File

@ -1,17 +1,15 @@
import Vuex from 'vuex' import Vuex from 'vuex'
import Vue from 'vue' import Vue from 'vue'
import about from '@/store/modules/about' import appInfo from '@/store/modules/appInfo'
import login from '@/store/modules/login' import login from '@/store/modules/login'
import errors from '@/store/modules/errors' import errors from '@/store/modules/errors'
// Load Vuex
Vue.use(Vuex) Vue.use(Vuex)
// Create store
export default new Vuex.Store({ export default new Vuex.Store({
modules: { modules: {
about, appInfo,
login, login,
errors errors
}, },

View File

@ -1,41 +0,0 @@
const state = {
currentCommit: null,
latestCommit: null,
updateAvailable: false,
deemixVersion: null
}
const actions = {
setAboutInfo({ commit }, payload) {
commit('SET_CURRENT_COMMIT', payload.currentCommit)
commit('SET_LATEST_COMMIT', payload.latestCommit)
commit('SET_UPDATE_AVAILABLE', payload.updateAvailable)
commit('SET_DEEMIX_VERSION', payload.deemixVersion)
}
}
const getters = {
getAboutInfo: state => state
}
const mutations = {
SET_CURRENT_COMMIT: (state, payload) => {
state.currentCommit = payload
},
SET_LATEST_COMMIT: (state, payload) => {
state.latestCommit = payload
},
SET_UPDATE_AVAILABLE: (state, payload) => {
state.updateAvailable = payload
},
SET_DEEMIX_VERSION: (state, payload) => {
state.deemixVersion = payload
}
}
export default {
state,
getters,
actions,
mutations
}

View File

@ -0,0 +1,98 @@
/**
* @typedef {object} AppInfo
* @property {string} currentCommit
* @property {string} latestCommit
* @property {boolean} updateAvailable
* @property {string} deemixVersion
* @property {number} previewVolume
*/
/**
* @returns {AppInfo}
*/
const state = () => ({
currentCommit: null,
latestCommit: null,
updateAvailable: false,
deemixVersion: null,
previewVolume: Number(localStorage.getItem('previewVolume')) || 100
})
const actions = {
/**
* @param {any} action
* @param {AppInfo} payload
*/
setAppInfo({ commit }, payload) {
commit('SET_CURRENT_COMMIT', payload.currentCommit)
commit('SET_LATEST_COMMIT', payload.latestCommit)
commit('SET_UPDATE_AVAILABLE', payload.updateAvailable)
commit('SET_DEEMIX_VERSION', payload.deemixVersion)
},
/**
* @param {any} action
* @param {AppInfo['previewVolume']} payload
*/
setPreviewVolume({ commit }, payload) {
commit('SET_PREVIEW_VOLUME', payload)
localStorage.setItem('previewVolume', payload.toString())
}
}
const getters = {
/**
* @param {AppInfo} state
* @returns {AppInfo}
*/
getAppInfo: state => state,
/**
* @param {AppInfo} state
* @returns {AppInfo['previewVolume']}
*/
getPreviewVolume: state => state.previewVolume
}
const mutations = {
/**
* @param {AppInfo} state
* @param {AppInfo['currentCommit']} payload
*/
SET_CURRENT_COMMIT(state, payload) {
state.currentCommit = payload
},
/**
* @param {AppInfo} state
* @param {AppInfo['latestCommit']} payload
*/
SET_LATEST_COMMIT(state, payload) {
state.latestCommit = payload
},
/**
* @param {AppInfo} state
* @param {AppInfo['updateAvailable']} payload
*/
SET_UPDATE_AVAILABLE(state, payload) {
state.updateAvailable = payload
},
/**
* @param {AppInfo} state
* @param {AppInfo['deemixVersion']} payload
*/
SET_DEEMIX_VERSION(state, payload) {
state.deemixVersion = payload
},
/**
* @param {AppInfo} state
* @param {AppInfo['previewVolume']} payload
*/
SET_PREVIEW_VOLUME(state, payload) {
state.previewVolume = payload
}
}
export default {
state,
getters,
actions,
mutations
}

View File

@ -1,31 +0,0 @@
import Vue from 'vue'
const state = {}
const actions = {
setDefaultSettings({ commit }, payload) {
for (const settingName in payload) {
if (!payload.hasOwnProperty(settingName)) return
const settingValue = payload[settingName]
commit('SET_UNKNOWN_DEFAULT_SETTING', { settingName, settingValue })
}
}
}
const getters = {
getDefaultSettings: state => state
}
const mutations = {
SET_UNKNOWN_DEFAULT_SETTING(state, payload) {
Vue.set(state, payload.settingName, payload.settingValue)
}
}
export default {
state,
actions,
getters,
mutations
}

View File

@ -1,4 +1,4 @@
const state = { const state = () => ({
artist: '', artist: '',
bitrate: '', bitrate: '',
cover: '', cover: '',
@ -12,7 +12,7 @@ const state = {
title: '', title: '',
type: '', type: '',
uuid: '' uuid: ''
} })
const actions = { const actions = {
setErrors({ commit }, payload) { setErrors({ commit }, payload) {

View File

@ -1,5 +1,4 @@
const getDefaultState = () => { const getDefaultState = () => ({
return {
arl: localStorage.getItem('arl') || '', arl: localStorage.getItem('arl') || '',
status: null, status: null,
user: { user: {
@ -8,8 +7,7 @@ const getDefaultState = () => {
picture: '' picture: ''
}, },
clientMode: false clientMode: false
} })
}
const state = getDefaultState() const state = getDefaultState()

View File

@ -1,31 +0,0 @@
const state = {
clientId: '',
clientSecret: ''
}
const actions = {
setCredentials({ commit }, payload) {
commit('SET_CLIENT_ID', payload.clientId)
commit('SET_CLIENT_SECRET', payload.clientSecret)
}
}
const getters = {
getCredentials: state => state
}
const mutations = {
SET_CLIENT_ID(state, payload) {
state.clientId = payload
},
SET_CLIENT_SECRET(state, payload) {
state.clientSecret = payload
}
}
export default {
state,
getters,
actions,
mutations
}

View File

@ -3,5 +3,5 @@ import store from '@/store'
export const socket = io.connect(window.location.href) export const socket = io.connect(window.location.href)
socket.on('init_update', data => { socket.on('init_update', data => {
store.dispatch('setAboutInfo', data) store.dispatch('setAppInfo', data)
}) })