From c34f302b1c91bd3b091cd03fa60fae86b385f902 Mon Sep 17 00:00:00 2001 From: syuilo <syuilotan@yahoo.co.jp> Date: Wed, 19 Aug 2020 21:47:18 +0900 Subject: [PATCH] =?UTF-8?q?enhance(client):=20=E3=82=B5=E3=83=BC=E3=83=90?= =?UTF-8?q?=E3=83=BC=E3=81=8B=E3=82=89=E5=88=87=E6=96=AD=E3=81=95=E3=82=8C?= =?UTF-8?q?=E3=81=9F=E3=81=A8=E3=81=8D=E3=81=AB=E3=83=80=E3=82=A4=E3=82=A2?= =?UTF-8?q?=E3=83=AD=E3=82=B0=E3=81=A7=E8=AD=A6=E5=91=8A=E3=82=92=E8=A1=A8?= =?UTF-8?q?=E7=A4=BA=E3=81=A7=E3=81=8D=E3=82=8B=E3=82=88=E3=81=86=E3=81=AB?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- locales/ja-JP.yml | 7 ++++++- src/client/components/stream-indicator.vue | 11 +---------- src/client/init.ts | 20 ++++++++++++++++++++ src/client/pages/preferences/index.vue | 13 +++++++------ src/client/store.ts | 2 +- 5 files changed, 35 insertions(+), 18 deletions(-) diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml index 678f20e8c..870041d67 100644 --- a/locales/ja-JP.yml +++ b/locales/ja-JP.yml @@ -264,6 +264,7 @@ rename: "名前を変更" avatar: "アイコン" banner: "バナー" nsfw: "閲覧注意" +whenServerDisconnected: "サーバーとの接続が失われたとき" disconnectedFromServer: "サーバーから切断されました" reload: "リロード" doNothing: "なにもしない" @@ -364,7 +365,6 @@ unregister: "登録を解除" passwordLessLogin: "パスワード無しログイン" resetPassword: "パスワードをリセット" newPasswordIs: "新しいパスワードは「{password}」です" -autoReloadWhenDisconnected: "サーバー切断時に自動リロード" autoNoteWatch: "ノートの自動ウォッチ" autoNoteWatchDescription: "あなたがリアクションしたり返信したりした他のユーザーのノートに関する通知を受け取るようにします。" reduceUiAnimation: "UIのアニメーションを減らす" @@ -567,6 +567,11 @@ database: "データベース" channel: "チャンネル" create: "作成" +_serverDisconnectedBehavior: + reload: "自動でリロード" + dialog: "ダイアログで警告" + quiet: "控えめに警告" + _channel: create: "チャンネルを作成" edit: "チャンネルを編集" diff --git a/src/client/components/stream-indicator.vue b/src/client/components/stream-indicator.vue index ec00f4cbf..9005cb9a8 100644 --- a/src/client/components/stream-indicator.vue +++ b/src/client/components/stream-indicator.vue @@ -1,5 +1,5 @@ <template> -<div class="nsbbhtug" v-if="hasDisconnected" @click="resetDisconnected"> +<div class="nsbbhtug" v-if="hasDisconnected && $store.state.device.serverDisconnectedBehavior === 'quiet'" @click="resetDisconnected"> <div>{{ $t('disconnectedFromServer') }}</div> <div class="command"> <button class="_textButton" @click="reload">{{ $t('reload') }}</button> @@ -23,21 +23,12 @@ export default Vue.extend({ }, }, created() { - this.$root.stream.on('_connected_', this.onConnected); this.$root.stream.on('_disconnected_', this.onDisconnected); }, beforeDestroy() { - this.$root.stream.off('_connected_', this.onConnected); this.$root.stream.off('_disconnected_', this.onDisconnected); }, methods: { - onConnected() { - if (this.hasDisconnected) { - if (this.$store.state.device.autoReload) { - this.reload(); - } - } - }, onDisconnected() { this.hasDisconnected = true; }, diff --git a/src/client/init.ts b/src/client/init.ts index b80df44c8..3931329aa 100644 --- a/src/client/init.ts +++ b/src/client/init.ts @@ -237,6 +237,26 @@ os.init(async () => { document.documentElement.style.setProperty('--modalBgFilter', v ? 'blur(4px)' : 'none'); }, { immediate: true }); + let reloadDialogShowing = false; + os.stream.on('_disconnected_', async () => { + if (store.state.device.serverDisconnectedBehavior === 'reload') { + location.reload(); + } else if (store.state.device.serverDisconnectedBehavior === 'dialog') { + if (reloadDialogShowing) return; + reloadDialogShowing = true; + const { canceled } = await app.dialog({ + type: 'warning', + title: app.$t('disconnectedFromServer'), + text: app.$t('reloadConfirm'), + showCancelButton: true + }); + reloadDialogShowing = false; + if (!canceled) { + location.reload(); + } + } + }); + os.stream.on('emojiAdded', data => { // TODO //store.commit('instance/set', ); diff --git a/src/client/pages/preferences/index.vue b/src/client/pages/preferences/index.vue index 9d3959fcc..4e171bfcb 100644 --- a/src/client/pages/preferences/index.vue +++ b/src/client/pages/preferences/index.vue @@ -95,9 +95,10 @@ <section class="_card _vMargin"> <div class="_title"><fa :icon="faCog"/> {{ $t('general') }}</div> <div class="_content"> - <mk-switch v-model="autoReload"> - {{ $t('autoReloadWhenDisconnected') }} - </mk-switch> + <div>{{ $t('whenServerDisconnected') }}</div> + <mk-radio v-model="serverDisconnectedBehavior" value="reload">{{ $t('_serverDisconnectedBehavior.reload') }}</mk-radio> + <mk-radio v-model="serverDisconnectedBehavior" value="dialog">{{ $t('_serverDisconnectedBehavior.dialog') }}</mk-radio> + <mk-radio v-model="serverDisconnectedBehavior" value="quiet">{{ $t('_serverDisconnectedBehavior.quiet') }}</mk-radio> </div> <div class="_content"> <mk-switch v-model="imageNewTab">{{ $t('openImageInNewTab') }}</mk-switch> @@ -186,9 +187,9 @@ export default Vue.extend({ }, computed: { - autoReload: { - get() { return this.$store.state.device.autoReload; }, - set(value) { this.$store.commit('device/set', { key: 'autoReload', value }); } + serverDisconnectedBehavior: { + get() { return this.$store.state.device.serverDisconnectedBehavior; }, + set(value) { this.$store.commit('device/set', { key: 'serverDisconnectedBehavior', value }); } }, reduceAnimation: { diff --git a/src/client/store.ts b/src/client/store.ts index 7e747a570..07566954a 100644 --- a/src/client/store.ts +++ b/src/client/store.ts @@ -60,7 +60,7 @@ export const defaultDeviceSettings = { loadRawImages: false, alwaysShowNsfw: false, useOsNativeEmojis: false, - autoReload: false, + serverDisconnectedBehavior: 'quiet', accounts: [], recentEmojis: [], themes: [],