From c598a9cba2d4cdecf2aec3dcde1a893ee039bce3 Mon Sep 17 00:00:00 2001 From: syuilo Date: Tue, 21 Nov 2017 05:09:45 +0900 Subject: wip --- src/web/app/common/mios.ts | 5 ++- src/web/app/common/scripts/compose-notification.ts | 52 ++++++++++++++++++++++ src/web/app/desktop/script.ts | 37 ++++++++------- src/web/app/sw.js | 30 +++++++++++++ 4 files changed, 107 insertions(+), 17 deletions(-) create mode 100644 src/web/app/common/scripts/compose-notification.ts create mode 100644 src/web/app/sw.js (limited to 'src/web/app') diff --git a/src/web/app/common/mios.ts b/src/web/app/common/mios.ts index 4a36d6375f..a98ef5f477 100644 --- a/src/web/app/common/mios.ts +++ b/src/web/app/common/mios.ts @@ -6,6 +6,9 @@ import HomeStreamManager from './scripts/streaming/home-stream-manager'; import CONFIG from './scripts/config'; import api from './scripts/api'; +declare var VERSION: string; +declare var LANG: string; + /** * Misskey Operating System */ @@ -142,7 +145,7 @@ export default class MiOS extends EventEmitter { navigator.serviceWorker.ready.then(this.swSubscribe); // Register service worker - navigator.serviceWorker.register('/sw.js').then(registration => { + navigator.serviceWorker.register(`/sw.${VERSION}.${LANG}.js`).then(registration => { // 登録成功 console.info('ServiceWorker registration successful with scope: ', registration.scope); }).catch(err => { diff --git a/src/web/app/common/scripts/compose-notification.ts b/src/web/app/common/scripts/compose-notification.ts new file mode 100644 index 0000000000..181dca734f --- /dev/null +++ b/src/web/app/common/scripts/compose-notification.ts @@ -0,0 +1,52 @@ +import getPostSummary from '../../../../common/get-post-summary'; + +type Notification = { + title: string; + body: string; + icon: string; + onclick?: any; +}; + +// TODO: i18n + +export default function(type, data): Notification { + switch (type) { + case 'drive_file_created': + return { + title: 'ファイルがアップロードされました', + body: data.name, + icon: data.url + '?thumbnail&size=64' + }; + + case 'mention': + return { + title: `${data.user.name}さんから:`, + body: getPostSummary(data), + icon: data.user.avatar_url + '?thumbnail&size=64' + }; + + case 'reply': + return { + title: `${data.user.name}さんから返信:`, + body: getPostSummary(data), + icon: data.user.avatar_url + '?thumbnail&size=64' + }; + + case 'quote': + return { + title: `${data.user.name}さんが引用:`, + body: getPostSummary(data), + icon: data.user.avatar_url + '?thumbnail&size=64' + }; + + case 'unread_messaging_message': + return { + title: `${data.user.name}さんからメッセージ:`, + body: data.text, // TODO: getMessagingMessageSummary(data), + icon: data.user.avatar_url + '?thumbnail&size=64' + }; + + default: + return null; + } +} diff --git a/src/web/app/desktop/script.ts b/src/web/app/desktop/script.ts index bc0fc8dfe3..694cb7879c 100644 --- a/src/web/app/desktop/script.ts +++ b/src/web/app/desktop/script.ts @@ -11,9 +11,9 @@ import * as riot from 'riot'; import init from '../init'; import route from './router'; import fuckAdBlock from './scripts/fuck-ad-block'; -import getPostSummary from '../../../common/get-post-summary'; import MiOS from '../common/mios'; import HomeStreamManager from '../common/scripts/streaming/home-stream-manager'; +import composeNotification from '../common/scripts/compose-notification'; /** * init @@ -55,41 +55,46 @@ function registerNotifications(stream: HomeStreamManager) { function attach(connection) { connection.on('drive_file_created', file => { - const n = new Notification('ファイルがアップロードされました', { - body: file.name, - icon: file.url + '?thumbnail&size=64' + const _n = composeNotification('drive_file_created', file); + const n = new Notification(_n.title, { + body: _n.body, + icon: _n.icon }); setTimeout(n.close.bind(n), 5000); }); connection.on('mention', post => { - const n = new Notification(`${post.user.name}さんから:`, { - body: getPostSummary(post), - icon: post.user.avatar_url + '?thumbnail&size=64' + const _n = composeNotification('mention', post); + const n = new Notification(_n.title, { + body: _n.body, + icon: _n.icon }); setTimeout(n.close.bind(n), 6000); }); connection.on('reply', post => { - const n = new Notification(`${post.user.name}さんから返信:`, { - body: getPostSummary(post), - icon: post.user.avatar_url + '?thumbnail&size=64' + const _n = composeNotification('reply', post); + const n = new Notification(_n.title, { + body: _n.body, + icon: _n.icon }); setTimeout(n.close.bind(n), 6000); }); connection.on('quote', post => { - const n = new Notification(`${post.user.name}さんが引用:`, { - body: getPostSummary(post), - icon: post.user.avatar_url + '?thumbnail&size=64' + const _n = composeNotification('quote', post); + const n = new Notification(_n.title, { + body: _n.body, + icon: _n.icon }); setTimeout(n.close.bind(n), 6000); }); connection.on('unread_messaging_message', message => { - const n = new Notification(`${message.user.name}さんからメッセージ:`, { - body: message.text, // TODO: getMessagingMessageSummary(message), - icon: message.user.avatar_url + '?thumbnail&size=64' + const _n = composeNotification('unread_messaging_message', message); + const n = new Notification(_n.title, { + body: _n.body, + icon: _n.icon }); n.onclick = () => { n.close(); diff --git a/src/web/app/sw.js b/src/web/app/sw.js new file mode 100644 index 0000000000..463ae0c75e --- /dev/null +++ b/src/web/app/sw.js @@ -0,0 +1,30 @@ +/** + * Service Worker + */ + +import composeNotification from './common/scripts/compose-notification'; + +// インストールされたとき +self.addEventListener('install', () => { + console.log('[sw]', 'Your ServiceWorker is installed'); +}); + +// プッシュ通知を受け取ったとき +self.addEventListener('push', ev => { + // クライアント取得 + self.clients.matchAll({ + includeUncontrolled: true + }).then(clients => { + // クライアントがあったらストリームに接続しているということなので通知しない + if (clients.length != 0) return; + + const { type, body } = ev.data.json(); + const n = composeNotification(type, body); + if (n) { + self.registration.showNotification(n.title, { + body: n.body, + icon: n.icon, + }); + } + }); +}); -- cgit v1.2.3-freya