Web Push

2 files changed, 61 insertions, 5 deletions

diff --git a/src/main/assets/scripts.js b/src/main/assets/scripts.js
index eecb3372..20d32fd9 100644
--- a/src/main/assets/scripts.js
+++ b/src/main/assets/scripts.js
@@ -195,11 +195,6 @@ function wsIncomingReply(msg) {
     document.getElementById('replies').appendChild(li);
 
     updateRepliesCounter();
-    var notify = new Notification(msg.user.uname, {
-        body: `${msg.replyQuote}\n${msg.body}`,
-        icon: msg.user.avatar
-    });
-    notify.onerror = console.log;
 }
 
 function newReply(e) {
@@ -530,12 +525,44 @@ function fetchUserUri(dataUri, callback) {
         });
 }
 
+const registerServiceWorker = () => {
+    const publicKey = 'BPU0LniKKR0QiaUvILPd9AystmSOU8rWDZobxKm7IJN5HYxOSQdktRdc74TZvyRS9_kyUz7LDN6gUAmAVOmObAU';
+    navigator.serviceWorker.register('/sw.js', { scope: '/' });
+    navigator.serviceWorker.ready.then(reg => {
+        reg.pushManager.subscribe({
+            userVisibleOnly: true,
+            applicationServerKey: publicKey
+        }).then(
+            sub => {
+                const body = [
+                    {
+                        type: 'web',
+                        token: JSON.stringify(sub)
+                    }
+                ];
+                fetch('/api/notifications?hash=' + document.getElementById('body').getAttribute('data-hash'), {
+                    method: 'PUT',
+                    headers: {
+                        'Content-Type': 'application/json'
+                    },
+                    credentials: 'same-origin',
+                    body: JSON.stringify(body)
+                }).then(response => {
+                    console.log(response.status);
+                });
+            },
+            err => console.error(err)
+        );
+    });
+};
+
 function notificationsCheckPermissions(button) {
     console.log(Notification.permission);
     switch (Notification.permission.toLowerCase()) {
         case 'granted':
             button.innerHTML = `${i18n('settings.notifications.granted')}`;
             button.disabled = true;
+            registerServiceWorker();
             break;
 
         case 'denied':
diff --git a/src/main/resources/static/sw.js b/src/main/resources/static/sw.js
new file mode 100644
index 00000000..48fe7787
--- /dev/null
+++ b/src/main/resources/static/sw.js
@@ -0,0 +1,29 @@
+/// <reference no-default-lib="true"/>
+/// <reference lib="esnext" />
+/// <reference lib="WebWorker" />
+
+var sw = /** @type {ServiceWorkerGlobalScope & typeof self} */ (self);
+sw.addEventListener('install', function() {
+    sw.skipWaiting();
+});
+sw.addEventListener('activate', function() {
+    sw.clients.claim();
+});
+sw.addEventListener('push', function(evt) {
+  if (evt.data) {
+    const data = evt.data.json();
+    console.log('Push', data);
+    if (data.body) {
+      sw.registration.showNotification(data.title, {
+        body: data.body,
+        icon: data.custom.message.user.avatar
+      });
+    }
+  }
+});
+sw.addEventListener('notificationclick', function(evt) {
+  evt.notification.close();
+  evt.waitUntil(
+    sw.clients.openWindow('https://juick.com/')
+  );
+});