diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 623bbdd98..9d5b052ef 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -836,6 +836,7 @@ desktop/views/components/settings.vue: api-via-stream-desc: "この設定をオンにすると、websocket接続を経由してAPIリクエストが行われます(パフォーマンス向上が期待できます)。オフにすると、ネイティブの fetch APIが利用されます。この設定はこのデバイスのみ有効です。" deck-nav: "デッキ内ナビゲーション" deck-nav-desc: "デッキを使用しているとき、ナビゲーションが発生する際にページ遷移を行わずに一時的なカラムで受けるようにします。" + deck-default: "デッキをデフォルトのUIにする" display: "デザインと表示" customize: "ホームをカスタマイズ" diff --git a/src/client/app/desktop/script.ts b/src/client/app/desktop/script.ts index 3c9003cbe..6b81a5aa7 100644 --- a/src/client/app/desktop/script.ts +++ b/src/client/app/desktop/script.ts @@ -21,6 +21,7 @@ import updateAvatar from './api/update-avatar'; import updateBanner from './api/update-banner'; import MkIndex from './views/pages/index.vue'; +import MkHome from './views/pages/home.vue'; import MkDeck from './views/pages/deck/deck.vue'; import MkAdmin from './views/pages/admin/admin.vue'; import MkStats from './views/pages/stats/stats.vue'; @@ -54,6 +55,7 @@ init(async (launch) => { mode: 'history', routes: [ { path: '/', name: 'index', component: MkIndex }, + { path: '/home', name: 'home', component: MkHome }, { path: '/deck', name: 'deck', component: MkDeck }, { path: '/admin', name: 'admin', component: MkAdmin }, { path: '/stats', name: 'stats', component: MkStats }, diff --git a/src/client/app/desktop/views/components/settings.vue b/src/client/app/desktop/views/components/settings.vue index cd91c1461..3e64ebf59 100644 --- a/src/client/app/desktop/views/components/settings.vue +++ b/src/client/app/desktop/views/components/settings.vue @@ -97,6 +97,9 @@ <ui-radio v-model="navbar" value="left">%i18n:@navbar-position-left%</ui-radio> <ui-radio v-model="navbar" value="right">%i18n:@navbar-position-right%</ui-radio> </section> + <section> + <ui-switch v-model="deckDefault">%i18n:@deck-default%</ui-switch> + </section> <section> <ui-switch v-model="darkmode">%i18n:@dark-mode%</ui-switch> <ui-switch v-model="useShadow">%i18n:@use-shadow%</ui-switch> @@ -366,6 +369,11 @@ export default Vue.extend({ set(value) { this.$store.commit('device/set', { key: 'deckColumnAlign', value }); } }, + deckDefault: { + get() { return this.$store.state.device.deckDefault; }, + set(value) { this.$store.commit('device/set', { key: 'deckDefault', value }); } + }, + enableSounds: { get() { return this.$store.state.device.enableSounds; }, set(value) { this.$store.commit('device/set', { key: 'enableSounds', value }); } diff --git a/src/client/app/desktop/views/components/ui.header.nav.vue b/src/client/app/desktop/views/components/ui.header.nav.vue index 122570a69..3acc25c0d 100644 --- a/src/client/app/desktop/views/components/ui.header.nav.vue +++ b/src/client/app/desktop/views/components/ui.header.nav.vue @@ -2,18 +2,22 @@ <div class="nav"> <ul> <template v-if="$store.getters.isSignedIn"> - <li class="home" :class="{ active: $route.name == 'index' }" @click="goToTop"> - <router-link to="/"> - %fa:home% - <p>%i18n:@home%</p> - </router-link> - </li> - <li class="deck" :class="{ active: $route.name == 'deck' }" @click="goToTop"> - <router-link to="/deck"> - %fa:columns% - <p>%i18n:@deck%</p> - </router-link> - </li> + <template v-if="$store.state.device.deckDefault"> + <li class="deck" :class="{ active: $route.name == 'deck' || $route.name == 'index' }" @click="goToTop"> + <router-link to="/">%fa:columns%<p>%i18n:@deck%</p></router-link> + </li> + <li class="home" :class="{ active: $route.name == 'home' }" @click="goToTop"> + <router-link to="/home">%fa:home%<p>%i18n:@home%</p></router-link> + </li> + </template> + <template v-else> + <li class="home" :class="{ active: $route.name == 'home' || $route.name == 'index' }" @click="goToTop"> + <router-link to="/">%fa:home%<p>%i18n:@home%</p></router-link> + </li> + <li class="deck" :class="{ active: $route.name == 'deck' }" @click="goToTop"> + <router-link to="/deck">%fa:columns%<p>%i18n:@deck%</p></router-link> + </li> + </template> <li class="messaging"> <a @click="messaging"> %fa:comments% diff --git a/src/client/app/desktop/views/components/ui.sidebar.vue b/src/client/app/desktop/views/components/ui.sidebar.vue index 716d3b0e5..36b5b3958 100644 --- a/src/client/app/desktop/views/components/ui.sidebar.vue +++ b/src/client/app/desktop/views/components/ui.sidebar.vue @@ -6,12 +6,22 @@ </div> <div class="nav" v-if="$store.getters.isSignedIn"> - <div class="home" :class="{ active: $route.name == 'index' }" @click="goToTop"> - <router-link to="/">%fa:home%</router-link> - </div> - <div class="deck" :class="{ active: $route.name == 'deck' }" @click="goToTop"> - <router-link to="/deck">%fa:columns%</router-link> - </div> + <template v-if="$store.state.device.deckDefault"> + <div class="deck" :class="{ active: $route.name == 'deck' || $route.name == 'index' }" @click="goToTop"> + <router-link to="/">%fa:columns%</router-link> + </div> + <div class="home" :class="{ active: $route.name == 'home' }" @click="goToTop"> + <router-link to="/home">%fa:home%</router-link> + </div> + </template> + <template v-else> + <div class="home" :class="{ active: $route.name == 'home' || $route.name == 'index' }" @click="goToTop"> + <router-link to="/">%fa:home%</router-link> + </div> + <div class="deck" :class="{ active: $route.name == 'deck' }" @click="goToTop"> + <router-link to="/deck">%fa:columns%</router-link> + </div> + </template> <div class="messaging"> <a @click="messaging">%fa:comments%<template v-if="hasUnreadMessagingMessage">%fa:circle%</template></a> </div> diff --git a/src/client/app/desktop/views/pages/index.vue b/src/client/app/desktop/views/pages/index.vue index 5d11fc542..c531e00e4 100644 --- a/src/client/app/desktop/views/pages/index.vue +++ b/src/client/app/desktop/views/pages/index.vue @@ -1,16 +1,25 @@ <template> -<component :is="$store.getters.isSignedIn ? 'home' : 'welcome'"></component> +<component :is="page"></component> </template> <script lang="ts"> import Vue from 'vue'; import Home from './home.vue'; import Welcome from './welcome.vue'; +import Deck from './deck/deck.vue'; export default Vue.extend({ components: { Home, + Deck, Welcome + }, + + computed: { + page(): string { + if (!this.$store.getters.isSignedIn) return 'welcome'; + return this.$store.state.device.deckDefault ? 'deck' : 'home'; + } } }); </script> diff --git a/src/client/app/store.ts b/src/client/app/store.ts index ac6de7424..160e62fa4 100644 --- a/src/client/app/store.ts +++ b/src/client/app/store.ts @@ -60,7 +60,8 @@ const defaultDeviceSettings = { navbar: 'top', deckColumnAlign: 'center', mobileNotificationPosition: 'bottom', - deckTemporaryColumn: null + deckTemporaryColumn: null, + deckDefault: false }; export default (os: MiOS) => new Vuex.Store({