From c598a9cba2d4cdecf2aec3dcde1a893ee039bce3 Mon Sep 17 00:00:00 2001 From: syuilo Date: Tue, 21 Nov 2017 05:09:45 +0900 Subject: [PATCH] wip --- .../endpoints/messaging/messages/create.ts | 4 +- src/web/app/common/mios.ts | 5 +- .../common/scripts/compose-notification.ts | 52 +++++++++++++++++++ src/web/app/desktop/script.ts | 37 +++++++------ src/web/{assets => app}/sw.js | 19 ++++--- src/web/server.ts | 2 +- webpack/webpack.config.ts | 3 +- 7 files changed, 91 insertions(+), 31 deletions(-) create mode 100644 src/web/app/common/scripts/compose-notification.ts rename src/web/{assets => app}/sw.js (71%) diff --git a/src/api/endpoints/messaging/messages/create.ts b/src/api/endpoints/messaging/messages/create.ts index 29a4671f84..3c7689f967 100644 --- a/src/api/endpoints/messaging/messages/create.ts +++ b/src/api/endpoints/messaging/messages/create.ts @@ -9,8 +9,7 @@ import User from '../../../models/user'; import DriveFile from '../../../models/drive-file'; import serialize from '../../../serializers/messaging-message'; import publishUserStream from '../../../event'; -import { publishMessagingStream } from '../../../event'; -import { publishMessagingIndexStream } from '../../../event'; +import { publishMessagingStream, publishMessagingIndexStream, pushSw } from '../../../event'; import config from '../../../../conf'; /** @@ -99,6 +98,7 @@ module.exports = (params, user) => new Promise(async (res, rej) => { const freshMessage = await Message.findOne({ _id: message._id }, { is_read: true }); if (!freshMessage.is_read) { publishUserStream(message.recipient_id, 'unread_messaging_message', messageObj); + pushSw(message.recipient_id, 'unread_messaging_message', messageObj); } }, 3000); 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/assets/sw.js b/src/web/app/sw.js similarity index 71% rename from src/web/assets/sw.js rename to src/web/app/sw.js index 6a1251614a..463ae0c75e 100644 --- a/src/web/assets/sw.js +++ b/src/web/app/sw.js @@ -2,6 +2,8 @@ * Service Worker */ +import composeNotification from './common/scripts/compose-notification'; + // インストールされたとき self.addEventListener('install', () => { console.log('[sw]', 'Your ServiceWorker is installed'); @@ -17,15 +19,12 @@ self.addEventListener('push', ev => { if (clients.length != 0) return; const { type, body } = ev.data.json(); - handlers[type](body); + const n = composeNotification(type, body); + if (n) { + self.registration.showNotification(n.title, { + body: n.body, + icon: n.icon, + }); + } }); }); - -const handlers = { - mention: body => { - self.registration.showNotification('mentioned', { - body: body.text, - icon: body.user.avatar_url + '?thumbnail&size=64', - }); - } -}; diff --git a/src/web/server.ts b/src/web/server.ts index 300f3ed477..0be07b2d8b 100644 --- a/src/web/server.ts +++ b/src/web/server.ts @@ -42,7 +42,7 @@ app.use('/assets', express.static(`${__dirname}/assets`, { maxAge: ms('7 days') })); -app.get('/sw.js', (req, res) => res.sendFile(`${__dirname}/assets/sw.js`)); +app.get(/^\/sw\.(.+?)\.js$/, (req, res) => res.sendFile(`${__dirname}/assets/sw.${req.params[0]}.js`)); /** * Manifest diff --git a/webpack/webpack.config.ts b/webpack/webpack.config.ts index f2bcf48f31..753d89fede 100644 --- a/webpack/webpack.config.ts +++ b/webpack/webpack.config.ts @@ -20,7 +20,8 @@ module.exports = langs.map(([lang, locale]) => { stats: './src/web/app/stats/script.ts', status: './src/web/app/status/script.ts', dev: './src/web/app/dev/script.ts', - auth: './src/web/app/auth/script.ts' + auth: './src/web/app/auth/script.ts', + sw: './src/web/app/sw.js' }; const output = {