diff --git a/service-worker.js b/service-worker.js index 5c95131b..4ee1fc15 100644 --- a/service-worker.js +++ b/service-worker.js @@ -5,13 +5,68 @@ importScripts("/firebase-init.js") firebase.initializeApp(FIREBASE_INIT); +// This method shows the notifications. firebase.messaging().setBackgroundMessageHandler(function(payload) { - let title = payload.notification.title || "New message"; + let title = payload.data.title || "New message"; let options = { - body: payload.notification.body || "", - icon: '/img/logo96.png' + body: payload.data.content || "", + icon: '/img/logo96.png', + badge: '/img/badge96.png', + tag: payload.data.topic || undefined, + data: { + topic: payload.data.topic + } }; - console.log("background message", payload); - return self.registration.showNotification(title, options); }); + + +// This code handles a click on notification: takes +// the user to the browser tab with the chat or opens a new tab. +self.addEventListener('notificationclick', function(event) { + console.log('On notification click: ', event.notification); + + const notification = event.notification; + notification.close(); + + const urlHash = '#/' + notification.data.topic; + + const promises = self.clients.matchAll({ + type: 'window', + includeUncontrolled: true + }).then((windowClients) => { + let matchingClient = null; + let anyClient = null; + for (let i = 0; i < windowClients.length; i++) { + const url = new URL(windowClients[i].url); + console.log('found client with URL', url); + if (url.hash.includes(notification.data.topic)) { + matchingClient = windowClients[i]; + break; + } else { + anyClient = windowClients[i]; + } + } + + // Found browser tab with the topic already open. + if (matchingClient) { + return matchingClient.focus(); + } + + // Found browser tab with Tinode on a different topic, + // navigate to the right topic. + if (anyClient) { + const url = new URL(anyClient.url); + url.hash = '#/' + notification.data.topic; + return anyClient.navigate(url).then(() => { return anyClient.focus(); }); + } + + // Did not find a Tinode browser tab. Open one. + const url = new URL(self.location.origin); + url.hash = '#/' + notification.data.topic; + return clients.openWindow(url); + + }); + + event.waitUntil(promises); +});