Improve sync
This commit is contained in:
		
							parent
							
								
									26f4c038f3
								
							
						
					
					
						commit
						aec5911821
					
				
					 9 changed files with 262 additions and 255 deletions
				
			
		|  | @ -60,9 +60,9 @@ export default function <T extends object>(data: { | |||
| 
 | ||||
| 			save() { | ||||
| 				if (this.platform == 'deck') { | ||||
| 					this.$store.commit('device/updateDeckColumn', this.column); | ||||
| 					this.$store.commit('updateDeckColumn', this.column); | ||||
| 				} else { | ||||
| 					this.$store.commit('device/updateWidget', this.widget); | ||||
| 					this.$store.commit('updateWidget', this.widget); | ||||
| 				} | ||||
| 			} | ||||
| 		} | ||||
|  |  | |||
|  | @ -133,8 +133,8 @@ | |||
| 
 | ||||
| 			<section> | ||||
| 				<header>{{ $t('@._settings.sync') }}</header> | ||||
| 				<ui-input v-if="$root.isMobile" v-model="homeProfile">{{ $t('@._settings.home-profile') }}</ui-input> | ||||
| 				<ui-input v-else v-model="mobileHomeProfile">{{ $t('@._settings.home-profile') }}</ui-input> | ||||
| 				<ui-input v-if="$root.isMobile" v-model="mobileHomeProfile">{{ $t('@._settings.home-profile') }}</ui-input> | ||||
| 				<ui-input v-else v-model="homeProfile">{{ $t('@._settings.home-profile') }}</ui-input> | ||||
| 				<ui-input v-model="deckProfile">{{ $t('@._settings.deck-profile') }}</ui-input> | ||||
| 			</section> | ||||
| 
 | ||||
|  |  | |||
|  | @ -180,50 +180,50 @@ export default Vue.extend({ | |||
| 						} | ||||
| 					}).then(({ canceled, result: name }) => { | ||||
| 						if (canceled) return; | ||||
| 						this.$store.commit('device/renameDeckColumn', { id: this.column.id, name }); | ||||
| 						this.$store.commit('renameDeckColumn', { id: this.column.id, name }); | ||||
| 					}); | ||||
| 				} | ||||
| 			}, null, { | ||||
| 				icon: 'arrow-left', | ||||
| 				text: this.$t('swap-left'), | ||||
| 				action: () => { | ||||
| 					this.$store.commit('device/swapLeftDeckColumn', this.column.id); | ||||
| 					this.$store.commit('swapLeftDeckColumn', this.column.id); | ||||
| 				} | ||||
| 			}, { | ||||
| 				icon: 'arrow-right', | ||||
| 				text: this.$t('swap-right'), | ||||
| 				action: () => { | ||||
| 					this.$store.commit('device/swapRightDeckColumn', this.column.id); | ||||
| 					this.$store.commit('swapRightDeckColumn', this.column.id); | ||||
| 				} | ||||
| 			}, this.isStacked ? { | ||||
| 				icon: faArrowUp, | ||||
| 				text: this.$t('swap-up'), | ||||
| 				action: () => { | ||||
| 					this.$store.commit('device/swapUpDeckColumn', this.column.id); | ||||
| 					this.$store.commit('swapUpDeckColumn', this.column.id); | ||||
| 				} | ||||
| 			} : undefined, this.isStacked ? { | ||||
| 				icon: faArrowDown, | ||||
| 				text: this.$t('swap-down'), | ||||
| 				action: () => { | ||||
| 					this.$store.commit('device/swapDownDeckColumn', this.column.id); | ||||
| 					this.$store.commit('swapDownDeckColumn', this.column.id); | ||||
| 				} | ||||
| 			} : undefined, null, { | ||||
| 				icon: ['far', 'window-restore'], | ||||
| 				text: this.$t('stack-left'), | ||||
| 				action: () => { | ||||
| 					this.$store.commit('device/stackLeftDeckColumn', this.column.id); | ||||
| 					this.$store.commit('stackLeftDeckColumn', this.column.id); | ||||
| 				} | ||||
| 			}, this.isStacked ? { | ||||
| 				icon: faWindowMaximize, | ||||
| 				text: this.$t('pop-right'), | ||||
| 				action: () => { | ||||
| 					this.$store.commit('device/popRightDeckColumn', this.column.id); | ||||
| 					this.$store.commit('popRightDeckColumn', this.column.id); | ||||
| 				} | ||||
| 			} : undefined, null, { | ||||
| 				icon: ['far', 'trash-alt'], | ||||
| 				text: this.$t('remove'), | ||||
| 				action: () => { | ||||
| 					this.$store.commit('device/removeDeckColumn', this.column.id); | ||||
| 					this.$store.commit('removeDeckColumn', this.column.id); | ||||
| 				} | ||||
| 			}]; | ||||
| 
 | ||||
|  | @ -307,7 +307,7 @@ export default Vue.extend({ | |||
| 
 | ||||
| 			const id = e.dataTransfer.getData('mk-deck-column'); | ||||
| 			if (id != null && id != '') { | ||||
| 				this.$store.commit('device/swapDeckColumn', { | ||||
| 				this.$store.commit('swapDeckColumn', { | ||||
| 					a: this.column.id, | ||||
| 					b: id | ||||
| 				}); | ||||
|  |  | |||
|  | @ -90,7 +90,7 @@ export default Vue.extend({ | |||
| 
 | ||||
| 	methods: { | ||||
| 		onChangeSettings(v) { | ||||
| 			this.$store.commit('device/updateDeckColumn', this.column); | ||||
| 			this.$store.commit('updateDeckColumn', this.column); | ||||
| 		}, | ||||
| 
 | ||||
| 		focus() { | ||||
|  |  | |||
|  | @ -32,11 +32,7 @@ export default Vue.extend({ | |||
| 
 | ||||
| 	computed: { | ||||
| 		deck() { | ||||
| 			if (this.$store.state.device.deckProfile) { | ||||
| 				return this.$store.state.settings.deckProfiles[this.$store.state.device.deckProfile] || this.$store.state.device.deck; | ||||
| 			} else { | ||||
| 				return this.$store.state.device.deck; | ||||
| 			} | ||||
| 			return this.$store.getters.deck; | ||||
| 		}, | ||||
| 
 | ||||
| 		columns(): any[] { | ||||
|  | @ -115,14 +111,6 @@ export default Vue.extend({ | |||
| 				value: deck | ||||
| 			}); | ||||
| 		} | ||||
| 
 | ||||
| 		if (this.$store.state.device.deckProfile) { | ||||
| 			this.$watch('$store.state.device.deck', () => { | ||||
| 				this.$store.dispatch('settings/updateDeckProfile'); | ||||
| 			}, { | ||||
| 				deep: true | ||||
| 			}); | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	mounted() { | ||||
|  | @ -146,7 +134,7 @@ export default Vue.extend({ | |||
| 					icon: 'home', | ||||
| 					text: this.$t('@deck.home'), | ||||
| 					action: () => { | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'home' | ||||
| 						}); | ||||
|  | @ -155,7 +143,7 @@ export default Vue.extend({ | |||
| 					icon: ['far', 'comments'], | ||||
| 					text: this.$t('@deck.local'), | ||||
| 					action: () => { | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'local' | ||||
| 						}); | ||||
|  | @ -164,7 +152,7 @@ export default Vue.extend({ | |||
| 					icon: 'share-alt', | ||||
| 					text: this.$t('@deck.hybrid'), | ||||
| 					action: () => { | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'hybrid' | ||||
| 						}); | ||||
|  | @ -173,7 +161,7 @@ export default Vue.extend({ | |||
| 					icon: 'globe', | ||||
| 					text: this.$t('@deck.global'), | ||||
| 					action: () => { | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'global' | ||||
| 						}); | ||||
|  | @ -182,7 +170,7 @@ export default Vue.extend({ | |||
| 					icon: 'at', | ||||
| 					text: this.$t('@deck.mentions'), | ||||
| 					action: () => { | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'mentions' | ||||
| 						}); | ||||
|  | @ -191,7 +179,7 @@ export default Vue.extend({ | |||
| 					icon: ['far', 'envelope'], | ||||
| 					text: this.$t('@deck.direct'), | ||||
| 					action: () => { | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'direct' | ||||
| 						}); | ||||
|  | @ -212,7 +200,7 @@ export default Vue.extend({ | |||
| 							showCancelButton: true | ||||
| 						}); | ||||
| 						if (canceled) return; | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'list', | ||||
| 							list: lists.find(l => l.id === listId) | ||||
|  | @ -227,7 +215,7 @@ export default Vue.extend({ | |||
| 							input: true | ||||
| 						}).then(({ canceled, result: title }) => { | ||||
| 							if (canceled) return; | ||||
| 							this.$store.commit('device/addDeckColumn', { | ||||
| 							this.$store.commit('addDeckColumn', { | ||||
| 								id: uuid(), | ||||
| 								type: 'hashtag', | ||||
| 								tagTlId: this.$store.state.settings.tagTimelines.find(x => x.title == title).id | ||||
|  | @ -238,7 +226,7 @@ export default Vue.extend({ | |||
| 					icon: ['far', 'bell'], | ||||
| 					text: this.$t('@deck.notifications'), | ||||
| 					action: () => { | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'notifications' | ||||
| 						}); | ||||
|  | @ -247,7 +235,7 @@ export default Vue.extend({ | |||
| 					icon: 'calculator', | ||||
| 					text: this.$t('@deck.widgets'), | ||||
| 					action: () => { | ||||
| 						this.$store.commit('device/addDeckColumn', { | ||||
| 						this.$store.commit('addDeckColumn', { | ||||
| 							id: uuid(), | ||||
| 							type: 'widgets', | ||||
| 							widgets: [] | ||||
|  |  | |||
|  | @ -110,7 +110,7 @@ export default Vue.extend({ | |||
| 		}, | ||||
| 
 | ||||
| 		addWidget() { | ||||
| 			this.$store.commit('device/addDeckWidget', { | ||||
| 			this.$store.commit('addDeckWidget', { | ||||
| 				id: this.column.id, | ||||
| 				widget: { | ||||
| 					name: this.widgetAdderSelected, | ||||
|  | @ -123,14 +123,14 @@ export default Vue.extend({ | |||
| 		}, | ||||
| 
 | ||||
| 		removeWidget(widget) { | ||||
| 			this.$store.commit('device/removeDeckWidget', { | ||||
| 			this.$store.commit('removeDeckWidget', { | ||||
| 				id: this.column.id, | ||||
| 				widget | ||||
| 			}); | ||||
| 		}, | ||||
| 
 | ||||
| 		saveWidgets() { | ||||
| 			this.$store.commit('device/updateDeckColumn', this.column); | ||||
| 			this.$store.commit('updateDeckColumn', this.column); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
|  |  | |||
|  | @ -84,6 +84,7 @@ import XWelcome from '../pages/welcome.vue'; | |||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	i18n: i18n('desktop/views/components/home.vue'), | ||||
| 
 | ||||
| 	components: { | ||||
| 		XDraggable, | ||||
| 		XWelcome | ||||
|  | @ -102,11 +103,7 @@ export default Vue.extend({ | |||
| 	computed: { | ||||
| 		home(): any[] { | ||||
| 			if (this.$store.getters.isSignedIn) { | ||||
| 				if (this.$store.state.device.homeProfile) { | ||||
| 					return this.$store.state.settings.homeProfiles[this.$store.state.device.homeProfile] || this.$store.state.device.home || []; | ||||
| 				} else { | ||||
| 					return this.$store.state.device.home || []; | ||||
| 				} | ||||
| 				return this.$store.getters.home || []; | ||||
| 			} else { | ||||
| 				return [{ | ||||
| 					name: 'instance', | ||||
|  | @ -142,7 +139,9 @@ export default Vue.extend({ | |||
| 	}, | ||||
| 
 | ||||
| 	created() { | ||||
| 		if (this.$store.getters.isSignedIn) { | ||||
| 		if (!this.$store.getters.isSignedIn) return; | ||||
| 
 | ||||
| 		if (this.$store.getters.home == null) { | ||||
| 			const defaultDesktopHomeWidgets = { | ||||
| 				left: [ | ||||
| 					'profile', | ||||
|  | @ -187,17 +186,7 @@ export default Vue.extend({ | |||
| 			} | ||||
| 			//#endregion | ||||
| 
 | ||||
| 			if (this.$store.state.device.home == null) { | ||||
| 				this.$store.commit('device/setHome', _defaultDesktopHomeWidgets); | ||||
| 			} | ||||
| 
 | ||||
| 			if (this.$store.state.device.homeProfile) { | ||||
| 				this.$watch('$store.state.device.home', () => { | ||||
| 					this.$store.dispatch('settings/updateHomeProfile'); | ||||
| 				}, { | ||||
| 					deep: true | ||||
| 				}); | ||||
| 			} | ||||
| 			this.$store.commit('setHome', _defaultDesktopHomeWidgets); | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
|  | @ -235,7 +224,7 @@ export default Vue.extend({ | |||
| 		}, | ||||
| 
 | ||||
| 		addWidget() { | ||||
| 			this.$store.commit('device/addHomeWidget', { | ||||
| 			this.$store.commit('addHomeWidget', { | ||||
| 				name: this.widgetAdderSelected, | ||||
| 				id: uuid(), | ||||
| 				place: 'left', | ||||
|  | @ -246,7 +235,7 @@ export default Vue.extend({ | |||
| 		saveHome() { | ||||
| 			const left = this.widgets.left; | ||||
| 			const right = this.widgets.right; | ||||
| 			this.$store.commit('device/setHome', left.concat(right)); | ||||
| 			this.$store.commit('setHome', left.concat(right)); | ||||
| 			for (const w of left) w.place = 'left'; | ||||
| 			for (const w of right) w.place = 'right'; | ||||
| 		}, | ||||
|  |  | |||
|  | @ -72,17 +72,13 @@ export default Vue.extend({ | |||
| 
 | ||||
| 	computed: { | ||||
| 		widgets(): any[] { | ||||
| 			if (this.$store.state.device.mobileHomeProfile) { | ||||
| 				return this.$store.state.settings.mobileHomeProfiles[this.$store.state.device.mobileHomeProfile] || this.$store.state.device.mobileHome; | ||||
| 			} else { | ||||
| 				return this.$store.state.device.mobileHome; | ||||
| 			} | ||||
| 			return this.$store.getters.mobileHome || []; | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	created() { | ||||
| 		if (this.widgets.length == 0) { | ||||
| 			this.$store.commit('device/setMobileHome', [{ | ||||
| 			this.$store.commit('setMobileHome', [{ | ||||
| 				name: 'calendar', | ||||
| 				id: 'a', data: {} | ||||
| 			}, { | ||||
|  | @ -103,13 +99,11 @@ export default Vue.extend({ | |||
| 			}]); | ||||
| 		} | ||||
| 
 | ||||
| 		if (this.$store.state.device.mobileHomeProfile) { | ||||
| 			this.$watch('$store.state.device.mobileHome', () => { | ||||
| 				this.$store.dispatch('settings/updateMobileHomeProfile'); | ||||
| 			}, { | ||||
| 				deep: true | ||||
| 			}); | ||||
| 		} | ||||
| 		this.$watch('$store.getters.mobileHome', () => { | ||||
| 			this.$store.dispatch('settings/updateMobileHomeProfile'); | ||||
| 		}, { | ||||
| 			deep: true | ||||
| 		}); | ||||
| 	}, | ||||
| 
 | ||||
| 	mounted() { | ||||
|  | @ -134,7 +128,7 @@ export default Vue.extend({ | |||
| 		}, | ||||
| 
 | ||||
| 		addWidget() { | ||||
| 			this.$store.commit('device/addMobileHomeWidget', { | ||||
| 			this.$store.commit('addMobileHomeWidget', { | ||||
| 				name: this.widgetAdderSelected, | ||||
| 				id: uuid(), | ||||
| 				data: {} | ||||
|  | @ -142,11 +136,11 @@ export default Vue.extend({ | |||
| 		}, | ||||
| 
 | ||||
| 		removeWidget(widget) { | ||||
| 			this.$store.commit('device/removeMobileHomeWidget', widget); | ||||
| 			this.$store.commit('removeMobileHomeWidget', widget); | ||||
| 		}, | ||||
| 
 | ||||
| 		saveHome() { | ||||
| 			this.$store.commit('device/setMobileHome', this.widgets); | ||||
| 			this.$store.commit('setMobileHome', this.widgets); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
|  |  | |||
|  | @ -1,3 +1,4 @@ | |||
| import Vue from 'vue'; | ||||
| import Vuex from 'vuex'; | ||||
| import createPersistedState from 'vuex-persistedstate'; | ||||
| import * as nestedProperty from 'nested-property'; | ||||
|  | @ -40,12 +41,9 @@ const defaultSettings = { | |||
| }; | ||||
| 
 | ||||
| const defaultDeviceSettings = { | ||||
| 	home: null, | ||||
| 	homeProfile: null, | ||||
| 	mobileHomeProfile: null, | ||||
| 	mobileHome: [], | ||||
| 	deck: null, | ||||
| 	deckProfile: null, | ||||
| 	homeProfile: 'Default', | ||||
| 	mobileHomeProfile: 'Default', | ||||
| 	deckProfile: 'Default', | ||||
| 	deckMode: false, | ||||
| 	deckColumnAlign: 'center', | ||||
| 	deckColumnWidth: 'normal', | ||||
|  | @ -88,7 +86,13 @@ export default (os: MiOS) => new Vuex.Store({ | |||
| 	}, | ||||
| 
 | ||||
| 	getters: { | ||||
| 		isSignedIn: state => state.i != null | ||||
| 		isSignedIn: state => state.i != null, | ||||
| 
 | ||||
| 		home: state => state.settings.homeProfiles[state.device.homeProfile], | ||||
| 
 | ||||
| 		mobileHome: state => state.settings.mobileHomeProfiles[state.device.mobileHomeProfile], | ||||
| 
 | ||||
| 		deck: state => state.settings.deckProfiles[state.device.deckProfile], | ||||
| 	}, | ||||
| 
 | ||||
| 	mutations: { | ||||
|  | @ -118,6 +122,211 @@ export default (os: MiOS) => new Vuex.Store({ | |||
| 		clearBehindNotes(state) { | ||||
| 			state.behindNotes = []; | ||||
| 			document.title = os.instanceName; | ||||
| 		}, | ||||
| 
 | ||||
| 		setHome(state, data) { | ||||
| 			Vue.set(state.settings.homeProfiles, state.device.homeProfile, data); | ||||
| 			os.store.dispatch('settings/updateHomeProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		addHomeWidget(state, widget) { | ||||
| 			state.settings.homeProfiles[state.device.homeProfile].unshift(widget); | ||||
| 			os.store.dispatch('settings/updateHomeProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		setMobileHome(state, data) { | ||||
| 			Vue.set(state.settings.mobileHomeProfiles, state.device.mobileHomeProfile, data); | ||||
| 			os.store.dispatch('settings/updateMobileHomeProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		updateWidget(state, x) { | ||||
| 			let w; | ||||
| 
 | ||||
| 			//#region Desktop home
 | ||||
| 			const home = state.settings.homeProfiles[state.device.homeProfile]; | ||||
| 			if (home) { | ||||
| 				w = home.find(w => w.id == x.id); | ||||
| 				if (w) { | ||||
| 					w.data = x.data; | ||||
| 					os.store.dispatch('settings/updateHomeProfile'); | ||||
| 				} | ||||
| 			} | ||||
| 			//#endregion
 | ||||
| 
 | ||||
| 			//#region Mobile home
 | ||||
| 			const mobileHome = state.settings.mobileHomeProfiles[state.device.mobileHomeProfile]; | ||||
| 			if (mobileHome) { | ||||
| 				w = mobileHome.find(w => w.id == x.id); | ||||
| 				if (w) { | ||||
| 					w.data = x.data; | ||||
| 					os.store.dispatch('settings/updateMobileHomeProfile'); | ||||
| 				} | ||||
| 			} | ||||
| 			//#endregion
 | ||||
| 		}, | ||||
| 
 | ||||
| 		addMobileHomeWidget(state, widget) { | ||||
| 			state.settings.mobileHomeProfiles[state.device.mobileHomeProfile].unshift(widget); | ||||
| 			os.store.dispatch('settings/updateMobileHomeProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		removeMobileHomeWidget(state, widget) { | ||||
| 			Vue.set('state.settings.mobileHomeProfiles', state.device.mobileHomeProfile, state.settings.mobileHomeProfiles[state.device.mobileHomeProfile].filter(w => w.id != widget.id)); | ||||
| 			os.store.dispatch('settings/updateMobileHomeProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		addDeckColumn(state, column) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			if (column.name == undefined) column.name = null; | ||||
| 			deck.columns.push(column); | ||||
| 			deck.layout.push([column.id]); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		removeDeckColumn(state, id) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			deck.columns = deck.columns.filter(c => c.id != id); | ||||
| 			deck.layout = deck.layout.map(ids => erase(id, ids)); | ||||
| 			deck.layout = deck.layout.filter(ids => ids.length > 0); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		swapDeckColumn(state, x) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			const a = x.a; | ||||
| 			const b = x.b; | ||||
| 			const aX = deck.layout.findIndex(ids => ids.indexOf(a) != -1); | ||||
| 			const aY = deck.layout[aX].findIndex(id => id == a); | ||||
| 			const bX = deck.layout.findIndex(ids => ids.indexOf(b) != -1); | ||||
| 			const bY = deck.layout[bX].findIndex(id => id == b); | ||||
| 			deck.layout[aX][aY] = b; | ||||
| 			deck.layout[bX][bY] = a; | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		swapLeftDeckColumn(state, id) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			deck.layout.some((ids, i) => { | ||||
| 				if (ids.indexOf(id) != -1) { | ||||
| 					const left = deck.layout[i - 1]; | ||||
| 					if (left) { | ||||
| 						// https://vuejs.org/v2/guide/list.html#Caveats
 | ||||
| 						//state.deck.layout[i - 1] = state.deck.layout[i];
 | ||||
| 						//state.deck.layout[i] = left;
 | ||||
| 						deck.layout.splice(i - 1, 1, deck.layout[i]); | ||||
| 						deck.layout.splice(i, 1, left); | ||||
| 					} | ||||
| 					return true; | ||||
| 				} | ||||
| 			}); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		swapRightDeckColumn(state, id) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			deck.layout.some((ids, i) => { | ||||
| 				if (ids.indexOf(id) != -1) { | ||||
| 					const right = deck.layout[i + 1]; | ||||
| 					if (right) { | ||||
| 						// https://vuejs.org/v2/guide/list.html#Caveats
 | ||||
| 						//state.deck.layout[i + 1] = state.deck.layout[i];
 | ||||
| 						//state.deck.layout[i] = right;
 | ||||
| 						deck.layout.splice(i + 1, 1, deck.layout[i]); | ||||
| 						deck.layout.splice(i, 1, right); | ||||
| 					} | ||||
| 					return true; | ||||
| 				} | ||||
| 			}); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		swapUpDeckColumn(state, id) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			const ids = deck.layout.find(ids => ids.indexOf(id) != -1); | ||||
| 			ids.some((x, i) => { | ||||
| 				if (x == id) { | ||||
| 					const up = ids[i - 1]; | ||||
| 					if (up) { | ||||
| 						// https://vuejs.org/v2/guide/list.html#Caveats
 | ||||
| 						//ids[i - 1] = id;
 | ||||
| 						//ids[i] = up;
 | ||||
| 						ids.splice(i - 1, 1, id); | ||||
| 						ids.splice(i, 1, up); | ||||
| 					} | ||||
| 					return true; | ||||
| 				} | ||||
| 			}); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		swapDownDeckColumn(state, id) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			const ids = deck.layout.find(ids => ids.indexOf(id) != -1); | ||||
| 			ids.some((x, i) => { | ||||
| 				if (x == id) { | ||||
| 					const down = ids[i + 1]; | ||||
| 					if (down) { | ||||
| 						// https://vuejs.org/v2/guide/list.html#Caveats
 | ||||
| 						//ids[i + 1] = id;
 | ||||
| 						//ids[i] = down;
 | ||||
| 						ids.splice(i + 1, 1, id); | ||||
| 						ids.splice(i, 1, down); | ||||
| 					} | ||||
| 					return true; | ||||
| 				} | ||||
| 			}); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		stackLeftDeckColumn(state, id) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			const i = deck.layout.findIndex(ids => ids.indexOf(id) != -1); | ||||
| 			deck.layout = deck.layout.map(ids => erase(id, ids)); | ||||
| 			const left = deck.layout[i - 1]; | ||||
| 			if (left) deck.layout[i - 1].push(id); | ||||
| 			deck.layout = deck.layout.filter(ids => ids.length > 0); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		popRightDeckColumn(state, id) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			const i = deck.layout.findIndex(ids => ids.indexOf(id) != -1); | ||||
| 			deck.layout = deck.layout.map(ids => erase(id, ids)); | ||||
| 			deck.layout.splice(i + 1, 0, [id]); | ||||
| 			deck.layout = deck.layout.filter(ids => ids.length > 0); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		addDeckWidget(state, x) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			const column = deck.columns.find(c => c.id == x.id); | ||||
| 			if (column == null) return; | ||||
| 			column.widgets.unshift(x.widget); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		removeDeckWidget(state, x) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			const column = deck.columns.find(c => c.id == x.id); | ||||
| 			if (column == null) return; | ||||
| 			column.widgets = column.widgets.filter(w => w.id != x.widget.id); | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		renameDeckColumn(state, x) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			const column = deck.columns.find(c => c.id == x.id); | ||||
| 			if (column == null) return; | ||||
| 			column.name = x.name; | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		}, | ||||
| 
 | ||||
| 		updateDeckColumn(state, x) { | ||||
| 			const deck = state.settings.deckProfiles[state.device.deckProfile]; | ||||
| 			let column = deck.columns.find(c => c.id == x.id); | ||||
| 			if (column == null) return; | ||||
| 			column = x; | ||||
| 			os.store.dispatch('settings/updateDeckProfile'); | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
|  | @ -165,176 +374,6 @@ export default (os: MiOS) => new Vuex.Store({ | |||
| 				setVisibility(state, visibility) { | ||||
| 					state.visibility = visibility; | ||||
| 				}, | ||||
| 
 | ||||
| 				setHome(state, data) { | ||||
| 					state.home = data; | ||||
| 				}, | ||||
| 
 | ||||
| 				addHomeWidget(state, widget) { | ||||
| 					state.home.unshift(widget); | ||||
| 				}, | ||||
| 
 | ||||
| 				setMobileHome(state, data) { | ||||
| 					state.mobileHome = data; | ||||
| 				}, | ||||
| 
 | ||||
| 				updateWidget(state, x) { | ||||
| 					let w; | ||||
| 
 | ||||
| 					//#region Desktop home
 | ||||
| 					if (state.home) { | ||||
| 						w = state.home.find(w => w.id == x.id); | ||||
| 						if (w) { | ||||
| 							w.data = x.data; | ||||
| 						} | ||||
| 					} | ||||
| 					//#endregion
 | ||||
| 
 | ||||
| 					//#region Mobile home
 | ||||
| 					if (state.mobileHome) { | ||||
| 						w = state.mobileHome.find(w => w.id == x.id); | ||||
| 						if (w) { | ||||
| 							w.data = x.data; | ||||
| 						} | ||||
| 					} | ||||
| 					//#endregion
 | ||||
| 				}, | ||||
| 
 | ||||
| 				addMobileHomeWidget(state, widget) { | ||||
| 					state.mobileHome.unshift(widget); | ||||
| 				}, | ||||
| 
 | ||||
| 				removeMobileHomeWidget(state, widget) { | ||||
| 					state.mobileHome = state.mobileHome.filter(w => w.id != widget.id); | ||||
| 				}, | ||||
| 
 | ||||
| 				addDeckColumn(state, column) { | ||||
| 					if (column.name == undefined) column.name = null; | ||||
| 					state.deck.columns.push(column); | ||||
| 					state.deck.layout.push([column.id]); | ||||
| 				}, | ||||
| 
 | ||||
| 				removeDeckColumn(state, id) { | ||||
| 					state.deck.columns = state.deck.columns.filter(c => c.id != id); | ||||
| 					state.deck.layout = state.deck.layout.map(ids => erase(id, ids)); | ||||
| 					state.deck.layout = state.deck.layout.filter(ids => ids.length > 0); | ||||
| 				}, | ||||
| 
 | ||||
| 				swapDeckColumn(state, x) { | ||||
| 					const a = x.a; | ||||
| 					const b = x.b; | ||||
| 					const aX = state.deck.layout.findIndex(ids => ids.indexOf(a) != -1); | ||||
| 					const aY = state.deck.layout[aX].findIndex(id => id == a); | ||||
| 					const bX = state.deck.layout.findIndex(ids => ids.indexOf(b) != -1); | ||||
| 					const bY = state.deck.layout[bX].findIndex(id => id == b); | ||||
| 					state.deck.layout[aX][aY] = b; | ||||
| 					state.deck.layout[bX][bY] = a; | ||||
| 				}, | ||||
| 
 | ||||
| 				swapLeftDeckColumn(state, id) { | ||||
| 					state.deck.layout.some((ids, i) => { | ||||
| 						if (ids.indexOf(id) != -1) { | ||||
| 							const left = state.deck.layout[i - 1]; | ||||
| 							if (left) { | ||||
| 								// https://vuejs.org/v2/guide/list.html#Caveats
 | ||||
| 								//state.deck.layout[i - 1] = state.deck.layout[i];
 | ||||
| 								//state.deck.layout[i] = left;
 | ||||
| 								state.deck.layout.splice(i - 1, 1, state.deck.layout[i]); | ||||
| 								state.deck.layout.splice(i, 1, left); | ||||
| 							} | ||||
| 							return true; | ||||
| 						} | ||||
| 					}); | ||||
| 				}, | ||||
| 
 | ||||
| 				swapRightDeckColumn(state, id) { | ||||
| 					state.deck.layout.some((ids, i) => { | ||||
| 						if (ids.indexOf(id) != -1) { | ||||
| 							const right = state.deck.layout[i + 1]; | ||||
| 							if (right) { | ||||
| 								// https://vuejs.org/v2/guide/list.html#Caveats
 | ||||
| 								//state.deck.layout[i + 1] = state.deck.layout[i];
 | ||||
| 								//state.deck.layout[i] = right;
 | ||||
| 								state.deck.layout.splice(i + 1, 1, state.deck.layout[i]); | ||||
| 								state.deck.layout.splice(i, 1, right); | ||||
| 							} | ||||
| 							return true; | ||||
| 						} | ||||
| 					}); | ||||
| 				}, | ||||
| 
 | ||||
| 				swapUpDeckColumn(state, id) { | ||||
| 					const ids = state.deck.layout.find(ids => ids.indexOf(id) != -1); | ||||
| 					ids.some((x, i) => { | ||||
| 						if (x == id) { | ||||
| 							const up = ids[i - 1]; | ||||
| 							if (up) { | ||||
| 								// https://vuejs.org/v2/guide/list.html#Caveats
 | ||||
| 								//ids[i - 1] = id;
 | ||||
| 								//ids[i] = up;
 | ||||
| 								ids.splice(i - 1, 1, id); | ||||
| 								ids.splice(i, 1, up); | ||||
| 							} | ||||
| 							return true; | ||||
| 						} | ||||
| 					}); | ||||
| 				}, | ||||
| 
 | ||||
| 				swapDownDeckColumn(state, id) { | ||||
| 					const ids = state.deck.layout.find(ids => ids.indexOf(id) != -1); | ||||
| 					ids.some((x, i) => { | ||||
| 						if (x == id) { | ||||
| 							const down = ids[i + 1]; | ||||
| 							if (down) { | ||||
| 								// https://vuejs.org/v2/guide/list.html#Caveats
 | ||||
| 								//ids[i + 1] = id;
 | ||||
| 								//ids[i] = down;
 | ||||
| 								ids.splice(i + 1, 1, id); | ||||
| 								ids.splice(i, 1, down); | ||||
| 							} | ||||
| 							return true; | ||||
| 						} | ||||
| 					}); | ||||
| 				}, | ||||
| 
 | ||||
| 				stackLeftDeckColumn(state, id) { | ||||
| 					const i = state.deck.layout.findIndex(ids => ids.indexOf(id) != -1); | ||||
| 					state.deck.layout = state.deck.layout.map(ids => erase(id, ids)); | ||||
| 					const left = state.deck.layout[i - 1]; | ||||
| 					if (left) state.deck.layout[i - 1].push(id); | ||||
| 					state.deck.layout = state.deck.layout.filter(ids => ids.length > 0); | ||||
| 				}, | ||||
| 
 | ||||
| 				popRightDeckColumn(state, id) { | ||||
| 					const i = state.deck.layout.findIndex(ids => ids.indexOf(id) != -1); | ||||
| 					state.deck.layout = state.deck.layout.map(ids => erase(id, ids)); | ||||
| 					state.deck.layout.splice(i + 1, 0, [id]); | ||||
| 					state.deck.layout = state.deck.layout.filter(ids => ids.length > 0); | ||||
| 				}, | ||||
| 
 | ||||
| 				addDeckWidget(state, x) { | ||||
| 					const column = state.deck.columns.find(c => c.id == x.id); | ||||
| 					if (column == null) return; | ||||
| 					column.widgets.unshift(x.widget); | ||||
| 				}, | ||||
| 
 | ||||
| 				removeDeckWidget(state, x) { | ||||
| 					const column = state.deck.columns.find(c => c.id == x.id); | ||||
| 					if (column == null) return; | ||||
| 					column.widgets = column.widgets.filter(w => w.id != x.widget.id); | ||||
| 				}, | ||||
| 
 | ||||
| 				renameDeckColumn(state, x) { | ||||
| 					const column = state.deck.columns.find(c => c.id == x.id); | ||||
| 					if (column == null) return; | ||||
| 					column.name = x.name; | ||||
| 				}, | ||||
| 
 | ||||
| 				updateDeckColumn(state, x) { | ||||
| 					let column = state.deck.columns.find(c => c.id == x.id); | ||||
| 					if (column == null) return; | ||||
| 					column = x; | ||||
| 				} | ||||
| 			} | ||||
| 		}, | ||||
| 
 | ||||
|  | @ -370,7 +409,6 @@ export default (os: MiOS) => new Vuex.Store({ | |||
| 
 | ||||
| 				updateHomeProfile(ctx) { | ||||
| 					const profiles = ctx.state.homeProfiles; | ||||
| 					profiles[ctx.rootState.device.homeProfile] = ctx.rootState.device.home; | ||||
| 					ctx.commit('set', { | ||||
| 						key: 'homeProfiles', | ||||
| 						value: profiles | ||||
|  | @ -383,7 +421,6 @@ export default (os: MiOS) => new Vuex.Store({ | |||
| 
 | ||||
| 				updateMobileHomeProfile(ctx) { | ||||
| 					const profiles = ctx.state.mobileHomeProfiles; | ||||
| 					profiles[ctx.rootState.device.mobileHomeProfile] = ctx.rootState.device.mobileHome; | ||||
| 					ctx.commit('set', { | ||||
| 						key: 'mobileHomeProfiles', | ||||
| 						value: profiles | ||||
|  | @ -396,7 +433,6 @@ export default (os: MiOS) => new Vuex.Store({ | |||
| 
 | ||||
| 				updateDeckProfile(ctx) { | ||||
| 					const profiles = ctx.state.deckProfiles; | ||||
| 					profiles[ctx.rootState.device.deckProfile] = ctx.rootState.device.deck; | ||||
| 					ctx.commit('set', { | ||||
| 						key: 'deckProfiles', | ||||
| 						value: profiles | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue