From 2afcdda0587b8f63b5bfd8c28348ede41b5f12ee Mon Sep 17 00:00:00 2001 From: tamaina <tamaina@hotmail.co.jp> Date: Fri, 19 Apr 2019 11:07:54 +0900 Subject: [PATCH] wip --- locales/ja-JP.yml | 13 ++++++ src/client/app/boot.js | 16 ++++---- .../views/components/settings/app-type.vue | 40 +++++++++++++++++++ .../views/components/settings/settings.vue | 3 ++ src/client/app/store.ts | 1 + 5 files changed, 65 insertions(+), 8 deletions(-) create mode 100644 src/client/app/common/views/components/settings/app-type.vue diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 5daf7e7e3a..c5325d2fab 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -460,6 +460,8 @@ common/views/components/connect-failed.troubleshooter.vue: flush: "キャッシュの削除" set-version: "バージョン指定" + + common/views/components/media-banner.vue: sensitive: "閲覧注意" click-to-show: "クリックして表示" @@ -637,6 +639,17 @@ common/views/components/emoji-picker.vue: symbols: "記号" flags: "旗" +common/views/components/settings/client-mode.vue: + title: "クライアント" + select-app-type: "利用するクライアントのモード" + choices: + auto: "自動で選択" + desktop: "デスクトップ版に固定" + mobile: "モバイル版に固定" + desktop: "デスクトップ" + mobile: "モバイル" + info: "変更はページの再度読み込み後に反映されます。" + common/views/components/signin.vue: username: "ユーザー名" password: "パスワード" diff --git a/src/client/app/boot.js b/src/client/app/boot.js index 01104bf715..56eb59e21e 100644 --- a/src/client/app/boot.js +++ b/src/client/app/boot.js @@ -35,12 +35,12 @@ const url = new URL(location.href); //#region Detect app name - let app = null; + var appType = null; - if (`${url.pathname}/`.startsWith('/docs/')) app = 'docs'; - if (`${url.pathname}/`.startsWith('/dev/')) app = 'dev'; - if (`${url.pathname}/`.startsWith('/auth/')) app = 'auth'; - if (`${url.pathname}/`.startsWith('/admin/')) app = 'admin'; + if (`${url.pathname}/`.startsWith('/docs/')) appType = 'docs'; + if (`${url.pathname}/`.startsWith('/dev/')) appType = 'dev'; + if (`${url.pathname}/`.startsWith('/auth/')) appType = 'auth'; + if (`${url.pathname}/`.startsWith('/admin/')) appType = 'admin'; //#endregion // Script version @@ -103,15 +103,15 @@ } // Switch desktop or mobile version - if (app == null) { - app = isMobile ? 'mobile' : 'desktop'; + if (appType == null) { + appType = isMobile ? 'mobile' : 'desktop'; } // Load an app script // Note: 'async' make it possible to load the script asyncly. // 'defer' make it possible to run the script when the dom loaded. const script = document.createElement('script'); - script.setAttribute('src', `/assets/${app}.${ver}.js`); + script.setAttribute('src', `/assets/${appType}.${ver}.js`); script.setAttribute('async', 'true'); script.setAttribute('defer', 'true'); head.appendChild(script); diff --git a/src/client/app/common/views/components/settings/app-type.vue b/src/client/app/common/views/components/settings/app-type.vue new file mode 100644 index 0000000000..533fd51517 --- /dev/null +++ b/src/client/app/common/views/components/settings/app-type.vue @@ -0,0 +1,40 @@ +<template> +<ui-card> + <template #title><fa :icon="faMobile"/> {{ $t('title') }}</template> + + <section class="fit-top"> + <ui-select v-model="lang" :placeholder="$t('select-app-type')"> + <option v-for="x in ['auto', 'desktop', 'mobile']" :value="x" :key="x">{{ $t(`choices.${x}`) }}</option> + </ui-select> + <ui-info>Current: <i>{{ $t(currentAppType) }}</i></ui-info> + <ui-info warn>{{ $t('info') }}</ui-info> + </section> +</ui-card> +</template> + +<script lang="ts"> +import Vue from 'vue'; +import i18n from '../../../../i18n'; +import { langs } from '../../../../config'; +import { faMobile } from '@fortawesome/free-solid-svg-icons' + +export default Vue.extend({ + i18n: i18n('common/views/components/settings/client-mode.vue'), + + data() { + return { + langs, + currentAppType: (window as any).appType, + + faMobile + }; + }, + + computed: { + appTypeForce: { + get() { return this.$store.state.device.appTypeForce; }, + set(value) { this.$store.commit('device/set', { key: 'appTypeForce', value }); } + }, + }, +}); +</script> diff --git a/src/client/app/common/views/components/settings/settings.vue b/src/client/app/common/views/components/settings/settings.vue index 1254eb5e5e..5f370c8be7 100644 --- a/src/client/app/common/views/components/settings/settings.vue +++ b/src/client/app/common/views/components/settings/settings.vue @@ -163,6 +163,7 @@ </ui-card> <x-language/> + <x-app-type/> </template> <template v-if="page == null || page == 'notification'"> @@ -271,6 +272,7 @@ import XPassword from './password.vue'; import XProfile from './profile.vue'; import XApi from './api.vue'; import XLanguage from './language.vue'; +import XAppType from './app-type.vue'; import XNotification from './notification.vue'; import { url, version } from '../../../../config'; @@ -291,6 +293,7 @@ export default Vue.extend({ XProfile, XApi, XLanguage, + XAppType, XNotification, }, props: { diff --git a/src/client/app/store.ts b/src/client/app/store.ts index 852d2c393d..cca7a5c2ce 100644 --- a/src/client/app/store.ts +++ b/src/client/app/store.ts @@ -60,6 +60,7 @@ const defaultDeviceSettings = { soundVolume: 0.5, mediaVolume: 0.5, lang: null, + appTypeForce: 'auto', debug: false, lightmode: false, loadRawImages: false,