WORK IN PROGRESS

This commit is contained in:
tamaina 2021-02-10 22:19:09 +09:00
parent 07584f3d6c
commit 3d59a2fbe2
7 changed files with 211 additions and 177 deletions

View File

@ -0,0 +1,116 @@
/*
* Notification manager for SW
*/
declare var self: ServiceWorkerGlobalScope;
import { getNoteSummary } from '../../misc/get-note-summary';
import getUserName from '../../misc/get-user-name';
import { swLang } from '@/sw/lang';
import { I18n } from '@/scripts/i18n';
import { pushNotificationData } from '../../types';
export async function createNotification(data: pushNotificationData) {
const n = await composeNotification(data);
if (n) return self.registration.showNotification(...n);
}
async function composeNotification(data: pushNotificationData): Promise<[string, NotificationOptions] | null | undefined> {
if (!swLang.i18n) swLang.fetchLocale();
const i18n = await swLang.i18n as I18n<any>;
const { t } = i18n;
switch (data.type) {
/*
case 'driveFileCreated': // TODO (Server Side)
return [t('_notification.fileUploaded'), {
body: data.body.name,
icon: data.body.url,
data
}];
*/
case 'notification':
switch (data.body.type) {
case 'mention':
return [t('_notification.youGotMention', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl,
data,
actions: [
{
action: 'showUser',
title: 'showUser'
}
]
}];
case 'reply':
return [t('_notification.youGotReply', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'renote':
return [t('_notification.youRenoted', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'quote':
return [t('_notification.youGotQuote', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'reaction':
return [`${data.body.reaction} ${getUserName(data.body.user)}`, {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'pollVote':
return [t('_notification.youGotPoll', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'follow':
return [t('_notification.youWereFollowed'), {
body: getUserName(data.body.user),
icon: data.body.user.avatarUrl
}];
case 'receiveFollowRequest':
return [t('_notification.youReceivedFollowRequest'), {
body: getUserName(data.body.user),
icon: data.body.user.avatarUrl
}];
case 'followRequestAccepted':
return [t('_notification.yourFollowRequestAccepted'), {
body: getUserName(data.body.user),
icon: data.body.user.avatarUrl
}];
case 'groupInvited':
return [t('_notification.youWereInvitedToGroup'), {
body: data.body.group.name
}];
default:
return null;
}
case 'unreadMessagingMessage':
if (data.body.groupId === null) {
return [t('_notification.youGotMessagingMessageFromUser', { name: getUserName(data.body.user) }), {
icon: data.body.user.avatarUrl,
tag: `messaging:user:${data.body.user.id}`
}];
}
return [t('_notification.youGotMessagingMessageFromGroup', { name: data.body.group.name }), {
icon: data.body.user.avatarUrl,
tag: `messaging:group:${data.body.group.id}`
}];
default:
return null;
}
}

View File

@ -14,10 +14,9 @@ class SwLang {
return prelang; return prelang;
}); });
public i18n: I18n<any> | null = null; public i18n: Promise<I18n<any>> | null = null;
public setLang(newLang: string) { public setLang(newLang: string) {
this.i18n = null;
this.lang = Promise.resolve(newLang); this.lang = Promise.resolve(newLang);
set('lang', newLang); set('lang', newLang);
return this.fetchLocale(); return this.fetchLocale();
@ -25,18 +24,20 @@ class SwLang {
public async fetchLocale() { public async fetchLocale() {
// Service Workerは何度も起動しそのたびにlocaleを読み込むので、CacheStorageを使う // Service Workerは何度も起動しそのたびにlocaleを読み込むので、CacheStorageを使う
const localeUrl = `/assets/locales/${await this.lang}.${_VERSION_}.json`; return this.i18n = new Promise(async (res, rej) => {
let localeRes = await caches.match(localeUrl); const localeUrl = `/assets/locales/${await this.lang}.${_VERSION_}.json`;
let localeRes = await caches.match(localeUrl);
if (!localeRes) {
localeRes = await fetch(localeUrl);
const clone = localeRes?.clone();
if (!clone?.clone().ok) rej('locale fetching error');
if (!localeRes) { caches.open(this.cacheName).then(cache => cache.put(localeUrl, clone));
localeRes = await fetch(localeUrl); }
const clone = localeRes?.clone();
if (!clone?.clone().ok) return;
caches.open(this.cacheName).then(cache => cache.put(localeUrl, clone)); res(new I18n(await localeRes.json()));
} });
return this.i18n = new I18n(await localeRes.json());
} }
} }

View File

@ -0,0 +1,56 @@
import { get } from "idb-keyval";
import { pushNotificationData } from '../../types';
type Accounts = {
[x: string]: {
queue: string[],
timeout: number | null,
token: string,
}
};
class SwNotificationRead {
private accounts: Accounts = {};
public async construct() {
const accounts = await get('accounts') as { i: string, id: string }[];
if (accounts) Error('Account is not recorded');
this.accounts = accounts.reduce((acc, e) => {
acc[e.id] = {
queue: [],
timeout: null,
token: e.i,
};
return acc;
}, {} as Accounts);
return this;
}
// プッシュ通知の既読をサーバーに送信
public async read(data: pushNotificationData) {
if (data.type !== 'notification' || !(data.userId in this.accounts)) return;
const account = this.accounts[data.userId]
account.queue.push(data.body.id)
// 最後の呼び出しから100ms待ってまとめて処理する
if (account.timeout) clearTimeout(account.timeout);
account.timeout = setTimeout(() => {
account.timeout = null;
console.info(account.token, account.queue)
fetch(`${location.origin}/api/notifications/read`, {
method: 'POST',
body: JSON.stringify({
i: account.token,
notificationIds: account.queue
})
});
}, 100);
}
}
export const swNotificationRead = (new SwNotificationRead()).construct();

View File

@ -1,136 +0,0 @@
/*
* Notification manager for SW
*/
declare var self: ServiceWorkerGlobalScope;
import { getNoteSummary } from '../../misc/get-note-summary';
import getUserName from '../../misc/get-user-name';
import { swLang } from '@/sw/lang';
class SwNotification {
private queue: any[] = [];
private fetching = false;
public async append(data) {
if (swLang.i18n) {
const n = await this.composeNotification(data);
if (n) return self.registration.showNotification(...n);
} else {
this.queue.push(data);
if (this.fetching == false) {
this.fetching = true;
await swLang.fetchLocale();
const promises = this.queue.map(this.composeNotification).map(n => {
if (!n) return;
return self.registration.showNotification(...n);
});
this.fetching = false;
this.queue = [];
return Promise.all(promises);
}
}
}
private composeNotification(data): [string, NotificationOptions] | null | undefined {
const { i18n } = swLang;
if (!i18n) return;
const { t } = i18n;
switch (data.type) {
case 'driveFileCreated': // TODO (Server Side)
return [t('_notification.fileUploaded'), {
body: data.body.name,
icon: data.body.url,
data
}];
case 'notification':
switch (data.body.type) {
case 'mention':
return [t('_notification.youGotMention', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl,
data,
actions: [
{
action: 'showUser',
title: 'showUser'
}
]
}];
case 'reply':
return [t('_notification.youGotReply', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'renote':
return [t('_notification.youRenoted', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'quote':
return [t('_notification.youGotQuote', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'reaction':
return [`${data.body.reaction} ${getUserName(data.body.user)}`, {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'pollVote':
return [t('_notification.youGotPoll', { name: getUserName(data.body.user) }), {
body: getNoteSummary(data.body.note, i18n.locale),
icon: data.body.user.avatarUrl
}];
case 'follow':
return [t('_notification.youWereFollowed'), {
body: getUserName(data.body.user),
icon: data.body.user.avatarUrl
}];
case 'receiveFollowRequest':
return [t('_notification.youReceivedFollowRequest'), {
body: getUserName(data.body.user),
icon: data.body.user.avatarUrl
}];
case 'followRequestAccepted':
return [t('_notification.yourFollowRequestAccepted'), {
body: getUserName(data.body.user),
icon: data.body.user.avatarUrl
}];
case 'groupInvited':
return [t('_notification.youWereInvitedToGroup'), {
body: data.body.group.name
}];
default:
return null;
}
case 'unreadMessagingMessage':
if (data.body.groupId === null) {
return [t('_notification.youGotMessagingMessageFromUser', { name: getUserName(data.body.user) }), {
icon: data.body.user.avatarUrl,
tag: `messaging:user:${data.body.user.id}`
}];
}
return [t('_notification.youGotMessagingMessageFromGroup', { name: data.body.group.name }), {
icon: data.body.user.avatarUrl,
tag: `messaging:group:${data.body.group.id}`
}];
default:
return null;
}
}
}
export const swNotification = new SwNotification();

View File

@ -3,9 +3,10 @@
*/ */
declare var self: ServiceWorkerGlobalScope; declare var self: ServiceWorkerGlobalScope;
import { get } from 'idb-keyval'; import { createNotification } from '@/sw/create-notification';
import { swNotification } from '@/sw/notification';
import { swLang } from '@/sw/lang'; import { swLang } from '@/sw/lang';
import { swNotificationRead } from '@/sw/notification-read';
import { pushNotificationData } from '../../types';
//#region Variables //#region Variables
// const cacheName = `mk-cache-${_VERSION_}`; // const cacheName = `mk-cache-${_VERSION_}`;
@ -55,21 +56,23 @@ self.addEventListener('push', ev => {
// // クライアントがあったらストリームに接続しているということなので通知しない // // クライアントがあったらストリームに接続しているということなので通知しない
// if (clients.length != 0) return; // if (clients.length != 0) return;
const data = ev.data?.json(); const data: pushNotificationData = ev.data?.json();
switch (data.type) { switch (data.type) {
case 'notification': case 'notification':
case 'driveFileCreated': // case 'driveFileCreated':
case 'unreadMessagingMessage': case 'unreadMessagingMessage':
return swNotification.append(data); return createNotification(data);
case 'readAllNotifications': case 'readAllNotifications':
for (const n of await self.registration.getNotifications()) { for (const n of await self.registration.getNotifications()) {
n.close(); n.close();
} }
break; break;
case 'readNotifications': case 'readNotifications':
for (const n of await self.registration.getNotifications()) { for (const notification of await self.registration.getNotifications()) {
if (data.notificationIds.includes(n.data.body.id)) n.close(); if (data.body.notificationIds.includes(notification.data.body.id)) {
notification.close()
};
} }
break; break;
} }
@ -80,7 +83,7 @@ self.addEventListener('push', ev => {
//#region Notification //#region Notification
self.addEventListener('notificationclick', ev => { self.addEventListener('notificationclick', ev => {
const { action, notification } = ev; const { action, notification } = ev;
const { data } = notification; const data: pushNotificationData = notification.data;
const { origin } = location; const { origin } = location;
const suffix = `?loginId=${data.userId}`; const suffix = `?loginId=${data.userId}`;
@ -104,30 +107,17 @@ self.addEventListener('notificationclick', ev => {
notification.close(); notification.close();
}); });
self.addEventListener('notificationclose', async ev => { self.addEventListener('notificationclose', ev => {
const { notification } = ev; const { notification } = ev;
if (notification.title !== 'notificationclose') { if (notification.title !== 'notificationclose') {
self.registration.showNotification('notificationclose', { body: `${notification.data.id}` }); self.registration.showNotification('notificationclose', { body: `${notification.data.body.id}` });
} }
const { data } = notification; const data: pushNotificationData = notification.data;
if (data.isNotification) { if (data.type === 'notification') {
const { origin } = location; console.log('close', data);
swNotificationRead.then(that => that.read(data));
const accounts = await get('accounts');
const account = accounts.find(i => i.id === data.userId);
if (!account) return;
if (data.type === 'notification') {
fetch(`${origin}/api/notifications/read`, {
method: 'POST',
body: JSON.stringify({
i: account.token,
notificationIds: [data.body.id]
})
});
}
} }
}); });
//#endregion //#endregion

View File

@ -4,6 +4,7 @@ import { SwSubscriptions } from '../models';
import { fetchMeta } from '../misc/fetch-meta'; import { fetchMeta } from '../misc/fetch-meta';
import { PackedNotification } from '../models/repositories/notification'; import { PackedNotification } from '../models/repositories/notification';
import { PackedMessagingMessage } from '../models/repositories/messaging-message'; import { PackedMessagingMessage } from '../models/repositories/messaging-message';
import { pushNotificationData } from '../types';
type pushNotificationsTypes = { type pushNotificationsTypes = {
'notification': PackedNotification; 'notification': PackedNotification;
@ -38,7 +39,7 @@ export async function pushNotification<T extends keyof pushNotificationsTypes>(u
push.sendNotification(pushSubscription, JSON.stringify({ push.sendNotification(pushSubscription, JSON.stringify({
type, body, userId type, body, userId
}), { } as pushNotificationData), {
proxy: config.proxy proxy: config.proxy
}).catch((err: any) => { }).catch((err: any) => {
//swLogger.info(err.statusCode); //swLogger.info(err.statusCode);

View File

@ -3,3 +3,9 @@ export const notificationTypes = ['follow', 'mention', 'reply', 'renote', 'quote
export const noteVisibilities = ['public', 'home', 'followers', 'specified'] as const; export const noteVisibilities = ['public', 'home', 'followers', 'specified'] as const;
export const mutedNoteReasons = ['word', 'manual', 'spam', 'other'] as const; export const mutedNoteReasons = ['word', 'manual', 'spam', 'other'] as const;
export type pushNotificationData = {
type: 'notification' | 'unreadMessagingMessage' | 'readNotifications' | 'readAllNotifications',
body: any,
userId: string
};