デッキの状態を同期できるように

locales/ja-JP.yml

@@ -284,6 +284,7 @@ common:
     load-remote-media: "リモートサーバーのメディアを表示する"
     sync: "同期"
     home-profile: "ホームのプロファイル"
+    deck-profile: "デッキのプロファイル"
 
   search: "検索"
   delete: "削除"

src/client/app/common/views/components/settings/settings.vue

@@ -135,6 +135,7 @@
 				<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-model="deckProfile">{{ $t('@._settings.deck-profile') }}</ui-input>
 			</section>
 
 			<section>
@@ -516,6 +517,11 @@ export default Vue.extend({
 			get() { return this.$store.state.device.mobileHomeProfile; },
 			set(value) { this.$store.commit('device/set', { key: 'mobileHomeProfile', value }); }
 		},
+
+		deckProfile: {
+			get() { return this.$store.state.device.deckProfile; },
+			set(value) { this.$store.commit('device/set', { key: 'deckProfile', value }); }
+		},
 	},
 	created() {
 		this.$root.getMeta().then(meta => {

src/client/app/common/views/deck/deck.column.vue

@@ -146,7 +146,8 @@ export default Vue.extend({
 
 		toggleActive() {
 			if (!this.isStacked) return;
-			const vms = this.$store.state.device.deck.layout.find(ids => ids.indexOf(this.column.id) != -1).map(id => this.getColumnVm(id));
+			const deck = this.$store.state.device.deckProfile ? this.$store.state.settings.deckProfiles[this.$store.state.device.deckProfile] : this.$store.state.device.deck;
+			const vms = deck.layout.find(ids => ids.indexOf(this.column.id) != -1).map(id => this.getColumnVm(id));
 			if (this.active && countIf(vm => vm.$el.classList.contains('active'), vms) == 1) return;
 			this.active = !this.active;
 		},

src/client/app/common/views/deck/deck.vue

@@ -25,20 +25,29 @@ import * as uuid from 'uuid';
 
 export default Vue.extend({
 	i18n: i18n('deck'),
+
 	components: {
 		XColumnCore
 	},
 
 	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;
+			}
+		},
+
 		columns(): any[] {
-			if (this.$store.state.device.deck == null) return [];
-			return this.$store.state.device.deck.columns;
+			if (this.deck == null) return [];
+			return this.deck.columns;
 		},
 
 		layout(): any[] {
-			if (this.$store.state.device.deck == null) return [];
-			if (this.$store.state.device.deck.layout == null) return this.$store.state.device.deck.columns.map(c => [c.id]);
-			return this.$store.state.device.deck.layout;
+			if (this.deck == null) return [];
+			if (this.deck.layout == null) return this.deck.columns.map(c => [c.id]);
+			return this.deck.layout;
 		},
 
 		style(): any {
@@ -75,7 +84,7 @@ export default Vue.extend({
 	},
 
 	created() {
-		if (this.$store.state.device.deck == null) {
+		if (this.deck == null) {
 			const deck = {
 				columns: [/*{
 					type: 'widgets',
@@ -106,6 +115,14 @@ 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() {

src/client/app/store.ts

@@ -36,6 +36,7 @@ const defaultSettings = {
 	disableAnimatedMfm: false,
 	homeProfiles: {},
 	mobileHomeProfiles: {},
+	deckProfiles: {},
 };
 
 const defaultDeviceSettings = {
@@ -44,6 +45,7 @@ const defaultDeviceSettings = {
 	mobileHomeProfile: null,
 	mobileHome: [],
 	deck: null,
+	deckProfile: null,
 	deckMode: false,
 	deckColumnAlign: 'center',
 	deckColumnWidth: 'normal',
@@ -390,7 +392,20 @@ export default (os: MiOS) => new Vuex.Store({
 						name: 'mobileHomeProfiles',
 						value: profiles
 					});
-				}
+				},
+
+				updateDeckProfile(ctx) {
+					const profiles = ctx.state.deckProfiles;
+					profiles[ctx.rootState.device.deckProfile] = ctx.rootState.device.deck;
+					ctx.commit('set', {
+						key: 'deckProfiles',
+						value: profiles
+					});
+					os.api('i/update-client-setting', {
+						name: 'deckProfiles',
+						value: profiles
+					});
+				},
 			}
 		}
 	}