From 1be4280887bbabd7ea6a9f99ce4334b94114a250 Mon Sep 17 00:00:00 2001
From: "Devani, Aarshad (US-Hyderabad)" <aadevani@deloitte.com>
Date: Thu, 28 Nov 2019 18:19:03 +0530
Subject: [PATCH 1/8] adding notifications

---
 _includes/head.html        |  4 +++
 _includes/scripts.html     |  1 +
 assets/js/notifications.js | 66 ++++++++++++++++++++++++++++++++++++++
 3 files changed, 71 insertions(+)
 create mode 100644 assets/js/notifications.js

diff --git a/_includes/head.html b/_includes/head.html
index 45e0a26..7a3ed53 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -54,6 +54,10 @@
 	<link id="theme-style" rel="stylesheet" href="{{ site.baseurl }}assets/css/main.css">
 	<!-- Global site tag (gtag.js) - Google Analytics -->
 	<script async src="https://www.googletagmanager.com/gtag/js?id=UA-148993906-1"></script>
+	<!-- Firebase Related -->
+	<script src="https://www.gstatic.com/firebasejs/7.4.0/firebase-app.js"></script>
+	<script src="https://www.gstatic.com/firebasejs/7.4.0/firebase-messaging.js"></script>
+	
 	<script>
 	window.dataLayer = window.dataLayer || [];
 	function gtag(){dataLayer.push(arguments);}
diff --git a/_includes/scripts.html b/_includes/scripts.html
index 54fd756..0ead42c 100644
--- a/_includes/scripts.html
+++ b/_includes/scripts.html
@@ -5,4 +5,5 @@
 <script src="assets/plugins/back-to-top.js"></script>
 <script src="assets/plugins/jquery.scrollTo.min.js"></script>
 <script src="assets/js/main.js"></script>
+<script src="assets/js/notifications.js"></script>
 <script>var speakers = {{ site.data.speakers | jsonify }};</script>
diff --git a/assets/js/notifications.js b/assets/js/notifications.js
new file mode 100644
index 0000000..4b4a385
--- /dev/null
+++ b/assets/js/notifications.js
@@ -0,0 +1,66 @@
+// Retrieve Firebase Messaging object.
+const publicVapidKey =
+  "BAK9aUUilxzljIZVaKm8gjt6MWYsXQFbhluMMCFCddHbWug4_H48Q4XtbCwBSPZ9V3wcNUGr92twrEbmGMyABKU";
+const firebaseConfig = {
+  apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
+  authDomain: "pyconhyd.firebaseapp.com",
+  databaseURL: "https://pyconhyd.firebaseio.com",
+  projectId: "pyconhyd",
+  storageBucket: "pyconhyd.appspot.com",
+  messagingSenderId: "254977934750",
+  appId: "1:254977934750:web:9f1ad0357425e5718d828f"
+};
+firebase.initializeApp(firebaseConfig);
+const messaging = firebase.messaging();
+messaging.usePublicVapidKey(publicVapidKey);
+Notification.requestPermission().then(permission => {
+  if (permission === "granted") {
+    console.log("Notification permission granted.");
+    // TODO(developer): Retrieve an Instance ID token for use with FCM.
+    // ...
+    messaging
+      .getToken()
+      .then(currentToken => {
+        if (currentToken) {
+          sendTokenToServer(currentToken);
+          updateUIForPushEnabled(currentToken);
+        } else {
+          // Show permission request.
+          console.log(
+            "No Instance ID token available. Request permission to generate one."
+          );
+          // Show permission UI.
+          updateUIForPushPermissionRequired();
+          setTokenSentToServer(false);
+        }
+      })
+      .catch(err => {
+        console.log("An error occurred while retrieving token. ", err);
+        showToken("Error retrieving Instance ID token. ", err);
+        setTokenSentToServer(false);
+      });
+
+    // Callback fired if Instance ID token is updated.
+    messaging.onTokenRefresh(() => {
+      messaging
+        .getToken()
+        .then(refreshedToken => {
+          console.log("Token refreshed.");
+          // Indicate that the new Instance ID token has not yet been sent to the
+          // app server.
+          setTokenSentToServer(false);
+          // Send Instance ID token to app server.
+          sendTokenToServer(refreshedToken);
+          // ...
+        })
+        .catch(err => {
+          console.log("Unable to retrieve refreshed token ", err);
+          showToken("Unable to retrieve refreshed token ", err);
+        });
+    });
+  } else {
+    console.log("Unable to get permission to notify.");
+  }
+});
+// Get Instance ID token. Initially this makes a network call, once retrieved
+// subsequent calls to getToken will return from cache.

From 5aa603709ff810d36ddb1334c333eb97ade77bcb Mon Sep 17 00:00:00 2001
From: Aarshad Devani <addy@Aarshads-MacBook-Pro.local>
Date: Sun, 1 Dec 2019 11:30:57 +0530
Subject: [PATCH 2/8] adding notification related changes

---
 assets/js/notifications.js | 191 +++++++++++++++++++++++++++++--------
 service-worker.js          |  53 ++++++----
 2 files changed, 186 insertions(+), 58 deletions(-)

diff --git a/assets/js/notifications.js b/assets/js/notifications.js
index 4b4a385..7b9e755 100644
--- a/assets/js/notifications.js
+++ b/assets/js/notifications.js
@@ -13,54 +13,161 @@ const firebaseConfig = {
 firebase.initializeApp(firebaseConfig);
 const messaging = firebase.messaging();
 messaging.usePublicVapidKey(publicVapidKey);
-Notification.requestPermission().then(permission => {
-  if (permission === "granted") {
-    console.log("Notification permission granted.");
-    // TODO(developer): Retrieve an Instance ID token for use with FCM.
-    // ...
-    messaging
-      .getToken()
-      .then(currentToken => {
-        if (currentToken) {
-          sendTokenToServer(currentToken);
-          updateUIForPushEnabled(currentToken);
-        } else {
-          // Show permission request.
-          console.log(
-            "No Instance ID token available. Request permission to generate one."
-          );
-          // Show permission UI.
-          updateUIForPushPermissionRequired();
-          setTokenSentToServer(false);
-        }
-      })
-      .catch(err => {
-        console.log("An error occurred while retrieving token. ", err);
-        showToken("Error retrieving Instance ID token. ", err);
+
+const tokenDivId = "token_div";
+const permissionDivId = "permission_div";
+
+messaging.onTokenRefresh(() => {
+  messaging
+    .getToken()
+    .then(refreshedToken => {
+      console.log("Token refreshed.");
+      setTokenSentToServer(false);
+      sendTokenToServer(refreshedToken);
+      // Display new Instance ID token and clear UI of all previous messages.
+      resetUI();
+    })
+    .catch(err => {
+      console.log("Unable to retrieve refreshed token ", err);
+      showToken("Unable to retrieve refreshed token ", err);
+    });
+});
+
+messaging.onMessage(payload => {
+  console.log("Message received. ", payload);
+  // Update the UI to include the received message.
+  appendMessage(payload);
+});
+
+function resetUI() {
+  clearMessages();
+  showToken("loading...");
+  // [START get_token]
+  // Get Instance ID token. Initially this makes a network call, once retrieved
+  // subsequent calls to getToken will return from cache.
+  messaging
+    .getToken()
+    .then(currentToken => {
+      if (currentToken) {
+        sendTokenToServer(currentToken);
+        updateUIForPushEnabled(currentToken);
+      } else {
+        // Show permission request.
+        console.log(
+          "No Instance ID token available. Request permission to generate one."
+        );
+        // Show permission UI.
+        updateUIForPushPermissionRequired();
         setTokenSentToServer(false);
-      });
+      }
+    })
+    .catch(err => {
+      console.log("An error occurred while retrieving token. ", err);
+      showToken("Error retrieving Instance ID token. ", err);
+      setTokenSentToServer(false);
+    });
+}
+
+// [TODO] - write code here to show on UI, this is not exactly notification handled
+function showToken(currentToken) {
+  // Show token in console and UI.
+  const tokenElement = document.querySelector("#token");
+  tokenElement.textContent = currentToken;
+}
+
+function sendTokenToServer(currentToken) {
+  if (!isTokenSentToServer()) {
+    console.log("Sending token to server...");
+    // TODO(developer): Send the current token to your server.
+    setTokenSentToServer(true);
+  } else {
+    console.log(
+      "Token already sent to server so won't send it again " +
+        "unless it changes"
+    );
+  }
+}
+function isTokenSentToServer() {
+  return window.localStorage.getItem("sentToServer") === "1";
+}
 
-    // Callback fired if Instance ID token is updated.
-    messaging.onTokenRefresh(() => {
+function setTokenSentToServer(sent) {
+  window.localStorage.setItem("sentToServer", sent ? "1" : "0");
+}
+
+function showHideDiv(divId, show) {
+  const div = document.querySelector("#" + divId);
+  if (show) {
+    div.style = "display: visible";
+  } else {
+    div.style = "display: none";
+  }
+}
+
+function requestPermission() {
+  console.log("Requesting permission...");
+  // [START request_permission]
+  Notification.requestPermission().then(permission => {
+    if (permission === "granted") {
+      console.log("Notification permission granted.");
+      resetUI();
+    } else {
+      console.log("Unable to get permission to notify.");
+    }
+  });
+}
+
+function deleteToken() {
+  // Delete Instance ID token.
+  messaging
+    .getToken()
+    .then(currentToken => {
       messaging
-        .getToken()
-        .then(refreshedToken => {
-          console.log("Token refreshed.");
-          // Indicate that the new Instance ID token has not yet been sent to the
-          // app server.
+        .deleteToken(currentToken)
+        .then(() => {
+          console.log("Token deleted.");
           setTokenSentToServer(false);
-          // Send Instance ID token to app server.
-          sendTokenToServer(refreshedToken);
-          // ...
+          // Once token is deleted update UI.
+          resetUI();
         })
         .catch(err => {
-          console.log("Unable to retrieve refreshed token ", err);
-          showToken("Unable to retrieve refreshed token ", err);
+          console.log("Unable to delete token. ", err);
         });
+    })
+    .catch(err => {
+      console.log("Error retrieving Instance ID token. ", err);
+      showToken("Error retrieving Instance ID token. ", err);
     });
-  } else {
-    console.log("Unable to get permission to notify.");
+}
+
+// [TODO] - Write code to show custom UI Notification for website
+function appendMessage(payload) {
+  const messagesElement = document.querySelector("#messages");
+  const dataHeaderELement = document.createElement("h5");
+  const dataElement = document.createElement("pre");
+  dataElement.style = "overflow-x:hidden;";
+  dataHeaderELement.textContent = "Received message:";
+  dataElement.textContent = JSON.stringify(payload, null, 2);
+  messagesElement.appendChild(dataHeaderELement);
+  messagesElement.appendChild(dataElement);
+}
+
+function clearMessages() {
+  const messagesElement = document.querySelector("#messages");
+  while (messagesElement.hasChildNodes()) {
+    messagesElement.removeChild(messagesElement.lastChild);
   }
-});
-// Get Instance ID token. Initially this makes a network call, once retrieved
-// subsequent calls to getToken will return from cache.
+}
+
+function updateUIForPushEnabled(currentToken) {
+  showHideDiv(tokenDivId, true);
+  showHideDiv(permissionDivId, false);
+  showToken(currentToken);
+}
+
+function updateUIForPushPermissionRequired() {
+  showHideDiv(tokenDivId, false);
+  showHideDiv(permissionDivId, true);
+}
+
+resetUI();
diff --git a/service-worker.js b/service-worker.js
index ede502e..34e7a3f 100644
--- a/service-worker.js
+++ b/service-worker.js
@@ -1,55 +1,76 @@
-importScripts('https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js');
+importScripts(
+  "https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js"
+);
+importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js");
+importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-messaging.js");
 
 if (workbox) {
-
   workbox.routing.registerRoute(
     /\.(?:js|css)$/,
     new workbox.strategies.StaleWhileRevalidate({
-      cacheName: 'static-resources',
+      cacheName: "static-resources"
     })
   );
-  
   workbox.routing.registerRoute(
     // Cache image files.
     /\.(?:png|jpg|jpeg|svg|gif)$/,
     // Use the cache if it's available.
     new workbox.strategies.CacheFirst({
       // Use a custom cache name.
-      cacheName: 'image-cache',
+      cacheName: "image-cache",
       plugins: [
         new workbox.expiration.Plugin({
           // Cache only 20 images.
           maxEntries: 20,
           // Cache for a maximum of a week.
-          maxAgeSeconds: 7 * 24 * 60 * 60,
+          maxAgeSeconds: 7 * 24 * 60 * 60
         })
-      ],
+      ]
     })
   );
-
   // Cache the Google Fonts stylesheets with a stale-while-revalidate strategy.
   workbox.routing.registerRoute(
     /^https:\/\/fonts\.googleapis\.com/,
     new workbox.strategies.StaleWhileRevalidate({
-      cacheName: 'google-fonts-stylesheets',
+      cacheName: "google-fonts-stylesheets"
     })
   );
-
   // Cache the underlying font files with a cache-first strategy for 1 year.
   workbox.routing.registerRoute(
     /^https:\/\/fonts\.gstatic\.com/,
     new workbox.strategies.CacheFirst({
-      cacheName: 'google-fonts-webfonts',
+      cacheName: "google-fonts-webfonts",
       plugins: [
         new workbox.cacheableResponse.Plugin({
-          statuses: [0, 200],
+          statuses: [0, 200]
         }),
         new workbox.expiration.Plugin({
           maxAgeSeconds: 60 * 60 * 24 * 365,
-          maxEntries: 30,
-        }),
-      ],
+          maxEntries: 30
+        })
+      ]
     })
   );
+}
+
+firebase.initializeApp({
+  messagingSenderId: "254977934750"
+});
+const messaging = firebase.messaging();
+messaging.setBackgroundMessageHandler(function(payload) {
+  console.log(
+    "[firebase-messaging-sw.js] Received background message ",
+    payload
+  );
+  // Customize notification here
+  const notificationTitle = "Background Message Title";
+  const notificationOptions = {
+    body: "Background Message body.",
+    icon: "/firebase-logo.png"
+  };
 
-}
\ No newline at end of file
+  return self.registration.showNotification(
+    notificationTitle,
+    notificationOptions
+  );
+});

From a0a72966939017d18a8067573e5c7cfb919e2264 Mon Sep 17 00:00:00 2001
From: Aarshad Devani <addy@Aarshads-MacBook-Pro.local>
Date: Sun, 1 Dec 2019 11:51:27 +0530
Subject: [PATCH 3/8] adding firebase notification system

---
 README.md                  |  1 +
 assets/js/notifications.js | 50 ++++++++++++++++++-----------------
 firebase-messaging-sw.js   | 24 +++++++++++++++++
 service-worker.js          | 53 ++++++++++++--------------------------
 4 files changed, 67 insertions(+), 61 deletions(-)
 create mode 100644 firebase-messaging-sw.js

diff --git a/README.md b/README.md
index 230613f..e30fe0c 100644
--- a/README.md
+++ b/README.md
@@ -56,6 +56,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
     <td align="center"><a href="http://bhansa.github.io"><img src="https://avatars0.githubusercontent.com/u/9723884?v=4" width="100px;" alt="Bharat Saraswat"/><br /><sub><b>Bharat Saraswat</b></sub></a><br /><a href="https://github.com/HydPy/hydpyconf2019/commits?author=bhansa" title="Code">💻</a> <a href="#design-bhansa" title="Design">🎨</a> <a href="#ideas-bhansa" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/HydPy/hydpyconf2019/issues?q=author%3Abhansa" title="Bug reports">🐛</a> <a href="#review-bhansa" title="Reviewed Pull Requests">👀</a> <a href="https://github.com/HydPy/hydpyconf2019/commits?author=bhansa" title="Tests">⚠️</a> <a href="#content-bhansa" title="Content">🖋</a> <a href="#maintenance-bhansa" title="Maintenance">🚧</a></td>
     <td align="center"><a href="https://ilovefoss.wordpress.com/"><img src="https://avatars1.githubusercontent.com/u/10486343?v=4" width="100px;" alt="Ananyo Maiti"/><br /><sub><b>Ananyo Maiti</b></sub></a><br /><a href="https://github.com/HydPy/hydpyconf2019/commits?author=ananyo2012" title="Code">💻</a> <a href="#review-ananyo2012" title="Reviewed Pull Requests">👀</a> <a href="https://github.com/HydPy/hydpyconf2019/issues?q=author%3Aananyo2012" title="Bug reports">🐛</a> <a href="#content-ananyo2012" title="Content">🖋</a> <a href="#infra-ananyo2012" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a> <a href="#maintenance-ananyo2012" title="Maintenance">🚧</a></td>
     <td align="center"><a href="https://github.com/aditya-369"><img src="https://avatars0.githubusercontent.com/u/16273418?v=4" width="100px;" alt="aditya_369"/><br /><sub><b>aditya_369</b></sub></a><br /><a href="https://github.com/HydPy/hydpyconf2019/commits?author=aditya-369" title="Code">💻</a></td>
+    <td align="center"><a href="https://aarshad.com"><img src="https://avatars0.githubusercontent.com/u/8903070?&v=4" width="100px;" alt="Aarshad Devani"/><br /><sub><b>Aarshad Devani</b></sub></a><br /><a href="https://github.com/HydPy/hydpyconf2019/commits?author=aarshad786" title="Code">💻</a></td>
   </tr>
 </table>
 
diff --git a/assets/js/notifications.js b/assets/js/notifications.js
index 7b9e755..b98f632 100644
--- a/assets/js/notifications.js
+++ b/assets/js/notifications.js
@@ -2,13 +2,13 @@
 const publicVapidKey =
   "BAK9aUUilxzljIZVaKm8gjt6MWYsXQFbhluMMCFCddHbWug4_H48Q4XtbCwBSPZ9V3wcNUGr92twrEbmGMyABKU";
 const firebaseConfig = {
-  apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
-  authDomain: "pyconhyd.firebaseapp.com",
-  databaseURL: "https://pyconhyd.firebaseio.com",
-  projectId: "pyconhyd",
-  storageBucket: "pyconhyd.appspot.com",
+  // apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
+  // authDomain: "pyconhyd.firebaseapp.com",
+  // databaseURL: "https://pyconhyd.firebaseio.com",
+  // projectId: "pyconhyd",
+  // storageBucket: "pyconhyd.appspot.com",
   messagingSenderId: "254977934750",
-  appId: "1:254977934750:web:9f1ad0357425e5718d828f"
+  // appId: "1:254977934750:web:9f1ad0357425e5718d828f"
 };
 firebase.initializeApp(firebaseConfig);
 const messaging = firebase.messaging();
@@ -42,9 +42,6 @@ messaging.onMessage(payload => {
 function resetUI() {
   clearMessages();
   showToken("loading...");
-  // [START get_token]
-  // Get Instance ID token. Initially this makes a network call, once retrieved
-  // subsequent calls to getToken will return from cache.
   messaging
     .getToken()
     .then(currentToken => {
@@ -72,7 +69,7 @@ function resetUI() {
 function showToken(currentToken) {
   // Show token in console and UI.
   const tokenElement = document.querySelector("#token");
-  tokenElement.textContent = currentToken;
+  !!tokenElement && (tokenElement.textContent = currentToken);
 }
 
 function sendTokenToServer(currentToken) {
@@ -97,10 +94,12 @@ function setTokenSentToServer(sent) {
 
 function showHideDiv(divId, show) {
   const div = document.querySelector("#" + divId);
-  if (show) {
-    div.style = "display: visible";
-  } else {
-    div.style = "display: none";
+  if (!!div) {
+    if (show) {
+      div.style = "display: visible";
+    } else {
+      div.style = "display: none";
+    }
   }
 }
 
@@ -142,20 +141,23 @@ function deleteToken() {
 
 // [TODO] - Write code to show custom UI Notification for website
 function appendMessage(payload) {
-  const messagesElement = document.querySelector("#messages");
-  const dataHeaderELement = document.createElement("h5");
-  const dataElement = document.createElement("pre");
-  dataElement.style = "overflow-x:hidden;";
-  dataHeaderELement.textContent = "Received message:";
-  dataElement.textContent = JSON.stringify(payload, null, 2);
-  messagesElement.appendChild(dataHeaderELement);
-  messagesElement.appendChild(dataElement);
+  // const messagesElement = document.querySelector("#messages");
+  // const dataHeaderELement = document.createElement("h5");
+  // const dataElement = document.createElement("pre");
+  // dataElement.style = "overflow-x:hidden;";
+  // dataHeaderELement.textContent = "Received message:";
+  // dataElement.textContent = JSON.stringify(payload, null, 2);
+  // messagesElement.appendChild(dataHeaderELement);
+  // messagesElement.appendChild(dataElement);
+  window.alert(JSON.stringify(payload.notification, null, 2));
 }
 
 function clearMessages() {
   const messagesElement = document.querySelector("#messages");
-  while (messagesElement.hasChildNodes()) {
-    messagesElement.removeChild(messagesElement.lastChild);
+  if (!!messagesElement) {
+    while (messagesElement.hasChildNodes()) {
+      messagesElement.removeChild(messagesElement.lastChild);
+    }
   }
 }
 
diff --git a/firebase-messaging-sw.js b/firebase-messaging-sw.js
new file mode 100644
index 0000000..bf936c4
--- /dev/null
+++ b/firebase-messaging-sw.js
@@ -0,0 +1,24 @@
+importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js");
+importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-messaging.js");
+
+firebase.initializeApp({
+  messagingSenderId: "254977934750"
+});
+const messaging = firebase.messaging();
+messaging.setBackgroundMessageHandler(function(payload) {
+  console.log(
+    "[firebase-messaging-sw.js] Received background message ",
+    payload
+  );
+  // Customize notification here
+  const notificationTitle = payload.notification.title;
+  const notificationOptions = {
+    body: payload.notification.body,
+    icon: payload.notification.image || "/favion.ico"
+  };
+
+  return self.registration.showNotification(
+    notificationTitle,
+    notificationOptions
+  );
+});
diff --git a/service-worker.js b/service-worker.js
index 34e7a3f..ede502e 100644
--- a/service-worker.js
+++ b/service-worker.js
@@ -1,76 +1,55 @@
-importScripts(
-  "https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js"
-);
-importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js");
-importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-messaging.js");
+importScripts('https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-sw.js');
 
 if (workbox) {
+
   workbox.routing.registerRoute(
     /\.(?:js|css)$/,
     new workbox.strategies.StaleWhileRevalidate({
-      cacheName: "static-resources"
+      cacheName: 'static-resources',
     })
   );
+  
   workbox.routing.registerRoute(
     // Cache image files.
     /\.(?:png|jpg|jpeg|svg|gif)$/,
     // Use the cache if it's available.
     new workbox.strategies.CacheFirst({
       // Use a custom cache name.
-      cacheName: "image-cache",
+      cacheName: 'image-cache',
       plugins: [
         new workbox.expiration.Plugin({
           // Cache only 20 images.
           maxEntries: 20,
           // Cache for a maximum of a week.
-          maxAgeSeconds: 7 * 24 * 60 * 60
+          maxAgeSeconds: 7 * 24 * 60 * 60,
         })
-      ]
+      ],
     })
   );
+
   // Cache the Google Fonts stylesheets with a stale-while-revalidate strategy.
   workbox.routing.registerRoute(
     /^https:\/\/fonts\.googleapis\.com/,
     new workbox.strategies.StaleWhileRevalidate({
-      cacheName: "google-fonts-stylesheets"
+      cacheName: 'google-fonts-stylesheets',
     })
   );
+
   // Cache the underlying font files with a cache-first strategy for 1 year.
   workbox.routing.registerRoute(
     /^https:\/\/fonts\.gstatic\.com/,
     new workbox.strategies.CacheFirst({
-      cacheName: "google-fonts-webfonts",
+      cacheName: 'google-fonts-webfonts',
       plugins: [
         new workbox.cacheableResponse.Plugin({
-          statuses: [0, 200]
+          statuses: [0, 200],
         }),
         new workbox.expiration.Plugin({
           maxAgeSeconds: 60 * 60 * 24 * 365,
-          maxEntries: 30
-        })
-      ]
+          maxEntries: 30,
+        }),
+      ],
     })
   );
-}
-
-firebase.initializeApp({
-  messagingSenderId: "254977934750"
-});
-const messaging = firebase.messaging();
-messaging.setBackgroundMessageHandler(function(payload) {
-  console.log(
-    "[firebase-messaging-sw.js] Received background message ",
-    payload
-  );
-  // Customize notification here
-  const notificationTitle = "Background Message Title";
-  const notificationOptions = {
-    body: "Background Message body.",
-    icon: "/firebase-logo.png"
-  };
 
-  return self.registration.showNotification(
-    notificationTitle,
-    notificationOptions
-  );
-});
+}
\ No newline at end of file

From c100b6d5563f963e4c9782d067f9687b7e064b85 Mon Sep 17 00:00:00 2001
From: Aarshad Devani <addy@Aarshads-MacBook-Pro.local>
Date: Sun, 1 Dec 2019 11:52:01 +0530
Subject: [PATCH 4/8] removing extra commented code

---
 assets/js/notifications.js | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/assets/js/notifications.js b/assets/js/notifications.js
index b98f632..c6ec14f 100644
--- a/assets/js/notifications.js
+++ b/assets/js/notifications.js
@@ -1,14 +1,7 @@
-// Retrieve Firebase Messaging object.
 const publicVapidKey =
   "BAK9aUUilxzljIZVaKm8gjt6MWYsXQFbhluMMCFCddHbWug4_H48Q4XtbCwBSPZ9V3wcNUGr92twrEbmGMyABKU";
 const firebaseConfig = {
-  // apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
-  // authDomain: "pyconhyd.firebaseapp.com",
-  // databaseURL: "https://pyconhyd.firebaseio.com",
-  // projectId: "pyconhyd",
-  // storageBucket: "pyconhyd.appspot.com",
   messagingSenderId: "254977934750",
-  // appId: "1:254977934750:web:9f1ad0357425e5718d828f"
 };
 firebase.initializeApp(firebaseConfig);
 const messaging = firebase.messaging();

From b15d8af05929165abe2205d961f2d78940dd8345 Mon Sep 17 00:00:00 2001
From: Aarshad Devani <addy@Aarshads-MacBook-Pro.local>
Date: Sun, 1 Dec 2019 12:18:41 +0530
Subject: [PATCH 5/8] request persmission

---
 assets/js/notifications.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/assets/js/notifications.js b/assets/js/notifications.js
index c6ec14f..446cfea 100644
--- a/assets/js/notifications.js
+++ b/assets/js/notifications.js
@@ -1,7 +1,7 @@
 const publicVapidKey =
   "BAK9aUUilxzljIZVaKm8gjt6MWYsXQFbhluMMCFCddHbWug4_H48Q4XtbCwBSPZ9V3wcNUGr92twrEbmGMyABKU";
 const firebaseConfig = {
-  messagingSenderId: "254977934750",
+  messagingSenderId: "254977934750"
 };
 firebase.initializeApp(firebaseConfig);
 const messaging = firebase.messaging();
@@ -98,7 +98,6 @@ function showHideDiv(divId, show) {
 
 function requestPermission() {
   console.log("Requesting permission...");
-  // [START request_permission]
   Notification.requestPermission().then(permission => {
     if (permission === "granted") {
       console.log("Notification permission granted.");
@@ -163,6 +162,7 @@ function updateUIForPushEnabled(currentToken) {
 function updateUIForPushPermissionRequired() {
   showHideDiv(tokenDivId, false);
   showHideDiv(permissionDivId, true);
+  requestPermission();
 }
 
 resetUI();

From cd2330ac8841c12f384b62faaaa9d6453736c0df Mon Sep 17 00:00:00 2001
From: Aarshad Devani <addy@Aarshads-MacBook-Pro.local>
Date: Sun, 1 Dec 2019 12:23:43 +0530
Subject: [PATCH 6/8] adding full firebase config

---
 assets/js/notifications.js |  8 +++++++-
 firebase-messaging-sw.js   | 10 ++++++++--
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/assets/js/notifications.js b/assets/js/notifications.js
index 446cfea..37fa95a 100644
--- a/assets/js/notifications.js
+++ b/assets/js/notifications.js
@@ -1,7 +1,13 @@
 const publicVapidKey =
   "BAK9aUUilxzljIZVaKm8gjt6MWYsXQFbhluMMCFCddHbWug4_H48Q4XtbCwBSPZ9V3wcNUGr92twrEbmGMyABKU";
 const firebaseConfig = {
-  messagingSenderId: "254977934750"
+  apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
+  authDomain: "pyconhyd.firebaseapp.com",
+  databaseURL: "https://pyconhyd.firebaseio.com",
+  projectId: "pyconhyd",
+  storageBucket: "pyconhyd.appspot.com",
+  messagingSenderId: "254977934750",
+  appId: "1:254977934750:web:9f1ad0357425e5718d828f"
 };
 firebase.initializeApp(firebaseConfig);
 const messaging = firebase.messaging();
diff --git a/firebase-messaging-sw.js b/firebase-messaging-sw.js
index bf936c4..faaea41 100644
--- a/firebase-messaging-sw.js
+++ b/firebase-messaging-sw.js
@@ -2,8 +2,14 @@ importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js");
 importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-messaging.js");
 
 firebase.initializeApp({
-  messagingSenderId: "254977934750"
-});
+    apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
+    authDomain: "pyconhyd.firebaseapp.com",
+    databaseURL: "https://pyconhyd.firebaseio.com",
+    projectId: "pyconhyd",
+    storageBucket: "pyconhyd.appspot.com",
+    messagingSenderId: "254977934750",
+    appId: "1:254977934750:web:9f1ad0357425e5718d828f"
+  };
 const messaging = firebase.messaging();
 messaging.setBackgroundMessageHandler(function(payload) {
   console.log(

From a414cbbc1ca8864057d1c8b2aba95b711ab60c61 Mon Sep 17 00:00:00 2001
From: Aarshad Devani <addy@Aarshads-MacBook-Pro.local>
Date: Sun, 1 Dec 2019 12:29:05 +0530
Subject: [PATCH 7/8] missed a brace

---
 firebase-messaging-sw.js | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/firebase-messaging-sw.js b/firebase-messaging-sw.js
index faaea41..24353c1 100644
--- a/firebase-messaging-sw.js
+++ b/firebase-messaging-sw.js
@@ -2,14 +2,14 @@ importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js");
 importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-messaging.js");
 
 firebase.initializeApp({
-    apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
-    authDomain: "pyconhyd.firebaseapp.com",
-    databaseURL: "https://pyconhyd.firebaseio.com",
-    projectId: "pyconhyd",
-    storageBucket: "pyconhyd.appspot.com",
-    messagingSenderId: "254977934750",
-    appId: "1:254977934750:web:9f1ad0357425e5718d828f"
-  };
+  apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
+  authDomain: "pyconhyd.firebaseapp.com",
+  databaseURL: "https://pyconhyd.firebaseio.com",
+  projectId: "pyconhyd",
+  storageBucket: "pyconhyd.appspot.com",
+  messagingSenderId: "254977934750",
+  appId: "1:254977934750:web:9f1ad0357425e5718d828f"
+});
 const messaging = firebase.messaging();
 messaging.setBackgroundMessageHandler(function(payload) {
   console.log(

From b55341507245e3d04a6dc534cf520df877e444ef Mon Sep 17 00:00:00 2001
From: Aarshad Devani <addy@Aarshads-MacBook-Pro.local>
Date: Sun, 1 Dec 2019 12:47:04 +0530
Subject: [PATCH 8/8] removing Window.alert

---
 assets/js/notifications.js | 1 -
 firebase-messaging-sw.js   | 5 +++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/assets/js/notifications.js b/assets/js/notifications.js
index 37fa95a..c7ac200 100644
--- a/assets/js/notifications.js
+++ b/assets/js/notifications.js
@@ -147,7 +147,6 @@ function appendMessage(payload) {
   // dataElement.textContent = JSON.stringify(payload, null, 2);
   // messagesElement.appendChild(dataHeaderELement);
   // messagesElement.appendChild(dataElement);
-  window.alert(JSON.stringify(payload.notification, null, 2));
 }
 
 function clearMessages() {
diff --git a/firebase-messaging-sw.js b/firebase-messaging-sw.js
index 24353c1..b4b0621 100644
--- a/firebase-messaging-sw.js
+++ b/firebase-messaging-sw.js
@@ -1,7 +1,7 @@
 importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js");
 importScripts("https://www.gstatic.com/firebasejs/7.5.0/firebase-messaging.js");
 
-firebase.initializeApp({
+const firebaseConfig = {
   apiKey: "AIzaSyCZ8gbWs9FLlzw93BOj_OQzlWwd_F1N-IY",
   authDomain: "pyconhyd.firebaseapp.com",
   databaseURL: "https://pyconhyd.firebaseio.com",
@@ -9,7 +9,8 @@ firebase.initializeApp({
   storageBucket: "pyconhyd.appspot.com",
   messagingSenderId: "254977934750",
   appId: "1:254977934750:web:9f1ad0357425e5718d828f"
-});
+};
+firebase.initializeApp(firebaseConfig);
 const messaging = firebase.messaging();
 messaging.setBackgroundMessageHandler(function(payload) {
   console.log(