diff --git a/app/images/web-push/web-push-icon_expand.png b/app/images/web-push/web-push-icon_expand.png new file mode 100644 index 000000000..5c115c769 Binary files /dev/null and b/app/images/web-push/web-push-icon_expand.png differ diff --git a/app/images/web-push/web-push-icon_favourite.png b/app/images/web-push/web-push-icon_favourite.png new file mode 100644 index 000000000..7f30a6723 Binary files /dev/null and b/app/images/web-push/web-push-icon_favourite.png differ diff --git a/app/images/web-push/web-push-icon_reblog.png b/app/images/web-push/web-push-icon_reblog.png new file mode 100644 index 000000000..f70203ec8 Binary files /dev/null and b/app/images/web-push/web-push-icon_reblog.png differ diff --git a/app/soapbox/service_worker/entry.js b/app/soapbox/service_worker/entry.js index 1147f003f..364b67066 100644 --- a/app/soapbox/service_worker/entry.js +++ b/app/soapbox/service_worker/entry.js @@ -1,77 +1 @@ import './web_push_notifications'; - -function openWebCache() { - return caches.open('soapbox-web'); -} - -function fetchRoot() { - return fetch('/', { credentials: 'include', redirect: 'manual' }); -} - -// Cause a new version of a registered Service Worker to replace an existing one -// that is already installed, and replace the currently active worker on open pages. -self.addEventListener('install', function(event) { - event.waitUntil(Promise.all([openWebCache(), fetchRoot()]).then(([cache, root]) => cache.put('/', root))); -}); -self.addEventListener('activate', function(event) { - event.waitUntil(self.clients.claim()); -}); -self.addEventListener('fetch', function(event) { - const url = new URL(event.request.url); - - if (url.pathname === '/auth/sign_out') { - const asyncResponse = fetch(event.request); - const asyncCache = openWebCache(); - - event.respondWith(asyncResponse.then(response => { - if (response.ok || response.type === 'opaqueredirect') { - return Promise.all([ - asyncCache.then(cache => cache.delete('/')), - indexedDB.deleteDatabase('soapbox'), - ]).then(() => response); - } - - return response; - })); - } else if ( - url.pathname.startsWith('/system') || - url.pathname.startsWith('/api') || - url.pathname.startsWith('/settings') || - url.pathname.startsWith('/media') || - url.pathname.startsWith('/admin') || - url.pathname.startsWith('/about') || - url.pathname.startsWith('/auth') || - url.pathname.startsWith('/oauth') || - url.pathname.startsWith('/invites') || - url.pathname.startsWith('/pghero') || - url.pathname.startsWith('/sidekiq') || - url.pathname.startsWith('/filters') || - url.pathname.startsWith('/tags') || - url.pathname.startsWith('/emojis') || - url.pathname.startsWith('/inbox') || - url.pathname.startsWith('/accounts') || - url.pathname.startsWith('/user') || - url.pathname.startsWith('/users') || - url.pathname.startsWith('/src') || - url.pathname.startsWith('/public') || - url.pathname.startsWith('/avatars') || - url.pathname.startsWith('/authorize_follow') || - url.pathname.startsWith('/media_proxy') || - url.pathname.startsWith('/relationships') || - url.pathname.startsWith('/main/ostatus') || - url.pathname.startsWith('/ostatus_subscribe')) { - //non-webapp routes - } else if (url.pathname.startsWith('/')) { - // : TODO : if is /web - const asyncResponse = fetchRoot(); - const asyncCache = openWebCache(); - - event.respondWith(asyncResponse.then( - response => { - const clonedResponse = response.clone(); - asyncCache.then(cache => cache.put('/', clonedResponse)).catch(); - return response; - }, - () => asyncCache.then(cache => cache.match('/')))); - } -}); diff --git a/app/soapbox/service_worker/web_push_notifications.js b/app/soapbox/service_worker/web_push_notifications.js index 00e948251..2b322b325 100644 --- a/app/soapbox/service_worker/web_push_notifications.js +++ b/app/soapbox/service_worker/web_push_notifications.js @@ -12,8 +12,6 @@ const notify = options => const group = { title: formatMessage('notifications.group', options.data.preferred_locale, { count: notifications.length + 1 }), body: notifications.sort((n1, n2) => n1.timestamp < n2.timestamp).map(notification => notification.title).join('\n'), - badge: '/badge.png', - icon: '/android-chrome-192x192.png', tag: GROUP_TAG, data: { url: (new URL('/notifications', self.location)).href, @@ -89,9 +87,8 @@ const handlePush = (event) => { options.icon = notification.account.avatar_static; options.timestamp = notification.created_at && new Date(notification.created_at); options.tag = notification.id; - options.badge = '/badge.png'; options.image = notification.status && notification.status.media_attachments.length > 0 && notification.status.media_attachments[0].preview_url || undefined; - options.data = { access_token, preferred_locale, id: notification.status ? notification.status.id : notification.account.id, url: notification.status ? `/${notification.account.username}/posts/${notification.status.id}` : `/${notification.account.username}` }; + options.data = { access_token, preferred_locale, id: notification.status ? notification.status.id : notification.account.id, url: notification.status ? `/@${notification.account.username}/posts/${notification.status.id}` : `/@${notification.account.username}` }; if (notification.status && notification.status.spoiler_text || notification.status.sensitive) { options.data.hiddenBody = htmlToPlainText(notification.status.content); @@ -115,7 +112,6 @@ const handlePush = (event) => { icon, tag: notification_id, timestamp: new Date(), - badge: '/badge.png', data: { access_token, preferred_locale, url: '/notifications' }, }); }), @@ -124,19 +120,19 @@ const handlePush = (event) => { const actionExpand = preferred_locale => ({ action: 'expand', - icon: '/web-push-icon_expand.png', + icon: `/${require('../../images/web-push/web-push-icon_expand.png')}`, title: formatMessage('status.show_more', preferred_locale), }); const actionReblog = preferred_locale => ({ action: 'reblog', - icon: '/web-push-icon_reblog.png', + icon: `/${require('../../images/web-push/web-push-icon_reblog.png')}`, title: formatMessage('status.reblog', preferred_locale), }); const actionFavourite = preferred_locale => ({ action: 'favourite', - icon: '/web-push-icon_favourite.png', + icon: `/${require('../../images/web-push/web-push-icon_favourite.png')}`, title: formatMessage('status.favourite', preferred_locale), }); @@ -167,29 +163,12 @@ const removeActionFromNotification = (notification, action) => { const openUrl = url => self.clients.matchAll({ type: 'window' }).then(clientList => { - if (clientList.length !== 0) { - // : TODO : - const webClients = clientList.filter(client => /\//.test(client.url)); - - if (webClients.length !== 0) { - const client = findBestClient(webClients); - const { pathname } = new URL(url, self.location); - - // : TODO : - if (pathname.startsWith('/')) { - return client.focus().then(client => client.postMessage({ - type: 'navigate', - path: pathname.slice('/'.length - 1), - })); - } - } else if ('navigate' in clientList[0]) { // Chrome 42-48 does not support navigate - const client = findBestClient(clientList); - - return client.navigate(url).then(client => client.focus()); - } + if (clientList.length === 0) { + return self.clients.openWindow(url); + } else { + const client = findBestClient(clientList); + return client.navigate(url).then(client => client.focus()); } - - return self.clients.openWindow(url); }); const handleNotificationClick = (event) => { diff --git a/webpack/production.js b/webpack/production.js index 80defdc34..220ed8991 100644 --- a/webpack/production.js +++ b/webpack/production.js @@ -82,7 +82,7 @@ module.exports = merge(sharedConfig, { ], ServiceWorker: { cacheName: 'soapbox', - // entry: join(__dirname, '../app/soapbox/service_worker/entry.js'), + entry: join(__dirname, '../app/soapbox/service_worker/entry.js'), minify: true, }, cacheMaps: [{