diff options
Diffstat (limited to 'src/client')
4 files changed, 53 insertions, 114 deletions
diff --git a/src/client/app/common/scripts/streaming/home.ts b/src/client/app/common/scripts/streaming/home.ts index 2715b9e0e9..50bbb56896 100644 --- a/src/client/app/common/scripts/streaming/home.ts +++ b/src/client/app/common/scripts/streaming/home.ts @@ -28,6 +28,30 @@ export class HomeStream extends Stream { os.store.dispatch('mergeMe', i); }); + this.on('read_all_notifications', () => { + os.store.dispatch('mergeMe', { + hasUnreadNotification: false + }); + }); + + this.on('unread_notification', () => { + os.store.dispatch('mergeMe', { + hasUnreadNotification: true + }); + }); + + this.on('read_all_messaging_messages', () => { + os.store.dispatch('mergeMe', { + hasUnreadMessagingMessage: false + }); + }); + + this.on('unread_messaging_message', () => { + os.store.dispatch('mergeMe', { + hasUnreadMessagingMessage: true + }); + }); + this.on('clientSettingUpdated', x => { os.store.commit('settings/set', { key: x.key, 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 9eaaa62c61..59a16df9ec 100644 --- a/src/client/app/desktop/views/components/ui.header.notifications.vue +++ b/src/client/app/desktop/views/components/ui.header.notifications.vue @@ -1,7 +1,7 @@ <template> <div class="notifications"> <button :data-active="isOpen" @click="toggle" title="%i18n:@title%"> - %fa:R bell%<template v-if="hasUnreadNotifications">%fa:circle%</template> + %fa:R bell%<template v-if="hasUnreadNotification">%fa:circle%</template> </button> <div class="pop" v-if="isOpen"> <mk-notifications/> @@ -16,44 +16,15 @@ import contains from '../../../common/scripts/contains'; export default Vue.extend({ data() { return { - isOpen: false, - hasUnreadNotifications: false, - connection: null, - connectionId: null + isOpen: false }; }, - mounted() { - if (this.$store.getters.isSignedIn) { - this.connection = (this as any).os.stream.getConnection(); - this.connectionId = (this as any).os.stream.use(); - - this.connection.on('read_all_notifications', this.onReadAllNotifications); - this.connection.on('unread_notification', this.onUnreadNotification); - - // Fetch count of unread notifications - (this as any).api('notifications/get_unread_count').then(res => { - if (res.count > 0) { - this.hasUnreadNotifications = true; - } - }); - } - }, - beforeDestroy() { - 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); + computed: { + hasUnreadNotification(): boolean { + return this.$store.getters.isSignedIn && this.$store.state.i.hasUnreadNotification; } }, methods: { - onReadAllNotifications() { - this.hasUnreadNotifications = false; - }, - - onUnreadNotification() { - this.hasUnreadNotifications = true; - }, - toggle() { this.isOpen ? this.close() : this.open(); }, diff --git a/src/client/app/mobile/views/components/ui.header.vue b/src/client/app/mobile/views/components/ui.header.vue index 09aa18f769..c72b15fb8b 100644 --- a/src/client/app/mobile/views/components/ui.header.vue +++ b/src/client/app/mobile/views/components/ui.header.vue @@ -6,7 +6,7 @@ <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> + <template v-if="hasUnreadNotification || hasUnreadMessagingMessage || hasGameInvitation">%fa:circle%</template> <h1> <slot>Misskey</slot> </h1> @@ -25,13 +25,19 @@ export default Vue.extend({ props: ['func'], data() { return { - hasUnreadNotifications: false, - hasUnreadMessagingMessages: false, - hasGameInvitations: false, + hasGameInvitation: false, connection: null, connectionId: null }; }, + computed: { + hasUnreadNotification(): boolean { + return this.$store.getters.isSignedIn && this.$store.state.i.hasUnreadNotification; + }, + hasUnreadMessagingMessage(): boolean { + return this.$store.getters.isSignedIn && this.$store.state.i.hasUnreadMessagingMessage; + } + }, mounted() { this.$store.commit('setUiHeaderHeight', 48); @@ -39,27 +45,9 @@ export default Vue.extend({ this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); - this.connection.on('read_all_notifications', this.onReadAllNotifications); - this.connection.on('unread_notification', this.onUnreadNotification); - this.connection.on('read_all_messaging_messages', this.onReadAllMessagingMessages); - this.connection.on('unread_messaging_message', this.onUnreadMessagingMessage); this.connection.on('othello_invited', this.onOthelloInvited); this.connection.on('othello_no_invites', this.onOthelloNoInvites); - // Fetch count of unread notifications - (this as any).api('notifications/get_unread_count').then(res => { - if (res.count > 0) { - this.hasUnreadNotifications = true; - } - }); - - // Fetch count of unread messaging messages - (this as any).api('messaging/unread').then(res => { - if (res.count > 0) { - this.hasUnreadMessagingMessages = true; - } - }); - const ago = (new Date().getTime() - new Date(this.$store.state.i.lastUsedAt).getTime()) / 1000; const isHisasiburi = ago >= 3600; this.$store.state.i.lastUsedAt = new Date(); @@ -110,33 +98,17 @@ export default Vue.extend({ }, beforeDestroy() { 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); - this.connection.off('unread_messaging_message', this.onUnreadMessagingMessage); this.connection.off('othello_invited', this.onOthelloInvited); this.connection.off('othello_no_invites', this.onOthelloNoInvites); (this as any).os.stream.dispose(this.connectionId); } }, methods: { - onReadAllNotifications() { - this.hasUnreadNotifications = false; - }, - onUnreadNotification() { - this.hasUnreadNotifications = true; - }, - onReadAllMessagingMessages() { - this.hasUnreadMessagingMessages = false; - }, - onUnreadMessagingMessage() { - this.hasUnreadMessagingMessages = true; - }, onOthelloInvited() { - this.hasGameInvitations = true; + this.hasGameInvitation = true; }, onOthelloNoInvites() { - this.hasGameInvitations = false; + this.hasGameInvitation = false; } } }); diff --git a/src/client/app/mobile/views/components/ui.nav.vue b/src/client/app/mobile/views/components/ui.nav.vue index 5f0cc831cc..de8c21e795 100644 --- a/src/client/app/mobile/views/components/ui.nav.vue +++ b/src/client/app/mobile/views/components/ui.nav.vue @@ -16,7 +16,7 @@ <div class="links"> <ul> <li><router-link to="/" :data-active="$route.name == 'index'">%fa:home%%i18n:@home%%fa:angle-right%</router-link></li> - <li><router-link to="/i/notifications" :data-active="$route.name == 'notifications'">%fa:R bell%%i18n:@notifications%<template v-if="hasUnreadNotifications">%fa:circle%</template>%fa:angle-right%</router-link></li> + <li><router-link to="/i/notifications" :data-active="$route.name == 'notifications'">%fa:R bell%%i18n:@notifications%<template v-if="hasUnreadNotification">%fa:circle%</template>%fa:angle-right%</router-link></li> <li><router-link to="/i/messaging" :data-active="$route.name == 'messaging'">%fa:R comments%%i18n:@messaging%<template v-if="hasUnreadMessagingMessages">%fa:circle%</template>%fa:angle-right%</router-link></li> <li><router-link to="/othello" :data-active="$route.name == 'othello'">%fa:gamepad%ゲーム<template v-if="hasGameInvitations">%fa:circle%</template>%fa:angle-right%</router-link></li> </ul> @@ -46,47 +46,31 @@ export default Vue.extend({ props: ['isOpen'], data() { return { - hasUnreadNotifications: false, - hasUnreadMessagingMessages: false, - hasGameInvitations: false, + hasGameInvitation: false, connection: null, connectionId: null, aboutUrl: `${docsUrl}/${lang}/about` }; }, + computed: { + hasUnreadNotification(): boolean { + return this.$store.getters.isSignedIn && this.$store.state.i.hasUnreadNotification; + }, + hasUnreadMessagingMessage(): boolean { + return this.$store.getters.isSignedIn && this.$store.state.i.hasUnreadMessagingMessage; + } + }, mounted() { if (this.$store.getters.isSignedIn) { this.connection = (this as any).os.stream.getConnection(); this.connectionId = (this as any).os.stream.use(); - this.connection.on('read_all_notifications', this.onReadAllNotifications); - this.connection.on('unread_notification', this.onUnreadNotification); - this.connection.on('read_all_messaging_messages', this.onReadAllMessagingMessages); - this.connection.on('unread_messaging_message', this.onUnreadMessagingMessage); this.connection.on('othello_invited', this.onOthelloInvited); this.connection.on('othello_no_invites', this.onOthelloNoInvites); - - // Fetch count of unread notifications - (this as any).api('notifications/get_unread_count').then(res => { - if (res.count > 0) { - this.hasUnreadNotifications = true; - } - }); - - // Fetch count of unread messaging messages - (this as any).api('messaging/unread').then(res => { - if (res.count > 0) { - this.hasUnreadMessagingMessages = true; - } - }); } }, beforeDestroy() { 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); - this.connection.off('unread_messaging_message', this.onUnreadMessagingMessage); this.connection.off('othello_invited', this.onOthelloInvited); this.connection.off('othello_no_invites', this.onOthelloNoInvites); (this as any).os.stream.dispose(this.connectionId); @@ -98,23 +82,11 @@ export default Vue.extend({ if (query == null || query == '') return; this.$router.push('/search?q=' + encodeURIComponent(query)); }, - onReadAllNotifications() { - this.hasUnreadNotifications = false; - }, - onUnreadNotification() { - this.hasUnreadNotifications = true; - }, - onReadAllMessagingMessages() { - this.hasUnreadMessagingMessages = false; - }, - onUnreadMessagingMessage() { - this.hasUnreadMessagingMessages = true; - }, onOthelloInvited() { - this.hasGameInvitations = true; + this.hasGameInvitation = true; }, onOthelloNoInvites() { - this.hasGameInvitations = false; + this.hasGameInvitation = false; }, dark() { this.$store.commit('device/set', { |