diff options
| author | syuilo <syuilotan@yahoo.co.jp> | 2018-05-27 13:49:09 +0900 |
|---|---|---|
| committer | syuilo <syuilotan@yahoo.co.jp> | 2018-05-27 13:49:09 +0900 |
| commit | d5f92eed8c4b1a42e0b05f9da2fa86dbc17922f4 (patch) | |
| tree | 6df2013d367b2a88d1dc4d5778deee52b77ed8d7 /src/client | |
| parent | Update favicon (diff) | |
| download | misskey-d5f92eed8c4b1a42e0b05f9da2fa86dbc17922f4.tar.gz misskey-d5f92eed8c4b1a42e0b05f9da2fa86dbc17922f4.tar.bz2 misskey-d5f92eed8c4b1a42e0b05f9da2fa86dbc17922f4.zip | |
Refactor
Diffstat (limited to 'src/client')
69 files changed, 314 insertions, 330 deletions
diff --git a/src/client/app/auth/views/index.vue b/src/client/app/auth/views/index.vue index 0fcd9bfe53..e53bbd026f 100644 --- a/src/client/app/auth/views/index.vue +++ b/src/client/app/auth/views/index.vue @@ -1,6 +1,6 @@ <template> <div class="index"> - <main v-if="os.isSignedIn"> + <main v-if="$store.getters.isSignedIn"> <p class="fetching" v-if="fetching">読み込み中<mk-ellipsis/></p> <x-form ref="form" @@ -22,7 +22,7 @@ <p>セッションが存在しません。</p> </div> </main> - <main class="signin" v-if="!os.isSignedIn"> + <main class="signin" v-if="!$store.getters.isSignedIn"> <h1>サインインしてください</h1> <mk-signin/> </main> @@ -51,7 +51,7 @@ export default Vue.extend({ } }, mounted() { - if (!this.$root.$data.os.isSignedIn) return; + if (!this.$root.$data.$store.getters.isSignedIn) return; // Fetch session (this as any).api('auth/session/show', { diff --git a/src/client/app/common/scripts/streaming/home.ts b/src/client/app/common/scripts/streaming/home.ts index 44d07e331a..2715b9e0e9 100644 --- a/src/client/app/common/scripts/streaming/home.ts +++ b/src/client/app/common/scripts/streaming/home.ts @@ -24,10 +24,8 @@ export class HomeStream extends Stream { if (os.debug) { console.log('I updated:', i); } - merge(me, i); - // キャッシュ更新 - os.bakeMe(); + os.store.dispatch('mergeMe', i); }); this.on('clientSettingUpdated', x => { diff --git a/src/client/app/common/views/components/avatar.vue b/src/client/app/common/views/components/avatar.vue index 3e1b17635f..a65b62882f 100644 --- a/src/client/app/common/views/components/avatar.vue +++ b/src/client/app/common/views/components/avatar.vue @@ -32,7 +32,7 @@ export default Vue.extend({ ? `rgb(${ this.user.avatarColor.join(',') })` : null, backgroundImage: this.lightmode ? null : `url(${ this.user.avatarUrl }?thumbnail)`, - borderRadius: (this as any).clientSettings.circleIcons ? '100%' : null + borderRadius: this.$store.state.settings.circleIcons ? '100%' : null }; } } diff --git a/src/client/app/common/views/components/messaging-room.message.vue b/src/client/app/common/views/components/messaging-room.message.vue index ef39199dc4..a77b5f3658 100644 --- a/src/client/app/common/views/components/messaging-room.message.vue +++ b/src/client/app/common/views/components/messaging-room.message.vue @@ -8,7 +8,7 @@ <img src="/assets/desktop/messaging/delete.png" alt="Delete"/> </button> <div class="content" v-if="!message.isDeleted"> - <mk-note-html class="text" v-if="message.text" ref="text" :text="message.text" :i="os.i"/> + <mk-note-html class="text" v-if="message.text" ref="text" :text="message.text" :i="$store.state.i"/> <div class="file" v-if="message.file"> <a :href="message.file.url" target="_blank" :title="message.file.name"> <img v-if="message.file.type.split('/')[0] == 'image'" :src="message.file.url" :alt="message.file.name"/> @@ -42,7 +42,7 @@ export default Vue.extend({ }, computed: { isMe(): boolean { - return this.message.userId == (this as any).os.i.id; + return this.message.userId == this.$store.state.i.id; }, urls(): string[] { if (this.message.text) { diff --git a/src/client/app/common/views/components/messaging-room.vue b/src/client/app/common/views/components/messaging-room.vue index 79756b22eb..b2831d6928 100644 --- a/src/client/app/common/views/components/messaging-room.vue +++ b/src/client/app/common/views/components/messaging-room.vue @@ -72,7 +72,7 @@ export default Vue.extend({ }, mounted() { - this.connection = new MessagingStream((this as any).os, (this as any).os.i, this.user.id); + this.connection = new MessagingStream((this as any).os, this.$store.state.i, this.user.id); this.connection.on('message', this.onMessage); this.connection.on('read', this.onRead); @@ -164,7 +164,7 @@ export default Vue.extend({ const isBottom = this.isBottom(); this.messages.push(message); - if (message.userId != (this as any).os.i.id && !document.hidden) { + if (message.userId != this.$store.state.i.id && !document.hidden) { this.connection.send({ type: 'read', id: message.id @@ -176,7 +176,7 @@ export default Vue.extend({ this.$nextTick(() => { this.scrollToBottom(); }); - } else if (message.userId != (this as any).os.i.id) { + } else if (message.userId != this.$store.state.i.id) { // Notify this.notifyNewMessage(); } @@ -229,7 +229,7 @@ export default Vue.extend({ onVisibilitychange() { if (document.hidden) return; this.messages.forEach(message => { - if (message.userId !== (this as any).os.i.id && !message.isRead) { + if (message.userId !== this.$store.state.i.id && !message.isRead) { this.connection.send({ type: 'read', id: message.id diff --git a/src/client/app/common/views/components/messaging.vue b/src/client/app/common/views/components/messaging.vue index 11f9c366d4..2ddec29984 100644 --- a/src/client/app/common/views/components/messaging.vue +++ b/src/client/app/common/views/components/messaging.vue @@ -95,7 +95,7 @@ export default Vue.extend({ methods: { getAcct, isMe(message) { - return message.userId == (this as any).os.i.id; + return message.userId == this.$store.state.i.id; }, onMessage(message) { this.messages = this.messages.filter(m => !( diff --git a/src/client/app/common/views/components/note-menu.vue b/src/client/app/common/views/components/note-menu.vue index 88dc22aaf4..fb95055049 100644 --- a/src/client/app/common/views/components/note-menu.vue +++ b/src/client/app/common/views/components/note-menu.vue @@ -3,7 +3,7 @@ <div class="backdrop" ref="backdrop" @click="close"></div> <div class="popover" :class="{ compact }" ref="popover"> <button @click="favorite">%i18n:@favorite%</button> - <button v-if="note.userId == os.i.id" @click="pin">%i18n:@pin%</button> + <button v-if="note.userId == $store.state.i.id" @click="pin">%i18n:@pin%</button> <a v-if="note.uri" :href="note.uri" target="_blank">%i18n:@remote%</a> </div> </div> diff --git a/src/client/app/common/views/components/othello.game.vue b/src/client/app/common/views/components/othello.game.vue index ea75558d10..4c63bd18b8 100644 --- a/src/client/app/common/views/components/othello.game.vue +++ b/src/client/app/common/views/components/othello.game.vue @@ -61,13 +61,13 @@ export default Vue.extend({ computed: { iAmPlayer(): boolean { - if (!(this as any).os.isSignedIn) return false; - return this.game.user1Id == (this as any).os.i.id || this.game.user2Id == (this as any).os.i.id; + if (!this.$store.getters.isSignedIn) return false; + return this.game.user1Id == this.$store.state.i.id || this.game.user2Id == this.$store.state.i.id; }, myColor(): Color { if (!this.iAmPlayer) return null; - if (this.game.user1Id == (this as any).os.i.id && this.game.black == 1) return true; - if (this.game.user2Id == (this as any).os.i.id && this.game.black == 2) return true; + if (this.game.user1Id == this.$store.state.i.id && this.game.black == 1) return true; + if (this.game.user2Id == this.$store.state.i.id && this.game.black == 2) return true; return false; }, opColor(): Color { @@ -91,7 +91,7 @@ export default Vue.extend({ }, isMyTurn(): boolean { if (this.turnUser == null) return null; - return this.turnUser.id == (this as any).os.i.id; + return this.turnUser.id == this.$store.state.i.id; } }, diff --git a/src/client/app/common/views/components/othello.gameroom.vue b/src/client/app/common/views/components/othello.gameroom.vue index dba9ccd16d..2dbd04ce49 100644 --- a/src/client/app/common/views/components/othello.gameroom.vue +++ b/src/client/app/common/views/components/othello.gameroom.vue @@ -25,7 +25,7 @@ export default Vue.extend({ }, created() { this.g = this.game; - this.connection = new OthelloGameStream((this as any).os, (this as any).os.i, this.game); + this.connection = new OthelloGameStream((this as any).os, this.$store.state.i, this.game); this.connection.on('started', this.onStarted); }, beforeDestroy() { diff --git a/src/client/app/common/views/components/othello.room.vue b/src/client/app/common/views/components/othello.room.vue index 86368b3cc3..dcf41f2e04 100644 --- a/src/client/app/common/views/components/othello.room.vue +++ b/src/client/app/common/views/components/othello.room.vue @@ -116,13 +116,13 @@ export default Vue.extend({ return categories.filter((item, pos) => categories.indexOf(item) == pos); }, isAccepted(): boolean { - if (this.game.user1Id == (this as any).os.i.id && this.game.user1Accepted) return true; - if (this.game.user2Id == (this as any).os.i.id && this.game.user2Accepted) return true; + if (this.game.user1Id == this.$store.state.i.id && this.game.user1Accepted) return true; + if (this.game.user2Id == this.$store.state.i.id && this.game.user2Accepted) return true; return false; }, isOpAccepted(): boolean { - if (this.game.user1Id != (this as any).os.i.id && this.game.user1Accepted) return true; - if (this.game.user2Id != (this as any).os.i.id && this.game.user2Accepted) return true; + if (this.game.user1Id != this.$store.state.i.id && this.game.user1Accepted) return true; + if (this.game.user2Id != this.$store.state.i.id && this.game.user2Accepted) return true; return false; } }, @@ -133,8 +133,8 @@ export default Vue.extend({ this.connection.on('init-form', this.onInitForm); this.connection.on('message', this.onMessage); - if (this.game.user1Id != (this as any).os.i.id && this.game.settings.form1) this.form = this.game.settings.form1; - if (this.game.user2Id != (this as any).os.i.id && this.game.settings.form2) this.form = this.game.settings.form2; + if (this.game.user1Id != this.$store.state.i.id && this.game.settings.form1) this.form = this.game.settings.form1; + if (this.game.user2Id != this.$store.state.i.id && this.game.settings.form2) this.form = this.game.settings.form2; }, beforeDestroy() { @@ -185,12 +185,12 @@ export default Vue.extend({ }, onInitForm(x) { - if (x.userId == (this as any).os.i.id) return; + if (x.userId == this.$store.state.i.id) return; this.form = x.form; }, onMessage(x) { - if (x.userId == (this as any).os.i.id) return; + if (x.userId == this.$store.state.i.id) return; this.messages.unshift(x.message); }, diff --git a/src/client/app/common/views/components/twitter-setting.vue b/src/client/app/common/views/components/twitter-setting.vue index 9a2a1c3d40..d1cb78c544 100644 --- a/src/client/app/common/views/components/twitter-setting.vue +++ b/src/client/app/common/views/components/twitter-setting.vue @@ -1,13 +1,13 @@ <template> <div class="mk-twitter-setting"> <p>%i18n:@description%<a :href="`${docsUrl}/link-to-twitter`" target="_blank">%i18n:@detail%</a></p> - <p class="account" v-if="os.i.twitter" :title="`Twitter ID: ${os.i.twitter.userId}`">%i18n:@connected-to%: <a :href="`https://twitter.com/${os.i.twitter.screenName}`" target="_blank">@{{ os.i.twitter.screenName }}</a></p> + <p class="account" v-if="$store.state.i.twitter" :title="`Twitter ID: ${$store.state.i.twitter.userId}`">%i18n:@connected-to%: <a :href="`https://twitter.com/${$store.state.i.twitter.screenName}`" target="_blank">@{{ $store.state.i.twitter.screenName }}</a></p> <p> - <a :href="`${apiUrl}/connect/twitter`" target="_blank" @click.prevent="connect">{{ os.i.twitter ? '%i18n:@reconnect%' : '%i18n:@connect%' }}</a> - <span v-if="os.i.twitter"> or </span> - <a :href="`${apiUrl}/disconnect/twitter`" target="_blank" v-if="os.i.twitter" @click.prevent="disconnect">%i18n:@disconnect%</a> + <a :href="`${apiUrl}/connect/twitter`" target="_blank" @click.prevent="connect">{{ $store.state.i.twitter ? '%i18n:@reconnect%' : '%i18n:@connect%' }}</a> + <span v-if="$store.state.i.twitter"> or </span> + <a :href="`${apiUrl}/disconnect/twitter`" target="_blank" v-if="$store.state.i.twitter" @click.prevent="disconnect">%i18n:@disconnect%</a> </p> - <p class="id" v-if="os.i.twitter">Twitter ID: {{ os.i.twitter.userId }}</p> + <p class="id" v-if="$store.state.i.twitter">Twitter ID: {{ $store.state.i.twitter.userId }}</p> </div> </template> @@ -24,8 +24,8 @@ export default Vue.extend({ }; }, mounted() { - this.$watch('os.i', () => { - if ((this as any).os.i.twitter) { + this.$watch('$store.state.i', () => { + if (this.$store.state.i.twitter) { if (this.form) this.form.close(); } }, { diff --git a/src/client/app/common/views/components/uploader.vue b/src/client/app/common/views/components/uploader.vue index a6caa80f3c..f4797d89f7 100644 --- a/src/client/app/common/views/components/uploader.vue +++ b/src/client/app/common/views/components/uploader.vue @@ -50,7 +50,7 @@ export default Vue.extend({ reader.readAsDataURL(file); const data = new FormData(); - data.append('i', (this as any).os.i.token); + data.append('i', this.$store.state.i.token); data.append('file', file); if (folder) data.append('folderId', folder); diff --git a/src/client/app/desktop/api/choose-drive-file.ts b/src/client/app/desktop/api/choose-drive-file.ts index fbda600e6e..3d0004b741 100644 --- a/src/client/app/desktop/api/choose-drive-file.ts +++ b/src/client/app/desktop/api/choose-drive-file.ts @@ -1,18 +1,17 @@ +import OS from '../../mios'; import { url } from '../../config'; import MkChooseFileFromDriveWindow from '../views/components/choose-file-from-drive-window.vue'; -export default function(opts) { +export default (os: OS) => opts => { return new Promise((res, rej) => { const o = opts || {}; if (document.body.clientWidth > 800) { - const w = new MkChooseFileFromDriveWindow({ - propsData: { - title: o.title, - multiple: o.multiple, - initFolder: o.currentFolder - } - }).$mount(); + const w = os.new(MkChooseFileFromDriveWindow, { + title: o.title, + multiple: o.multiple, + initFolder: o.currentFolder + }); w.$once('selected', file => { res(file); }); @@ -27,4 +26,4 @@ export default function(opts) { 'height=500, width=800'); } }); -} +}; diff --git a/src/client/app/desktop/api/choose-drive-folder.ts b/src/client/app/desktop/api/choose-drive-folder.ts index 9b33a20d9a..68dc7988b5 100644 --- a/src/client/app/desktop/api/choose-drive-folder.ts +++ b/src/client/app/desktop/api/choose-drive-folder.ts @@ -1,17 +1,16 @@ +import OS from '../../mios'; import MkChooseFolderFromDriveWindow from '../views/components/choose-folder-from-drive-window.vue'; -export default function(opts) { +export default (os: OS) => opts => { return new Promise((res, rej) => { const o = opts || {}; - const w = new MkChooseFolderFromDriveWindow({ - propsData: { - title: o.title, - initFolder: o.currentFolder - } - }).$mount(); + const w = os.new(MkChooseFolderFromDriveWindow, { + title: o.title, + initFolder: o.currentFolder + }); w.$once('selected', folder => { res(folder); }); document.body.appendChild(w.$el); }); -} +}; diff --git a/src/client/app/desktop/api/update-avatar.ts b/src/client/app/desktop/api/update-avatar.ts index 8ddaebc072..887367a24e 100644 --- a/src/client/app/desktop/api/update-avatar.ts +++ b/src/client/app/desktop/api/update-avatar.ts @@ -6,17 +6,15 @@ import ProgressDialog from '../views/components/progress-dialog.vue'; export default (os: OS) => (cb, file = null) => { const fileSelected = file => { - const w = new CropWindow({ - propsData: { - image: file, - title: 'アバターとして表示する部分を選択', - aspectRatio: 1 / 1 - } - }).$mount(); + const w = os.new(CropWindow, { + image: file, + title: 'アバターとして表示する部分を選択', + aspectRatio: 1 / 1 + }); w.$once('cropped', blob => { const data = new FormData(); - data.append('i', os.i.token); + data.append('i', os.store.state.i.token); data.append('file', blob, file.name + '.cropped.png'); os.api('drive/folders/find', { @@ -42,11 +40,9 @@ export default (os: OS) => (cb, file = null) => { }; const upload = (data, folder) => { - const dialog = new ProgressDialog({ - propsData: { - title: '新しいアバターをアップロードしています' - } - }).$mount(); + const dialog = os.new(ProgressDialog, { + title: '新しいアバターをアップロードしています' + }); document.body.appendChild(dialog.$el); if (folder) data.append('folderId', folder.id); @@ -70,8 +66,14 @@ export default (os: OS) => (cb, file = null) => { os.api('i/update', { avatarId: file.id }).then(i => { - os.i.avatarId = i.avatarId; - os.i.avatarUrl = i.avatarUrl; + os.store.commit('updateIKeyValue', { + key: 'avatarId', + value: i.avatarId + }); + os.store.commit('updateIKeyValue', { + key: 'avatarUrl', + value: i.avatarUrl + }); os.apis.dialog({ title: '%fa:info-circle%アバターを更新しました', diff --git a/src/client/app/desktop/api/update-banner.ts b/src/client/app/desktop/api/update-banner.ts index 1a5da272bd..4e6dd4e2c7 100644 --- a/src/client/app/desktop/api/update-banner.ts +++ b/src/client/app/desktop/api/update-banner.ts @@ -6,17 +6,15 @@ import ProgressDialog from '../views/components/progress-dialog.vue'; export default (os: OS) => { const cropImage = file => new Promise((resolve, reject) => { - const w = new CropWindow({ - propsData: { - image: file, - title: 'バナーとして表示する部分を選択', - aspectRatio: 16 / 9 - } - }).$mount(); + const w = os.new(CropWindow, { + image: file, + title: 'バナーとして表示する部分を選択', + aspectRatio: 16 / 9 + }); w.$once('cropped', blob => { const data = new FormData(); - data.append('i', os.i.token); + data.append('i', os.store.state.i.token); data.append('file', blob, file.name + '.cropped.png'); os.api('drive/folders/find', { @@ -44,11 +42,9 @@ export default (os: OS) => { }); const upload = (data, folder) => new Promise((resolve, reject) => { - const dialog = new ProgressDialog({ - propsData: { - title: '新しいバナーをアップロードしています' - } - }).$mount(); + const dialog = os.new(ProgressDialog, { + title: '新しいバナーをアップロードしています' + }); document.body.appendChild(dialog.$el); if (folder) data.append('folderId', folder.id); @@ -73,8 +69,14 @@ export default (os: OS) => { return os.api('i/update', { bannerId: file.id }).then(i => { - os.i.bannerId = i.bannerId; - os.i.bannerUrl = i.bannerUrl; + os.store.commit('updateIKeyValue', { + key: 'bannerId', + value: i.bannerId + }); + os.store.commit('updateIKeyValue', { + key: 'bannerUrl', + value: i.bannerUrl + }); os.apis.dialog({ title: '%fa:info-circle%バナーを更新しました', diff --git a/src/client/app/desktop/script.ts b/src/client/app/desktop/script.ts index 2658a86b95..09a9257ea3 100644 --- a/src/client/app/desktop/script.ts +++ b/src/client/app/desktop/script.ts @@ -2,7 +2,6 @@ * Desktop Client */ -import Vue from 'vue'; import VueRouter from 'vue-router'; // Style @@ -68,8 +67,8 @@ init(async (launch) => { // Launch the app const [, os] = launch(router, os => ({ - chooseDriveFolder, - chooseDriveFile, + chooseDriveFolder: chooseDriveFolder(os), + chooseDriveFile: chooseDriveFile(os), dialog, input, post, diff --git a/src/client/app/desktop/views/components/drive.file.vue b/src/client/app/desktop/views/components/drive.file.vue index fb553e1ae7..fe8f57bc5f 100644 --- a/src/client/app/desktop/views/components/drive.file.vue +++ b/src/client/app/desktop/views/components/drive.file.vue @@ -9,10 +9,10 @@ @contextmenu.prevent.stop="onContextmenu" :title="title" > - <div class="label" v-if="os.i.avatarId == file.id"><img src="/assets/label.svg"/> + <div class="label" v-if="$store.state.i.avatarId == file.id"><img src="/assets/label.svg"/> <p>%i18n:@avatar%</p> </div> - <div class="label" v-if="os.i.bannerId == file.id"><img src="/assets/label.svg"/> + <div class="label" v-if="$store.state.i.bannerId == file.id"><img src="/assets/label.svg"/> <p>%i18n:@banner%</p> </div> <div class="thumbnail" ref="thumbnail" :style="`background-color: ${ background }`"> diff --git a/src/client/app/desktop/views/components/home.vue b/src/client/app/desktop/views/components/home.vue index d84c1e404f..9d34575e55 100644 --- a/src/client/app/desktop/views/components/home.vue +++ b/src/client/app/desktop/views/components/home.vue @@ -51,7 +51,7 @@ <div class="main"> <a @click="hint">カスタマイズのヒント</a> <div> - <mk-post-form v-if="clientSettings.showPostFormOnTopOfTl"/> + <mk-post-form v-if="$store.state.settings.showPostFormOnTopOfTl"/> <mk-timeline ref="tl" @loaded="onTlLoaded"/> </div> </div> @@ -61,7 +61,7 @@ <component v-for="widget in widgets[place]" :is="`mkw-${widget.name}`" :key="widget.id" :ref="widget.id" :widget="widget" @chosen="warp"/> </div> <div class="main"> - <mk-post-form v-if="clientSettings.showPostFormOnTopOfTl"/> + <mk-post-form v-if="$store.state.settings.showPostFormOnTopOfTl"/> <mk-timeline ref="tl" @loaded="onTlLoaded" v-if="mode == 'timeline'"/> <mk-mentions @loaded="onTlLoaded" v-if="mode == 'mentions'"/> </div> diff --git a/src/client/app/desktop/views/components/note-detail.sub.vue b/src/client/app/desktop/views/components/note-detail.sub.vue index c798b41b25..0471c70ee7 100644 --- a/src/client/app/desktop/views/components/note-detail.sub.vue +++ b/src/client/app/desktop/views/components/note-detail.sub.vue @@ -16,7 +16,7 @@ <div class="body"> <div class="text"> <span v-if="note.isHidden" style="opacity: 0.5">%i18n:@private%</span> - <mk-note-html v-if="note.text" :text="note.text" :i="os.i"/> + <mk-note-html v-if="note.text" :text="note.text" :i="$store.state.i"/> </div> <div class="media" v-if="note.mediaIds.length > 0"> <mk-media-list :media-list="note.media"/> diff --git a/src/client/app/desktop/views/components/note-detail.vue b/src/client/app/desktop/views/components/note-detail.vue index 5b48b7a1ba..e64990b4ce 100644 --- a/src/client/app/desktop/views/components/note-detail.vue +++ b/src/client/app/desktop/views/components/note-detail.vue @@ -39,7 +39,7 @@ <div class="body"> <div class="text"> <span v-if="p.isHidden" style="opacity: 0.5">%i18n:@private%</span> - <mk-note-html v-if="p.text" :text="p.text" :i="os.i"/> + <mk-note-html v-if="p.text" :text="p.text" :i="$store.state.i"/> </div> <div class="media" v-if="p.media.length > 0"> <mk-media-list :media-list="p.media" :raw="true"/> @@ -158,7 +158,7 @@ export default Vue.extend({ // Draw map if (this.p.geo) { - const shouldShowMap = (this as any).os.isSignedIn ? (this as any).clientSettings.showMaps : true; + const shouldShowMap = this.$store.getters.isSignedIn ? this.$store.state.settings.showMaps : true; if (shouldShowMap) { (this as any).os.getGoogleMaps().then(maps => { const uluru = new maps.LatLng(this.p.geo.coordinates[1], this.p.geo.coordinates[0]); diff --git a/src/client/app/desktop/views/components/notes.note.vue b/src/client/app/desktop/views/components/notes.note.vue index 4448820eb9..e69e6cdb51 100644 --- a/src/client/app/desktop/views/components/notes.note.vue +++ b/src/client/app/desktop/views/components/notes.note.vue @@ -1,6 +1,6 @@ <template> <div class="note" tabindex="-1" :title="title" @keydown="onKeydown"> - <div class="reply-to" v-if="p.reply && (!os.isSignedIn || clientSettings.showReplyTarget)"> + <div class="reply-to" v-if="p.reply && (!$store.getters.isSignedIn || $store.state.settings.showReplyTarget)"> <x-sub :note="p.reply"/> </div> <div class="renote" v-if="isRenote"> @@ -43,7 +43,7 @@ <div class="text"> <span v-if="p.isHidden" style="opacity: 0.5">(この投稿は非公開です)</span> <a class="reply" v-if="p.reply">%fa:reply%</a> - <mk-note-html v-if="p.text && !canHideText(p)" :text="p.text" :i="os.i" :class="$style.text"/> + <mk-note-html v-if="p.text && !canHideText(p)" :text="p.text" :i="$store.state.i" :class="$style.text"/> <a class="rp" v-if="p.renote">RP:</a> </div> <div class="media" v-if="p.media.length > 0"> @@ -166,7 +166,7 @@ export default Vue.extend({ }, created() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); } @@ -175,13 +175,13 @@ export default Vue.extend({ mounted() { this.capture(true); - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.on('_connected_', this.onStreamConnected); } // Draw map if (this.p.geo) { - const shouldShowMap = (this as any).os.isSignedIn ? (this as any).clientSettings.showMaps : true; + const shouldShowMap = this.$store.getters.isSignedIn ? this.$store.state.settings.showMaps : true; if (shouldShowMap) { (this as any).os.getGoogleMaps().then(maps => { const uluru = new maps.LatLng(this.p.geo.coordinates[1], this.p.geo.coordinates[0]); @@ -201,7 +201,7 @@ export default Vue.extend({ beforeDestroy() { this.decapture(true); - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.off('_connected_', this.onStreamConnected); (this as any).os.stream.dispose(this.connectionId); } @@ -211,7 +211,7 @@ export default Vue.extend({ canHideText, capture(withHandler = false) { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.send({ type: 'capture', id: this.p.id @@ -221,7 +221,7 @@ export default Vue.extend({ }, decapture(withHandler = false) { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.send({ type: 'decapture', id: this.p.id diff --git a/src/client/app/desktop/views/components/notes.vue b/src/client/app/desktop/views/components/notes.vue index 55b0de3fbd..5a147f31e2 100644 --- a/src/client/app/desktop/views/components/notes.vue +++ b/src/client/app/desktop/views/components/notes.vue @@ -118,24 +118,24 @@ export default Vue.extend({ prepend(note, silent = false) { //#region 弾く - const isMyNote = note.userId == (this as any).os.i.id; + const isMyNote = note.userId == this.$store.state.i.id; const isPureRenote = note.renoteId != null && note.text == null && note.mediaIds.length == 0 && note.poll == null; - if ((this as any).clientSettings.showMyRenotes === false) { + if (this.$store.state.settings.showMyRenotes === false) { if (isMyNote && isPureRenote) { return; } } - if ((this as any).clientSettings.showRenotedMyNotes === false) { - if (isPureRenote && (note.renote.userId == (this as any).os.i.id)) { + if (this.$store.state.settings.showRenotedMyNotes === false) { + if (isPureRenote && (note.renote.userId == this.$store.state.i.id)) { return; } } //#endregion // 投稿が自分のものではないかつ、タブが非表示またはスクロール位置が最上部ではないならタイトルで通知 - if ((document.hidden || !this.isScrollTop()) && note.userId !== (this as any).os.i.id) { + if ((document.hidden || !this.isScrollTop()) && note.userId !== this.$store.state.i.id) { this.unreadCount++; document.title = `(${this.unreadCount}) ${getNoteSummary(note)}`; } @@ -199,7 +199,7 @@ export default Vue.extend({ this.clearNotification(); } - if ((this as any).clientSettings.fetchOnScroll !== false) { + if (this.$store.state.settings.fetchOnScroll !== false) { const current = window.scrollY + window.innerHeight; if (current > document.body.offsetHeight - 8) this.loadMore(); } diff --git a/src/client/app/desktop/views/components/post-form.vue b/src/client/app/desktop/views/components/post-form.vue index 39bec6cf0c..8eec677b06 100644 --- a/src/client/app/desktop/views/components/post-form.vue +++ b/src/client/app/desktop/views/components/post-form.vue @@ -118,7 +118,7 @@ export default Vue.extend({ const mention = x.host ? `@${x.username}@${x.host}` : `@${x.username}`; // 自分は除外 - if (this.os.i.username == x.username && x.host == null) return; + if (this.$store.state.i.username == x.username && x.host == null) return; // 重複は除外 if (this.text.indexOf(`${mention} `) != -1) return; diff --git a/src/client/app/desktop/views/components/settings.2fa.vue b/src/client/app/desktop/views/components/settings.2fa.vue index 0809dd798c..3e8c860eba 100644 --- a/src/client/app/desktop/views/components/settings.2fa.vue +++ b/src/client/app/desktop/views/components/settings.2fa.vue @@ -2,8 +2,8 @@ <div class="2fa"> <p>%i18n:@intro%<a href="%i18n:@url%" target="_blank">%i18n:@detail%</a></p> <div class="ui info warn"><p>%fa:exclamation-triangle%%i18n:@caution%</p></div> - <p v-if="!data && !os.i.twoFactorEnabled"><button @click="register" class="ui primary">%i18n:@register%</button></p> - <template v-if="os.i.twoFactorEnabled"> + <p v-if="!data && !$store.state.i.twoFactorEnabled"><button @click="register" class="ui primary">%i18n:@register%</button></p> + <template v-if="$store.state.i.twoFactorEnabled"> <p>%i18n:@already-registered%</p> <button @click="unregister" class="ui">%i18n:@unregister%</button> </template> @@ -54,7 +54,7 @@ export default Vue.extend({ password: password }).then(() => { (this as any).apis.notify('%i18n:@unregistered%'); - (this as any).os.i.twoFactorEnabled = false; + this.$store.state.i.twoFactorEnabled = false; }); }); }, @@ -64,7 +64,7 @@ export default Vue.extend({ token: this.token }).then(() => { (this as any).apis.notify('%i18n:@success%'); - (this as any).os.i.twoFactorEnabled = true; + this.$store.state.i.twoFactorEnabled = true; }).catch(() => { (this as any).apis.notify('%i18n:@failed%'); }); diff --git a/src/client/app/desktop/views/components/settings.api.vue b/src/client/app/desktop/views/components/settings.api.vue index b8eef3de63..113764c3e1 100644 --- a/src/client/app/desktop/views/components/settings.api.vue +++ b/src/client/app/desktop/views/components/settings.api.vue @@ -1,6 +1,6 @@ <template> <div class="root api"> - <p>%i18n:@token% <code>{{ os.i.token }}</code></p> + <p>%i18n:@token% <code>{{ $store.state.i.token }}</code></p> <p>%i18n:@intro%</p> <div class="ui info warn"><p>%fa:exclamation-triangle%%i18n:@caution%</p></div> <p>%i18n:@regeneration-of-token%</p> diff --git a/src/client/app/desktop/views/components/settings.profile.vue b/src/client/app/desktop/views/components/settings.profile.vue index 132ab12f1c..9932cbf7db 100644 --- a/src/client/app/desktop/views/components/settings.profile.vue +++ b/src/client/app/desktop/views/components/settings.profile.vue @@ -2,7 +2,7 @@ <div class="profile"> <label class="avatar ui from group"> <p>%i18n:@avatar%</p> - <img class="avatar" :src="`${os.i.avatarUrl}?thumbnail&size=64`" alt="avatar"/> + <img class="avatar" :src="`${$store.state.i.avatarUrl}?thumbnail&size=64`" alt="avatar"/> <button class="ui" @click="updateAvatar">%i18n:@choice-avatar%</button> </label> <label class="ui from group"> @@ -24,8 +24,8 @@ <button class="ui primary" @click="save">%i18n:@save%</button> <section> <h2>その他</h2> - <mk-switch v-model="os.i.isBot" @change="onChangeIsBot" text="%i18n:@is-bot%"/> - <mk-switch v-model="os.i.isCat" @change="onChangeIsCat" text="%i18n:@is-cat%"/> + <mk-switch v-model="$store.state.i.isBot" @change="onChangeIsBot" text="%i18n:@is-bot%"/> + <mk-switch v-model="$store.state.i.isCat" @change="onChangeIsCat" text="%i18n:@is-cat%"/> </section> </div> </template> @@ -43,10 +43,10 @@ export default Vue.extend({ }; }, created() { - this.name = (this as any).os.i.name || ''; - this.location = (this as any).os.i.profile.location; - this.description = (this as any).os.i.description; - this.birthday = (this as any).os.i.profile.birthday; + this.name = this.$store.state.i.name || ''; + this.location = this.$store.state.i.profile.location; + this.description = this.$store.state.i.description; + this.birthday = this.$store.state.i.profile.birthday; }, methods: { updateAvatar() { @@ -64,12 +64,12 @@ export default Vue.extend({ }, onChangeIsBot() { (this as any).api('i/update', { - isBot: (this as any).os.i.isBot + isBot: this.$store.state.i.isBot }); }, onChangeIsCat() { (this as any).api('i/update', { - isCat: (this as any).os.i.isCat + isCat: this.$store.state.i.isCat }); } } diff --git a/src/client/app/desktop/views/components/settings.vue b/src/client/app/desktop/views/components/settings.vue index dac5fe67cb..1bfff8cc83 100644 --- a/src/client/app/desktop/views/components/settings.vue +++ b/src/client/app/desktop/views/components/settings.vue @@ -20,7 +20,7 @@ <section class="web" v-show="page == 'web'"> <h1>%i18n:@behaviour%</h1> - <mk-switch v-model="clientSettings.fetchOnScroll" @change="onChangeFetchOnScroll" text="%i18n:@fetch-on-scroll%"> + <mk-switch v-model="$store.state.settings.fetchOnScroll" @change="onChangeFetchOnScroll" text="%i18n:@fetch-on-scroll%"> <span>%i18n:@fetch-on-scroll-desc%</span> </mk-switch> <mk-switch v-model="autoPopout" text="%i18n:@auto-popout%"> @@ -41,14 +41,14 @@ </div> <div class="div"> <mk-switch v-model="darkmode" text="%i18n:@dark-mode%"/> - <mk-switch v-model="clientSettings.circleIcons" @change="onChangeCircleIcons" text="%i18n:@circle-icons%"/> - <mk-switch v-model="clientSettings.gradientWindowHeader" @change="onChangeGradientWindowHeader" text="%i18n:@gradient-window-header%"/> + <mk-switch v-model="$store.state.settings.circleIcons" @change="onChangeCircleIcons" text="%i18n:@circle-icons%"/> + <mk-switch v-model="$store.state.settings.gradientWindowHeader" @change="onChangeGradientWindowHeader" text="%i18n:@gradient-window-header%"/> </div> - <mk-switch v-model="clientSettings.showPostFormOnTopOfTl" @change="onChangeShowPostFormOnTopOfTl" text="%i18n:@post-form-on-timeline%"/> - <mk-switch v-model="clientSettings.showReplyTarget" @change="onChangeShowReplyTarget" text="%i18n:@show-reply-target%"/> - <mk-switch v-model="clientSettings.showMyRenotes" @change="onChangeShowMyRenotes" text="%i18n:@show-my-renotes%"/> - <mk-switch v-model="clientSettings.showRenotedMyNotes" @change="onChangeShowRenotedMyNotes" text="%i18n:@show-renoted-my-notes%"/> - <mk-switch v-model="clientSettings.showMaps" @change="onChangeShowMaps" text="%i18n:@show-maps%"> + <mk-switch v-model="$store.state.settings.showPostFormOnTopOfTl" @change="onChangeShowPostFormOnTopOfTl" text="%i18n:@post-form-on-timeline%"/> + <mk-switch v-model="$store.state.settings.showReplyTarget" @change="onChangeShowReplyTarget" text="%i18n:@show-reply-target%"/> + <mk-switch v-model="$store.state.settings.showMyRenotes" @change="onChangeShowMyRenotes" text="%i18n:@show-my-renotes%"/> + <mk-switch v-model="$store.state.settings.showRenotedMyNotes" @change="onChangeShowRenotedMyNotes" text="%i18n:@show-renoted-my-notes%"/> + <mk-switch v-model="$store.state.settings.showMaps" @change="onChangeShowMaps" text="%i18n:@show-maps%"> <span>%i18n:@show-maps-desc%</span> </mk-switch> </section> @@ -72,7 +72,7 @@ <section class="web" v-show="page == 'web'"> <h1>%i18n:@mobile%</h1> - <mk-switch v-model="clientSettings.disableViaMobile" @change="onChangeDisableViaMobile" text="%i18n:@disable-via-mobile%"/> + <mk-switch v-model="$store.state.settings.disableViaMobile" @change="onChangeDisableViaMobile" text="%i18n:@disable-via-mobile%"/> </section> <section class="web" v-show="page == 'web'"> @@ -100,7 +100,7 @@ <section class="notification" v-show="page == 'notification'"> <h1>%i18n:@notification%</h1> - <mk-switch v-model="os.i.settings.autoWatch" @change="onChangeAutoWatch" text="%i18n:@auto-watch%"> + <mk-switch v-model="$store.state.i.settings.autoWatch" @change="onChangeAutoWatch" text="%i18n:@auto-watch%"> <span>%i18n:@auto-watch-desc%</span> </mk-switch> </section> diff --git a/src/client/app/desktop/views/components/sub-note-content.vue b/src/client/app/desktop/views/components/sub-note-content.vue index 03b634b0ff..8aa32cec73 100644 --- a/src/client/app/desktop/views/components/sub-note-content.vue +++ b/src/client/app/desktop/views/components/sub-note-content.vue @@ -3,7 +3,7 @@ <div class="body"> <span v-if="note.isHidden" style="opacity: 0.5">%i18n:@hidden%</span> <a class="reply" v-if="note.replyId">%fa:reply%</a> - <mk-note-html :text="note.text" :i="os.i"/> + <mk-note-html :text="note.text" :i="$store.state.i"/> <a class="rp" v-if="note.renoteId" :href="`/note:${note.renoteId}`">RP: ...</a> </div> <details v-if="note.media.length > 0"> diff --git a/src/client/app/desktop/views/components/timeline.core.vue b/src/client/app/desktop/views/components/timeline.core.vue index 3fcec86e48..44d5967db5 100644 --- a/src/client/app/desktop/views/components/timeline.core.vue +++ b/src/client/app/desktop/views/components/timeline.core.vue @@ -40,7 +40,7 @@ export default Vue.extend({ computed: { alone(): boolean { - return (this as any).os.i.followingCount == 0; + return this.$store.state.i.followingCount == 0; }, stream(): any { @@ -98,8 +98,8 @@ export default Vue.extend({ (this as any).api(this.endpoint, { limit: fetchLimit + 1, untilDate: this.date ? this.date.getTime() : undefined, - includeMyRenotes: (this as any).clientSettings.showMyRenotes, - includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes + includeMyRenotes: this.$store.state.settings.showMyRenotes, + includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes }).then(notes => { if (notes.length == fetchLimit + 1) { notes.pop(); @@ -120,8 +120,8 @@ export default Vue.extend({ const promise = (this as any).api(this.endpoint, { limit: fetchLimit + 1, untilId: (this.$refs.timeline as any).tail().id, - includeMyRenotes: (this as any).clientSettings.showMyRenotes, - includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes + includeMyRenotes: this.$store.state.settings.showMyRenotes, + includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes }); promise.then(notes => { diff --git a/src/client/app/desktop/views/components/timeline.vue b/src/client/app/desktop/views/components/timeline.vue index 27d329d13f..0728b78aa9 100644 --- a/src/client/app/desktop/views/components/timeline.vue +++ b/src/client/app/desktop/views/components/timeline.vue @@ -47,7 +47,7 @@ export default Vue.extend({ if (this.src == 'list') { this.list = this.$store.state.device.tl.arg; } - } else if ((this as any).os.i.followingCount == 0) { + } else if (this.$store.state.i.followingCount == 0) { this.src = 'local'; } }, diff --git a/src/client/app/desktop/views/components/ui.header.account.vue b/src/client/app/desktop/views/components/ui.header.account.vue index f3f6539496..8d26691f84 100644 --- a/src/client/app/desktop/views/components/ui.header.account.vue +++ b/src/client/app/desktop/views/components/ui.header.account.vue @@ -1,14 +1,14 @@ <template> <div class="account"> <button class="header" :data-active="isOpen" @click="toggle"> - <span class="username">{{ os.i.username }}<template v-if="!isOpen">%fa:angle-down%</template><template v-if="isOpen">%fa:angle-up%</template></span> - <mk-avatar class="avatar" :user="os.i"/> + <span class="username">{{ $store.state.i.username }}<template v-if="!isOpen">%fa:angle-down%</template><template v-if="isOpen">%fa:angle-up%</template></span> + <mk-avatar class="avatar" :user="$store.state.i"/> </button> <transition name="zoom-in-top"> <div class="menu" v-if="isOpen"> <ul> <li> - <router-link :to="`/@${ os.i.username }`">%fa:user%<span>%i18n:@profile%</span>%fa:angle-right%</router-link> + <router-link :to="`/@${ $store.state.i.username }`">%fa:user%<span>%i18n:@profile%</span>%fa:angle-right%</router-link> </li> <li @click="drive"> <p>%fa:cloud%<span>%i18n:@drive%</span>%fa:angle-right%</p> 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 0800d96eb6..201b04b039 100644 --- a/src/client/app/desktop/views/components/ui.header.nav.vue +++ b/src/client/app/desktop/views/components/ui.header.nav.vue @@ -1,7 +1,7 @@ <template> <div class="nav"> <ul> - <template v-if="os.isSignedIn"> + <template v-if="$store.getters.isSignedIn"> <li class="home" :class="{ active: $route.name == 'index' }"> <router-link to="/"> %fa:home% @@ -42,7 +42,7 @@ export default Vue.extend({ }; }, mounted() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); @@ -60,7 +60,7 @@ export default Vue.extend({ } }, beforeDestroy() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.off('read_all_messaging_messages', this.onReadAllMessagingMessages); this.connection.off('unread_messaging_message', this.onUnreadMessagingMessage); this.connection.off('othello_invited', this.onOthelloInvited); diff --git a/src/client/app/desktop/views/components/ui.header.notifications.vue b/src/client/app/desktop/views/components/ui.header.notifications.vue index ea814dd7a3..9eaaa62c61 100644 --- a/src/client/app/desktop/views/components/ui.header.notifications.vue +++ b/src/client/app/desktop/views/components/ui.header.notifications.vue @@ -23,7 +23,7 @@ export default Vue.extend({ }; }, mounted() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); @@ -39,7 +39,7 @@ export default Vue.extend({ } }, beforeDestroy() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.off('read_all_notifications', this.onReadAllNotifications); this.connection.off('unread_notification', this.onUnreadNotification); (this as any).os.stream.dispose(this.connectionId); diff --git a/src/client/app/desktop/views/components/ui.header.vue b/src/client/app/desktop/views/components/ui.header.vue index 7729575b56..34464bf4b2 100644 --- a/src/client/app/desktop/views/components/ui.header.vue +++ b/src/client/app/desktop/views/components/ui.header.vue @@ -4,16 +4,16 @@ <div class="main" ref="main"> <div class="backdrop"></div> <div class="main"> - <p ref="welcomeback" v-if="os.isSignedIn">おかえりなさい、<b>{{ os.i | userName }}</b>さん</p> + <p ref="welcomeback" v-if="$store.getters.isSignedIn">おかえりなさい、<b>{{ $store.state.i | userName }}</b>さん</p> <div class="container" ref="mainContainer"> <div class="left"> <x-nav/> </div> <div class="right"> <x-search/> - <x-account v-if="os.isSignedIn"/> - <x-notifications v-if="os.isSignedIn"/> - <x-post v-if="os.isSignedIn"/> + <x-account v-if="$store.getters.isSignedIn"/> + <x-notifications v-if="$store.getters.isSignedIn"/> + <x-post v-if="$store.getters.isSignedIn"/> <x-clock/> </div> </div> @@ -45,11 +45,11 @@ export default Vue.extend({ mounted() { this.$store.commit('setUiHeaderHeight', 48); - if ((this as any).os.isSignedIn) { - const ago = (new Date().getTime() - new Date((this as any).os.i.lastUsedAt).getTime()) / 1000; + if (this.$store.getters.isSignedIn) { + const ago = (new Date().getTime() - new Date(this.$store.state.i.lastUsedAt).getTime()) / 1000; const isHisasiburi = ago >= 3600; - (this as any).os.i.lastUsedAt = new Date(); - (this as any).os.bakeMe(); + this.$store.state.i.lastUsedAt = new Date(); + if (isHisasiburi) { (this.$refs.welcomeback as any).style.display = 'block'; (this.$refs.main as any).style.overflow = 'hidden'; diff --git a/src/client/app/desktop/views/components/ui.vue b/src/client/app/desktop/views/components/ui.vue index 87f932ff14..b6dd22c1f8 100644 --- a/src/client/app/desktop/views/components/ui.vue +++ b/src/client/app/desktop/views/components/ui.vue @@ -4,7 +4,7 @@ <div class="content"> <slot></slot> </div> - <mk-stream-indicator v-if="os.isSignedIn"/> + <mk-stream-indicator v-if="$store.getters.isSignedIn"/> </div> </template> diff --git a/src/client/app/desktop/views/components/user-list-timeline.vue b/src/client/app/desktop/views/components/user-list-timeline.vue index 4f14da70fe..03ac81a4a1 100644 --- a/src/client/app/desktop/views/components/user-list-timeline.vue +++ b/src/client/app/desktop/views/components/user-list-timeline.vue @@ -32,7 +32,7 @@ export default Vue.extend({ methods: { init() { if (this.connection) this.connection.close(); - this.connection = new UserListStream((this as any).os, (this as any).os.i, this.list.id); + this.connection = new UserListStream((this as any).os, this.$store.state.i, this.list.id); this.connection.on('note', this.onNote); this.connection.on('userAdded', this.onUserAdded); this.connection.on('userRemoved', this.onUserRemoved); @@ -46,8 +46,8 @@ export default Vue.extend({ (this as any).api('notes/user-list-timeline', { listId: this.list.id, limit: fetchLimit + 1, - includeMyRenotes: (this as any).clientSettings.showMyRenotes, - includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes + includeMyRenotes: this.$store.state.settings.showMyRenotes, + includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes }).then(notes => { if (notes.length == fetchLimit + 1) { notes.pop(); @@ -66,8 +66,8 @@ export default Vue.extend({ listId: this.list.id, limit: fetchLimit + 1, untilId: (this.$refs.timeline as any).tail().id, - includeMyRenotes: (this as any).clientSettings.showMyRenotes, - includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes + includeMyRenotes: this.$store.state.settings.showMyRenotes, + includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes }); promise.then(notes => { diff --git a/src/client/app/desktop/views/components/user-preview.vue b/src/client/app/desktop/views/components/user-preview.vue index b8854a8032..788881ead5 100644 --- a/src/client/app/desktop/views/components/user-preview.vue +++ b/src/client/app/desktop/views/components/user-preview.vue @@ -19,7 +19,7 @@ <p>%i18n:@followers%</p><a>{{ u.followersCount }}</a> </div> </div> - <mk-follow-button v-if="os.isSignedIn && user.id != os.i.id" :user="u"/> + <mk-follow-button v-if="$store.getters.isSignedIn && user.id != $store.state.i.id" :user="u"/> </template> </div> </template> diff --git a/src/client/app/desktop/views/components/users-list.vue b/src/client/app/desktop/views/components/users-list.vue index 1ed5c33b13..0423db8ed7 100644 --- a/src/client/app/desktop/views/components/users-list.vue +++ b/src/client/app/desktop/views/components/users-list.vue @@ -3,7 +3,7 @@ <nav> <div> <span :data-active="mode == 'all'" @click="mode = 'all'">%i18n:@all%<span>{{ count }}</span></span> - <span v-if="os.isSignedIn && youKnowCount" :data-active="mode == 'iknow'" @click="mode = 'iknow'">%i18n:@iknow%<span>{{ youKnowCount }}</span></span> + <span v-if="$store.getters.isSignedIn && youKnowCount" :data-active="mode == 'iknow'" @click="mode = 'iknow'">%i18n:@iknow%<span>{{ youKnowCount }}</span></span> </div> </nav> <div class="users" v-if="!fetching && users.length != 0"> diff --git a/src/client/app/desktop/views/components/widget-container.vue b/src/client/app/desktop/views/components/widget-container.vue index ab8327d39e..488e9cb249 100644 --- a/src/client/app/desktop/views/components/widget-container.vue +++ b/src/client/app/desktop/views/components/widget-container.vue @@ -23,9 +23,9 @@ export default Vue.extend({ }, computed: { withGradient(): boolean { - return (this as any).os.isSignedIn - ? (this as any).clientSettings.gradientWindowHeader != null - ? (this as any).clientSettings.gradientWindowHeader + return this.$store.getters.isSignedIn + ? this.$store.state.settings.gradientWindowHeader != null + ? this.$store.state.settings.gradientWindowHeader : false : false; } diff --git a/src/client/app/desktop/views/components/window.vue b/src/client/app/desktop/views/components/window.vue index ac06ac8e57..e4753f55db 100644 --- a/src/client/app/desktop/views/components/window.vue +++ b/src/client/app/desktop/views/components/window.vue @@ -4,7 +4,7 @@ <div class="main" ref="main" tabindex="-1" :data-is-modal="isModal" @mousedown="onBodyMousedown" @keydown="onKeydown" :style="{ width, height }"> <div class="body"> <header ref="header" - :class="{ withGradient: clientSettings.gradientWindowHeader }" + :class="{ withGradient: $store.state.settings.gradientWindowHeader }" @contextmenu.prevent="() => {}" @mousedown.prevent="onHeaderMousedown" > <h1><slot name="header"></slot></h1> @@ -95,7 +95,7 @@ export default Vue.extend({ }, created() { - if ((this as any).os.store.state.device.autoPopout && this.popoutUrl) { + if (this.$store.state.device.autoPopout && this.popoutUrl) { this.popout(); this.preventMount = true; } else { diff --git a/src/client/app/desktop/views/pages/index.vue b/src/client/app/desktop/views/pages/index.vue index 0ea47d913b..5d11fc5423 100644 --- a/src/client/app/desktop/views/pages/index.vue +++ b/src/client/app/desktop/views/pages/index.vue @@ -1,5 +1,5 @@ <template> -<component :is="os.isSignedIn ? 'home' : 'welcome'"></component> +<component :is="$store.getters.isSignedIn ? 'home' : 'welcome'"></component> </template> <script lang="ts"> diff --git a/src/client/app/desktop/views/pages/user/user.header.vue b/src/client/app/desktop/views/pages/user/user.header.vue index 73af3a4a4c..44910bc7f0 100644 --- a/src/client/app/desktop/views/pages/user/user.header.vue +++ b/src/client/app/desktop/views/pages/user/user.header.vue @@ -63,7 +63,7 @@ export default Vue.extend({ }, onBannerClick() { - if (!(this as any).os.isSignedIn || (this as any).os.i.id != this.user.id) return; + if (!this.$store.getters.isSignedIn || this.$store.state.i.id != this.user.id) return; (this as any).apis.updateBanner().then(i => { this.user.bannerUrl = i.bannerUrl; diff --git a/src/client/app/desktop/views/pages/user/user.home.vue b/src/client/app/desktop/views/pages/user/user.home.vue index 6b242a6129..afaf97dc9e 100644 --- a/src/client/app/desktop/views/pages/user/user.home.vue +++ b/src/client/app/desktop/views/pages/user/user.home.vue @@ -4,7 +4,7 @@ <div ref="left"> <x-profile :user="user"/> <x-photos :user="user"/> - <x-followers-you-know v-if="os.isSignedIn && os.i.id != user.id" :user="user"/> + <x-followers-you-know v-if="$store.getters.isSignedIn && $store.state.i.id != user.id" :user="user"/> <p v-if="user.host === null">%i18n:@last-used-at%: <b><mk-time :time="user.lastUsedAt"/></b></p> </div> </div> diff --git a/src/client/app/desktop/views/pages/user/user.profile.vue b/src/client/app/desktop/views/pages/user/user.profile.vue index 29e49f36a6..5aa08f7c85 100644 --- a/src/client/app/desktop/views/pages/user/user.profile.vue +++ b/src/client/app/desktop/views/pages/user/user.profile.vue @@ -1,6 +1,6 @@ <template> <div class="profile"> - <div class="friend-form" v-if="os.isSignedIn && os.i.id != user.id"> + <div class="friend-form" v-if="$store.getters.isSignedIn && $store.state.i.id != user.id"> <mk-follow-button :user="user" size="big"/> <p class="followed" v-if="user.isFollowed">%i18n:@follows-you%</p> <p class="stalk" v-if="user.isFollowing"> diff --git a/src/client/app/desktop/views/widgets/activity.vue b/src/client/app/desktop/views/widgets/activity.vue index 1be87f590c..73c6d0ef64 100644 --- a/src/client/app/desktop/views/widgets/activity.vue +++ b/src/client/app/desktop/views/widgets/activity.vue @@ -2,7 +2,7 @@ <mk-activity :design="props.design" :init-view="props.view" - :user="os.i" + :user="$store.state.i" @view-changed="viewChanged"/> </template> diff --git a/src/client/app/desktop/views/widgets/profile.vue b/src/client/app/desktop/views/widgets/profile.vue index 5af5b88e23..7b0fea3729 100644 --- a/src/client/app/desktop/views/widgets/profile.vue +++ b/src/client/app/desktop/views/widgets/profile.vue @@ -4,16 +4,16 @@ :data-melt="props.design == 2" > <div class="banner" - :style="os.i.bannerUrl ? `background-image: url(${os.i.bannerUrl}?thumbnail&size=256)` : ''" + :style="$store.state.i.bannerUrl ? `background-image: url(${$store.state.i.bannerUrl}?thumbnail&size=256)` : ''" title="%i18n:@update-banner%" @click="os.apis.updateBanner" ></div> - <mk-avatar class="avatar" :user="os.i" + <mk-avatar class="avatar" :user="$store.state.i" @click="os.apis.updateAvatar" title="%i18n:@update-avatar%" /> - <router-link class="name" :to="os.i | userPage">{{ os.i | userName }}</router-link> - <p class="username">@{{ os.i | acct }}</p> + <router-link class="name" :to="$store.state.i | userPage">{{ $store.state.i | userName }}</router-link> + <p class="username">@{{ $store.state.i | acct }}</p> </div> </template> diff --git a/src/client/app/init.ts b/src/client/app/init.ts index 560ab1a096..58013ec5a8 100644 --- a/src/client/app/init.ts +++ b/src/client/app/init.ts @@ -143,8 +143,7 @@ export default (callback: (launch: (router: VueRouter, api?: (os: MiOS) => API) return { os, api: os.api, - apis: os.apis, - clientSettings: os.store.state.settings + apis: os.apis }; } }); diff --git a/src/client/app/mios.ts b/src/client/app/mios.ts index a5a38a5414..a8da5ddb55 100644 --- a/src/client/app/mios.ts +++ b/src/client/app/mios.ts @@ -1,10 +1,9 @@ import Vue from 'vue'; import { EventEmitter } from 'eventemitter3'; -import * as merge from 'object-assign-deep'; import * as uuid from 'uuid'; import initStore from './store'; -import { hostname, apiUrl, swPublickey, version, lang, googleMapsApiKey } from './config'; +import { apiUrl, swPublickey, version, lang, googleMapsApiKey } from './config'; import Progress from './common/scripts/loading'; import Connection from './common/scripts/streaming/stream'; import { HomeStreamManager } from './common/scripts/streaming/home'; @@ -83,18 +82,6 @@ export default class MiOS extends EventEmitter { } /** - * A signing user - */ - public i: { [x: string]: any }; - - /** - * Whether signed in - */ - public get isSignedIn() { - return this.i != null; - } - - /** * Whether is debug mode */ public get debug() { @@ -218,15 +205,8 @@ export default class MiOS extends EventEmitter { console.error.apply(null, args); } - public bakeMe() { - // ローカルストレージにキャッシュ - localStorage.setItem('me', JSON.stringify(this.i)); - } - public signout() { - localStorage.removeItem('me'); - localStorage.removeItem('settings'); - document.cookie = `i=; domain=${hostname}; expires=Thu, 01 Jan 1970 00:00:01 GMT;`; + this.store.dispatch('logout'); location.href = '/'; } @@ -242,14 +222,14 @@ export default class MiOS extends EventEmitter { this.once('signedin', () => { // Init home stream manager - this.stream = new HomeStreamManager(this, this.i); + this.stream = new HomeStreamManager(this, this.store.state.i); // Init other stream manager - this.streams.localTimelineStream = new LocalTimelineStreamManager(this, this.i); - this.streams.globalTimelineStream = new GlobalTimelineStreamManager(this, this.i); - this.streams.driveStream = new DriveStreamManager(this, this.i); - this.streams.messagingIndexStream = new MessagingIndexStreamManager(this, this.i); - this.streams.othelloStream = new OthelloStreamManager(this, this.i); + this.streams.localTimelineStream = new LocalTimelineStreamManager(this, this.store.state.i); + this.streams.globalTimelineStream = new GlobalTimelineStreamManager(this, this.store.state.i); + this.streams.driveStream = new DriveStreamManager(this, this.store.state.i); + this.streams.messagingIndexStream = new MessagingIndexStreamManager(this, this.store.state.i); + this.streams.othelloStream = new OthelloStreamManager(this, this.store.state.i); }); //#endregion @@ -300,51 +280,29 @@ export default class MiOS extends EventEmitter { }; // フェッチが完了したとき - const fetched = me => { - this.i = me; - - // ローカルストレージにキャッシュ - this.bakeMe(); - + const fetched = () => { this.emit('signedin'); // Finish init callback(); - //#region Note - // Init service worker if (this.shouldRegisterSw) this.registerSw(); - - //#endregion }; - // Get cached account data - const cachedMe = JSON.parse(localStorage.getItem('me')); - - //#region キャッシュされた設定を復元 - const cachedSettings = JSON.parse(localStorage.getItem('settings')); - - if (cachedSettings) { - this.store.dispatch('settings/merge', cachedSettings); - } - //#endregion - // キャッシュがあったとき - if (cachedMe) { - if (cachedMe.token == null) { + if (this.store.state.i != null) { + if (this.store.state.i.token == null) { this.signout(); return; } // とりあえずキャッシュされたデータでお茶を濁して(?)おいて、 - fetched(cachedMe); + fetched(); // 後から新鮮なデータをフェッチ - fetchme(cachedMe.token, freshData => { - merge(cachedMe, freshData); - - this.store.dispatch('settings/merge', freshData.clientSettings); + fetchme(this.store.state.i.token, freshData => { + this.store.dispatch('mergeMe', freshData); }); } else { // Get token from cookie @@ -352,9 +310,8 @@ export default class MiOS extends EventEmitter { fetchme(i, me => { if (me) { - this.store.dispatch('settings/merge', me.clientSettings); - - fetched(me); + this.store.dispatch('login', me); + fetched(); } else { // Finish init callback(); @@ -375,7 +332,7 @@ export default class MiOS extends EventEmitter { if (!isSwSupported) return; // Reject when not signed in to Misskey - if (!this.isSignedIn) return; + if (!this.store.getters.isSignedIn) return; // When service worker activated navigator.serviceWorker.ready.then(registration => { @@ -484,7 +441,7 @@ export default class MiOS extends EventEmitter { }); } else { // Append a credential - if (this.isSignedIn) (data as any).i = this.i.token; + if (this.store.getters.isSignedIn) (data as any).i = this.store.state.i.token; const req = { id: uuid(), diff --git a/src/client/app/mobile/views/components/note-detail.vue b/src/client/app/mobile/views/components/note-detail.vue index 244dbb6c03..eb934431d2 100644 --- a/src/client/app/mobile/views/components/note-detail.vue +++ b/src/client/app/mobile/views/components/note-detail.vue @@ -31,7 +31,7 @@ <div class="body"> <div class="text"> <span v-if="p.isHidden" style="opacity: 0.5">(この投稿は非公開です)</span> - <mk-note-html v-if="p.text" :text="p.text" :i="os.i"/> + <mk-note-html v-if="p.text" :text="p.text" :i="$store.state.i"/> </div> <div class="tags" v-if="p.tags && p.tags.length > 0"> <router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link> @@ -147,7 +147,7 @@ export default Vue.extend({ // Draw map if (this.p.geo) { - const shouldShowMap = (this as any).os.isSignedIn ? (this as any).clientSettings.showMaps : true; + const shouldShowMap = this.$store.getters.isSignedIn ? this.$store.state.settings.showMaps : true; if (shouldShowMap) { (this as any).os.getGoogleMaps().then(maps => { const uluru = new maps.LatLng(this.p.geo.coordinates[1], this.p.geo.coordinates[0]); diff --git a/src/client/app/mobile/views/components/note.vue b/src/client/app/mobile/views/components/note.vue index 2004263d22..42d3ffe40e 100644 --- a/src/client/app/mobile/views/components/note.vue +++ b/src/client/app/mobile/views/components/note.vue @@ -1,6 +1,6 @@ <template> <div class="note" :class="{ renote: isRenote, smart: $store.state.device.postStyle == 'smart' }"> - <div class="reply-to" v-if="p.reply && (!os.isSignedIn || clientSettings.showReplyTarget)"> + <div class="reply-to" v-if="p.reply && (!$store.getters.isSignedIn || $store.state.settings.showReplyTarget)"> <x-sub :note="p.reply"/> </div> <div class="renote" v-if="isRenote"> @@ -43,7 +43,7 @@ <div class="text"> <span v-if="p.isHidden" style="opacity: 0.5">(この投稿は非公開です)</span> <a class="reply" v-if="p.reply">%fa:reply%</a> - <mk-note-html v-if="p.text && !canHideText(p)" :text="p.text" :i="os.i" :class="$style.text"/> + <mk-note-html v-if="p.text && !canHideText(p)" :text="p.text" :i="$store.state.i" :class="$style.text"/> <a class="rp" v-if="p.renote != null">RP:</a> </div> <div class="media" v-if="p.media.length > 0"> @@ -141,7 +141,7 @@ export default Vue.extend({ }, created() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); } @@ -150,13 +150,13 @@ export default Vue.extend({ mounted() { this.capture(true); - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.on('_connected_', this.onStreamConnected); } // Draw map if (this.p.geo) { - const shouldShowMap = (this as any).os.isSignedIn ? (this as any).clientSettings.showMaps : true; + const shouldShowMap = this.$store.getters.isSignedIn ? this.$store.state.settings.showMaps : true; if (shouldShowMap) { (this as any).os.getGoogleMaps().then(maps => { const uluru = new maps.LatLng(this.p.geo.coordinates[1], this.p.geo.coordinates[0]); @@ -176,7 +176,7 @@ export default Vue.extend({ beforeDestroy() { this.decapture(true); - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.off('_connected_', this.onStreamConnected); (this as any).os.stream.dispose(this.connectionId); } @@ -186,7 +186,7 @@ export default Vue.extend({ canHideText, capture(withHandler = false) { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.send({ type: 'capture', id: this.p.id @@ -196,7 +196,7 @@ export default Vue.extend({ }, decapture(withHandler = false) { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.send({ type: 'decapture', id: this.p.id diff --git a/src/client/app/mobile/views/components/notes.vue b/src/client/app/mobile/views/components/notes.vue index e77698dea9..fbba111664 100644 --- a/src/client/app/mobile/views/components/notes.vue +++ b/src/client/app/mobile/views/components/notes.vue @@ -121,24 +121,24 @@ export default Vue.extend({ prepend(note, silent = false) { //#region 弾く - const isMyNote = note.userId == (this as any).os.i.id; + const isMyNote = note.userId == this.$store.state.i.id; const isPureRenote = note.renoteId != null && note.text == null && note.mediaIds.length == 0 && note.poll == null; - if ((this as any).clientSettings.showMyRenotes === false) { + if (this.$store.state.settings.showMyRenotes === false) { if (isMyNote && isPureRenote) { return; } } - if ((this as any).clientSettings.showRenotedMyNotes === false) { - if (isPureRenote && (note.renote.userId == (this as any).os.i.id)) { + if (this.$store.state.settings.showRenotedMyNotes === false) { + if (isPureRenote && (note.renote.userId == this.$store.state.i.id)) { return; } } //#endregion // 投稿が自分のものではないかつ、タブが非表示またはスクロール位置が最上部ではないならタイトルで通知 - if ((document.hidden || !this.isScrollTop()) && note.userId !== (this as any).os.i.id) { + if ((document.hidden || !this.isScrollTop()) && note.userId !== this.$store.state.i.id) { this.unreadCount++; document.title = `(${this.unreadCount}) ${getNoteSummary(note)}`; } @@ -195,7 +195,7 @@ export default Vue.extend({ this.clearNotification(); } - if ((this as any).clientSettings.fetchOnScroll !== false) { + if (this.$store.state.settings.fetchOnScroll !== false) { // 親要素が display none だったら弾く // https://github.com/syuilo/misskey/issues/1569 // http://d.hatena.ne.jp/favril/20091105/1257403319 diff --git a/src/client/app/mobile/views/components/post-form.vue b/src/client/app/mobile/views/components/post-form.vue index 264eb08448..f999988c60 100644 --- a/src/client/app/mobile/views/components/post-form.vue +++ b/src/client/app/mobile/views/components/post-form.vue @@ -86,7 +86,7 @@ export default Vue.extend({ const mention = x.host ? `@${x.username}@${x.host}` : `@${x.username}`; // 自分は除外 - if (this.os.i.username == x.username && x.host == null) return; + if (this.$store.state.i.username == x.username && x.host == null) return; // 重複は除外 if (this.text.indexOf(`${mention} `) != -1) return; @@ -194,7 +194,7 @@ export default Vue.extend({ post() { this.posting = true; - const viaMobile = (this as any).clientSettings.disableViaMobile !== true; + const viaMobile = this.$store.state.settings.disableViaMobile !== true; (this as any).api('notes/create', { text: this.text == '' ? undefined : this.text, mediaIds: this.files.length > 0 ? this.files.map(f => f.id) : undefined, diff --git a/src/client/app/mobile/views/components/sub-note-content.vue b/src/client/app/mobile/views/components/sub-note-content.vue index cc50977a58..bb96d65147 100644 --- a/src/client/app/mobile/views/components/sub-note-content.vue +++ b/src/client/app/mobile/views/components/sub-note-content.vue @@ -3,7 +3,7 @@ <div class="body"> <span v-if="note.isHidden" style="opacity: 0.5">(この投稿は非公開です)</span> <a class="reply" v-if="note.replyId">%fa:reply%</a> - <mk-note-html v-if="note.text" :text="note.text" :i="os.i"/> + <mk-note-html v-if="note.text" :text="note.text" :i="$store.state.i"/> <a class="rp" v-if="note.renoteId">RP: ...</a> </div> <details v-if="note.media.length > 0"> diff --git a/src/client/app/mobile/views/components/ui.header.vue b/src/client/app/mobile/views/components/ui.header.vue index a49462b159..09aa18f769 100644 --- a/src/client/app/mobile/views/components/ui.header.vue +++ b/src/client/app/mobile/views/components/ui.header.vue @@ -3,7 +3,7 @@ <mk-special-message/> <div class="main" ref="main"> <div class="backdrop"></div> - <p ref="welcomeback" v-if="os.isSignedIn">おかえりなさい、<b>{{ os.i | userName }}</b>さん</p> + <p ref="welcomeback" v-if="$store.getters.isSignedIn">おかえりなさい、<b>{{ $store.state.i | userName }}</b>さん</p> <div class="content" ref="mainContainer"> <button class="nav" @click="$parent.isDrawerOpening = true">%fa:bars%</button> <template v-if="hasUnreadNotifications || hasUnreadMessagingMessages || hasGameInvitations">%fa:circle%</template> @@ -35,7 +35,7 @@ export default Vue.extend({ mounted() { this.$store.commit('setUiHeaderHeight', 48); - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); @@ -60,10 +60,10 @@ export default Vue.extend({ } }); - const ago = (new Date().getTime() - new Date((this as any).os.i.lastUsedAt).getTime()) / 1000; + const ago = (new Date().getTime() - new Date(this.$store.state.i.lastUsedAt).getTime()) / 1000; const isHisasiburi = ago >= 3600; - (this as any).os.i.lastUsedAt = new Date(); - (this as any).os.bakeMe(); + this.$store.state.i.lastUsedAt = new Date(); + if (isHisasiburi) { (this.$refs.welcomeback as any).style.display = 'block'; (this.$refs.main as any).style.overflow = 'hidden'; @@ -109,7 +109,7 @@ export default Vue.extend({ } }, beforeDestroy() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.off('read_all_notifications', this.onReadAllNotifications); this.connection.off('unread_notification', this.onUnreadNotification); this.connection.off('read_all_messaging_messages', this.onReadAllMessagingMessages); diff --git a/src/client/app/mobile/views/components/ui.nav.vue b/src/client/app/mobile/views/components/ui.nav.vue index aa469bd1c8..5f0cc831cc 100644 --- a/src/client/app/mobile/views/components/ui.nav.vue +++ b/src/client/app/mobile/views/components/ui.nav.vue @@ -9,9 +9,9 @@ </transition> <transition name="nav"> <div class="body" v-if="isOpen"> - <router-link class="me" v-if="os.isSignedIn" :to="`/@${os.i.username}`"> - <img class="avatar" :src="`${os.i.avatarUrl}?thumbnail&size=128`" alt="avatar"/> - <p class="name">{{ os.i | userName }}</p> + <router-link class="me" v-if="$store.getters.isSignedIn" :to="`/@${$store.state.i.username}`"> + <img class="avatar" :src="`${$store.state.i.avatarUrl}?thumbnail&size=128`" alt="avatar"/> + <p class="name">{{ $store.state.i | userName }}</p> </router-link> <div class="links"> <ul> @@ -55,7 +55,7 @@ export default Vue.extend({ }; }, mounted() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); @@ -82,7 +82,7 @@ export default Vue.extend({ } }, beforeDestroy() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.off('read_all_notifications', this.onReadAllNotifications); this.connection.off('unread_notification', this.onUnreadNotification); this.connection.off('read_all_messaging_messages', this.onReadAllMessagingMessages); diff --git a/src/client/app/mobile/views/components/ui.vue b/src/client/app/mobile/views/components/ui.vue index 325ce9d40e..7e2d39f259 100644 --- a/src/client/app/mobile/views/components/ui.vue +++ b/src/client/app/mobile/views/components/ui.vue @@ -8,7 +8,7 @@ <div class="content"> <slot></slot> </div> - <mk-stream-indicator v-if="os.isSignedIn"/> + <mk-stream-indicator v-if="$store.getters.isSignedIn"/> </div> </template> @@ -32,7 +32,7 @@ export default Vue.extend({ }; }, mounted() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); @@ -40,7 +40,7 @@ export default Vue.extend({ } }, beforeDestroy() { - if ((this as any).os.isSignedIn) { + if (this.$store.getters.isSignedIn) { this.connection.off('notification', this.onNotification); (this as any).os.stream.dispose(this.connectionId); } diff --git a/src/client/app/mobile/views/components/user-list-timeline.vue b/src/client/app/mobile/views/components/user-list-timeline.vue index 629151302c..2c1564b7ed 100644 --- a/src/client/app/mobile/views/components/user-list-timeline.vue +++ b/src/client/app/mobile/views/components/user-list-timeline.vue @@ -43,7 +43,7 @@ export default Vue.extend({ methods: { init() { if (this.connection) this.connection.close(); - this.connection = new UserListStream((this as any).os, (this as any).os.i, this.list.id); + this.connection = new UserListStream((this as any).os, this.$store.state.i, this.list.id); this.connection.on('note', this.onNote); this.connection.on('userAdded', this.onUserAdded); this.connection.on('userRemoved', this.onUserRemoved); @@ -58,8 +58,8 @@ export default Vue.extend({ (this as any).api('notes/user-list-timeline', { listId: this.list.id, limit: fetchLimit + 1, - includeMyRenotes: (this as any).clientSettings.showMyRenotes, - includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes + includeMyRenotes: this.$store.state.settings.showMyRenotes, + includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes }).then(notes => { if (notes.length == fetchLimit + 1) { notes.pop(); @@ -81,8 +81,8 @@ export default Vue.extend({ listId: this.list.id, limit: fetchLimit + 1, untilId: (this.$refs.timeline as any).tail().id, - includeMyRenotes: (this as any).clientSettings.showMyRenotes, - includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes + includeMyRenotes: this.$store.state.settings.showMyRenotes, + includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes }); promise.then(notes => { diff --git a/src/client/app/mobile/views/components/users-list.vue b/src/client/app/mobile/views/components/users-list.vue index 6175067459..a57b821293 100644 --- a/src/client/app/mobile/views/components/users-list.vue +++ b/src/client/app/mobile/views/components/users-list.vue @@ -2,7 +2,7 @@ <div class="mk-users-list"> <nav> <span :data-active="mode == 'all'" @click="mode = 'all'">%i18n:@all%<span>{{ count }}</span></span> - <span v-if="os.isSignedIn && youKnowCount" :data-active="mode == 'iknow'" @click="mode = 'iknow'">%i18n:@known%<span>{{ youKnowCount }}</span></span> + <span v-if="$store.getters.isSignedIn && youKnowCount" :data-active="mode == 'iknow'" @click="mode = 'iknow'">%i18n:@known%<span>{{ youKnowCount }}</span></span> </nav> <div class="users" v-if="!fetching && users.length != 0"> <mk-user-preview v-for="u in users" :user="u" :key="u.id"/> diff --git a/src/client/app/mobile/views/pages/home.timeline.vue b/src/client/app/mobile/views/pages/home.timeline.vue index 9ebce53de7..364367b940 100644 --- a/src/client/app/mobile/views/pages/home.timeline.vue +++ b/src/client/app/mobile/views/pages/home.timeline.vue @@ -38,7 +38,7 @@ export default Vue.extend({ computed: { alone(): boolean { - return (this as any).os.i.followingCount == 0; + return this.$store.state.i.followingCount == 0; }, stream(): any { @@ -92,8 +92,8 @@ export default Vue.extend({ (this as any).api(this.endpoint, { limit: fetchLimit + 1, untilDate: this.date ? this.date.getTime() : undefined, - includeMyRenotes: (this as any).clientSettings.showMyRenotes, - includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes + includeMyRenotes: this.$store.state.settings.showMyRenotes, + includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes }).then(notes => { if (notes.length == fetchLimit + 1) { notes.pop(); @@ -114,8 +114,8 @@ export default Vue.extend({ const promise = (this as any).api(this.endpoint, { limit: fetchLimit + 1, untilId: (this.$refs.timeline as any).tail().id, - includeMyRenotes: (this as any).clientSettings.showMyRenotes, - includeRenotedMyNotes: (this as any).clientSettings.showRenotedMyNotes + includeMyRenotes: this.$store.state.settings.showMyRenotes, + includeRenotedMyNotes: this.$store.state.settings.showRenotedMyNotes }); promise.then(notes => { diff --git a/src/client/app/mobile/views/pages/home.vue b/src/client/app/mobile/views/pages/home.vue index 33579185e1..c0c2ee8ab5 100644 --- a/src/client/app/mobile/views/pages/home.vue +++ b/src/client/app/mobile/views/pages/home.vue @@ -87,7 +87,7 @@ export default Vue.extend({ if (this.src == 'list') { this.list = this.$store.state.device.tl.arg; } - } else if ((this as any).os.i.followingCount == 0) { + } else if (this.$store.state.i.followingCount == 0) { this.src = 'local'; } }, diff --git a/src/client/app/mobile/views/pages/index.vue b/src/client/app/mobile/views/pages/index.vue index 0ea47d913b..5d11fc5423 100644 --- a/src/client/app/mobile/views/pages/index.vue +++ b/src/client/app/mobile/views/pages/index.vue @@ -1,5 +1,5 @@ <template> -<component :is="os.isSignedIn ? 'home' : 'welcome'"></component> +<component :is="$store.getters.isSignedIn ? 'home' : 'welcome'"></component> </template> <script lang="ts"> diff --git a/src/client/app/mobile/views/pages/settings.vue b/src/client/app/mobile/views/pages/settings.vue index 3bb25f88f8..8da7a76633 100644 --- a/src/client/app/mobile/views/pages/settings.vue +++ b/src/client/app/mobile/views/pages/settings.vue @@ -17,22 +17,22 @@ </div> <div> - <md-switch v-model="clientSettings.circleIcons" @change="onChangeCircleIcons">%i18n:@circle-icons%</md-switch> + <md-switch v-model="$store.state.settings.circleIcons" @change="onChangeCircleIcons">%i18n:@circle-icons%</md-switch> </div> <div> <div class="md-body-2">%i18n:@timeline%</div> <div> - <md-switch v-model="clientSettings.showReplyTarget" @change="onChangeShowReplyTarget">%i18n:@show-reply-target%</md-switch> + <md-switch v-model="$store.state.settings.showReplyTarget" @change="onChangeShowReplyTarget">%i18n:@show-reply-target%</md-switch> </div> <div> - <md-switch v-model="clientSettings.showMyRenotes" @change="onChangeShowMyRenotes">%i18n:@show-my-renotes%</md-switch> + <md-switch v-model="$store.state.settings.showMyRenotes" @change="onChangeShowMyRenotes">%i18n:@show-my-renotes%</md-switch> </div> <div> - <md-switch v-model="clientSettings.showRenotedMyNotes" @change="onChangeShowRenotedMyNotes">%i18n:@show-renoted-my-notes%</md-switch> + <md-switch v-model="$store.state.settings.showRenotedMyNotes" @change="onChangeShowRenotedMyNotes">%i18n:@show-renoted-my-notes%</md-switch> </div> </div> @@ -52,11 +52,11 @@ <md-card-content> <div> - <md-switch v-model="clientSettings.fetchOnScroll" @change="onChangeFetchOnScroll">%i18n:@fetch-on-scroll%</md-switch> + <md-switch v-model="$store.state.settings.fetchOnScroll" @change="onChangeFetchOnScroll">%i18n:@fetch-on-scroll%</md-switch> </div> <div> - <md-switch v-model="clientSettings.disableViaMobile" @change="onChangeDisableViaMobile">%i18n:@disable-via-mobile%</md-switch> + <md-switch v-model="$store.state.settings.disableViaMobile" @change="onChangeDisableViaMobile">%i18n:@disable-via-mobile%</md-switch> </div> <div> @@ -64,7 +64,7 @@ </div> <div> - <md-switch v-model="clientSettings.loadRemoteMedia" @change="onChangeLoadRemoteMedia">%i18n:@load-remote-media%</md-switch> + <md-switch v-model="$store.state.settings.loadRemoteMedia" @change="onChangeLoadRemoteMedia">%i18n:@load-remote-media%</md-switch> </div> <div> @@ -100,11 +100,11 @@ </md-card-header> <md-card-content> - <p class="account" v-if="os.i.twitter"><a :href="`https://twitter.com/${os.i.twitter.screenName}`" target="_blank">@{{ os.i.twitter.screenName }}</a></p> + <p class="account" v-if="$store.state.i.twitter"><a :href="`https://twitter.com/${$store.state.i.twitter.screenName}`" target="_blank">@{{ $store.state.i.twitter.screenName }}</a></p> <p> - <a :href="`${apiUrl}/connect/twitter`" target="_blank">{{ os.i.twitter ? '%i18n:@twitter-reconnect%' : '%i18n:@twitter-connect%' }}</a> - <span v-if="os.i.twitter"> or </span> - <a :href="`${apiUrl}/disconnect/twitter`" target="_blank" v-if="os.i.twitter">%i18n:@twitter-disconnect%</a> + <a :href="`${apiUrl}/connect/twitter`" target="_blank">{{ $store.state.i.twitter ? '%i18n:@twitter-reconnect%' : '%i18n:@twitter-connect%' }}</a> + <span v-if="$store.state.i.twitter"> or </span> + <a :href="`${apiUrl}/disconnect/twitter`" target="_blank" v-if="$store.state.i.twitter">%i18n:@twitter-disconnect%</a> </p> </md-card-content> </md-card> @@ -156,7 +156,7 @@ export default Vue.extend({ computed: { name(): string { - return Vue.filter('userName')((this as any).os.i); + return Vue.filter('userName')(this.$store.state.i); }, darkmode: { diff --git a/src/client/app/mobile/views/pages/settings/settings.profile.vue b/src/client/app/mobile/views/pages/settings/settings.profile.vue index c16c44e133..f3444eb1f0 100644 --- a/src/client/app/mobile/views/pages/settings/settings.profile.vue +++ b/src/client/app/mobile/views/pages/settings/settings.profile.vue @@ -82,15 +82,15 @@ export default Vue.extend({ }, created() { - this.name = (this as any).os.i.name || ''; - this.username = (this as any).os.i.username; - this.location = (this as any).os.i.profile.location; - this.description = (this as any).os.i.description; - this.birthday = (this as any).os.i.profile.birthday; - this.avatarId = (this as any).os.i.avatarId; - this.bannerId = (this as any).os.i.bannerId; - this.isBot = (this as any).os.i.isBot; - this.isCat = (this as any).os.i.isCat; + this.name = this.$store.state.i.name || ''; + this.username = this.$store.state.i.username; + this.location = this.$store.state.i.profile.location; + this.description = this.$store.state.i.description; + this.birthday = this.$store.state.i.profile.birthday; + this.avatarId = this.$store.state.i.avatarId; + this.bannerId = this.$store.state.i.bannerId; + this.isBot = this.$store.state.i.isBot; + this.isCat = this.$store.state.i.isCat; }, methods: { @@ -99,7 +99,7 @@ export default Vue.extend({ const data = new FormData(); data.append('file', file); - data.append('i', (this as any).os.i.token); + data.append('i', this.$store.state.i.token); fetch(apiUrl + '/drive/files/create', { method: 'POST', @@ -121,7 +121,7 @@ export default Vue.extend({ const data = new FormData(); data.append('file', file); - data.append('i', (this as any).os.i.token); + data.append('i', this.$store.state.i.token); fetch(apiUrl + '/drive/files/create', { method: 'POST', @@ -152,10 +152,10 @@ export default Vue.extend({ isCat: this.isCat }).then(i => { this.saving = false; - (this as any).os.i.avatarId = i.avatarId; - (this as any).os.i.avatarUrl = i.avatarUrl; - (this as any).os.i.bannerId = i.bannerId; - (this as any).os.i.bannerUrl = i.bannerUrl; + this.$store.state.i.avatarId = i.avatarId; + this.$store.state.i.avatarUrl = i.avatarUrl; + this.$store.state.i.bannerId = i.bannerId; + this.$store.state.i.bannerUrl = i.bannerUrl; alert('%i18n:@saved%'); }); diff --git a/src/client/app/mobile/views/pages/user.vue b/src/client/app/mobile/views/pages/user.vue index 84fd7eda02..b3b820650c 100644 --- a/src/client/app/mobile/views/pages/user.vue +++ b/src/client/app/mobile/views/pages/user.vue @@ -11,7 +11,7 @@ <a class="avatar"> <img :src="user.avatarUrl" alt="avatar"/> </a> - <mk-follow-button v-if="os.isSignedIn && os.i.id != user.id" :user="user"/> + <mk-follow-button v-if="$store.getters.isSignedIn && $store.state.i.id != user.id" :user="user"/> </div> <div class="title"> <h1>{{ user | userName }}</h1> diff --git a/src/client/app/mobile/views/pages/user/home.vue b/src/client/app/mobile/views/pages/user/home.vue index d02daf5027..8b57276b17 100644 --- a/src/client/app/mobile/views/pages/user/home.vue +++ b/src/client/app/mobile/views/pages/user/home.vue @@ -25,7 +25,7 @@ <x-friends :user="user"/> </div> </section> - <section class="followers-you-know" v-if="os.isSignedIn && os.i.id !== user.id"> + <section class="followers-you-know" v-if="$store.getters.isSignedIn && $store.state.i.id !== user.id"> <h2>%fa:users%%i18n:@followers-you-know%</h2> <div> <x-followers-you-know :user="user"/> diff --git a/src/client/app/mobile/views/widgets/activity.vue b/src/client/app/mobile/views/widgets/activity.vue index 7763be41f5..85f925ceda 100644 --- a/src/client/app/mobile/views/widgets/activity.vue +++ b/src/client/app/mobile/views/widgets/activity.vue @@ -3,7 +3,7 @@ <mk-widget-container :show-header="!props.compact"> <template slot="header">%fa:chart-bar%アクティビティ</template> <div :class="$style.body"> - <mk-activity :user="os.i"/> + <mk-activity :user="$store.state.i"/> </div> </mk-widget-container> </div> diff --git a/src/client/app/mobile/views/widgets/profile.vue b/src/client/app/mobile/views/widgets/profile.vue index 59c1ec7c0e..a94f7e94b8 100644 --- a/src/client/app/mobile/views/widgets/profile.vue +++ b/src/client/app/mobile/views/widgets/profile.vue @@ -2,13 +2,13 @@ <div class="mkw-profile"> <mk-widget-container> <div :class="$style.banner" - :style="os.i.bannerUrl ? `background-image: url(${os.i.bannerUrl}?thumbnail&size=256)` : ''" + :style="$store.state.i.bannerUrl ? `background-image: url(${$store.state.i.bannerUrl}?thumbnail&size=256)` : ''" ></div> <img :class="$style.avatar" - :src="`${os.i.avatarUrl}?thumbnail&size=96`" + :src="`${$store.state.i.avatarUrl}?thumbnail&size=96`" alt="avatar" /> - <router-link :class="$style.name" :to="os.i | userPage">{{ os.i | userName }}</router-link> + <router-link :class="$style.name" :to="$store.state.i | userPage">{{ $store.state.i | userName }}</router-link> </mk-widget-container> </div> </template> diff --git a/src/client/app/store.ts b/src/client/app/store.ts index e787b41464..c27ff0dfcf 100644 --- a/src/client/app/store.ts +++ b/src/client/app/store.ts @@ -2,6 +2,7 @@ import Vuex from 'vuex'; import createPersistedState from 'vuex-persistedstate'; import MiOS from './mios'; +import { hostname } from './config'; const defaultSettings = { home: [], @@ -33,23 +34,29 @@ const defaultDeviceSettings = { }; export default (os: MiOS) => new Vuex.Store({ - plugins: [store => { - store.subscribe((mutation, state) => { - if (mutation.type.startsWith('settings/')) { - localStorage.setItem('settings', JSON.stringify(state.settings)); - } - }); - }, createPersistedState({ - paths: ['device'], - filter: mut => mut.type.startsWith('device/') + plugins: [createPersistedState({ + paths: ['i', 'device', 'settings'] })], state: { + i: null, indicate: false, uiHeaderHeight: 0 }, + getters: { + isSignedIn: state => state.i != null + }, + mutations: { + updateI(state, x) { + state.i = x; + }, + + updateIKeyValue(state, x) { + state.i[x.key] = x.value; + }, + indicate(state, x) { state.indicate = x; }, @@ -59,6 +66,28 @@ export default (os: MiOS) => new Vuex.Store({ } }, + actions: { + login(ctx, i) { + ctx.commit('updateI', i); + ctx.dispatch('settings/merge', i.clientSettings); + }, + + logout(ctx) { + ctx.commit('updateI', null); + document.cookie = `i=; domain=${hostname}; expires=Thu, 01 Jan 1970 00:00:01 GMT;`; + }, + + mergeMe(ctx, me) { + Object.entries(me).forEach(([key, value]) => { + ctx.commit('updateIKeyValue', { key, value }); + }); + + if (me.clientSettings) { + ctx.dispatch('settings/merge', me.clientSettings); + } + }, + }, + modules: { device: { namespaced: true, @@ -134,7 +163,7 @@ export default (os: MiOS) => new Vuex.Store({ set(ctx, x) { ctx.commit('set', x); - if (os.isSignedIn) { + if (ctx.rootGetters.isSignedIn) { os.api('i/update_client_setting', { name: x.key, value: x.value |