Added Service worker for notification on mobile phones

app/assets/javascripts/channels/user_notification.js

@@ -4,6 +4,7 @@ App.room = App.cable.subscriptions.create('UserNotificationChannel',{
     disconnected: function(){
     },
     received: function(data) {
+        navigator.serviceWorker.register('/sw.js');
         // Called when there's incoming data on the websocket for this channel
         // Let's check if the browser supports notifications
         if (!("Notification" in window)) {
@@ -12,11 +13,9 @@ App.room = App.cable.subscriptions.create('UserNotificationChannel',{
         // Let's check whether notification permissions have already been granted
         else if (Notification.permission === "granted") {
             // If it's okay let's create a notification
-           var notification = new Notification(data.notification.title, data.notification.option);
-           notification.onclick = function(event) {
-                event.preventDefault(); // prevent the browser from focusing the Notification's tab
-                window.open(data.notification.path, '_blank');
-            }
+            navigator.serviceWorker.ready.then(function(registration) {
+                registration.showNotification(data.notification.title, data.notification.option);
+            });
         }
     }
 });

app/models/comment.rb

@@ -154,8 +154,8 @@ def notify(current_user)
   def send_browser_notification(users_ids)
     notification = Hash.new
     notification[:title] = "New Comment on #{parent.title}"
-    notification[:path] = parent.path
     option = {
+      data: parent.path,
       body: comment,
       icon: "https://publiclab.org/logo.png"
     }

public/sw.js

@@ -0,0 +1,20 @@
+self.onnotificationclick = function (event) {
+  // return clients.openWindow(event.notification.data);
+    // This looks to see if the current is already open and
+    // focuses if it is
+    event.waitUntil(
+        clients.matchAll({
+            type: "window"
+        }).then(function(clientList) {
+                for (var i = 0; i < clientList.length; i++) {
+                    var client = clientList[i];
+                    if (client.url == '/' && 'focus' in client)
+                        return client.focus();
+                }
+                if (clients.openWindow) {
+                    return clients.openWindow(event.notification.data);
+                }
+            })
+    );
+
+};