From a8dda91c3c3508e6ddca89a2111cf8c94bbe17fc Mon Sep 17 00:00:00 2001
From: Noah Petherbridge <root@kirsle.net>
Date: Mon, 12 Aug 2024 20:41:04 -0700
Subject: [PATCH] Debug Notification API failures

---
 web/templates/account/settings.html | 92 +++++++++++++++++------------
 1 file changed, 53 insertions(+), 39 deletions(-)

diff --git a/web/templates/account/settings.html b/web/templates/account/settings.html
index 6818ef5..b041034 100644
--- a/web/templates/account/settings.html
+++ b/web/templates/account/settings.html
@@ -1561,49 +1561,63 @@ window.addEventListener("DOMContentLoaded", (event) => {
         $pushStatusDefault = document.querySelector("#push-status-default"),
         $pushEnableButton = document.querySelector("#grant-push-permission"),
         $pushDeniedHelp = document.querySelector("#push-denied-help");
+    
+    // Is the Notification API unavailable?
+    if (typeof(window.Notification) === "undefined") {
+        $pushStatusDefault.innerHTML = `<i class="fa fa-xmark mr-1"></i> Notification API unavailable`;
+        $pushStatusDefault.style.display = "";
+        return;
+    }
 
-    // Get the current permission status: default, granted, denied.
-    const showPermission = (permission) => {
-        $pushStatusGranted.style.display = "none";
-        $pushStatusDenied.style.display = "none";
-        $pushStatusDefault.style.display = "none";
-        switch (permission) {
-            case "granted":
-                $pushStatusGranted.style.display = "";
-                $pushEnableButton.innerHTML = "Test Push Notification";
-                break;
-            case "denied":
-                $pushEnableButton.style.display = "none";
-                $pushDeniedHelp.style.display = "";
-                $pushStatusDenied.style.display = "";
-                break;
-            default:
-                $pushStatusDefault.style.display = "";
-                $pushEnableButton.innerHTML = "Grant Push Notification Permission";
-                break;
-        }
-    };
-    showPermission(Notification.permission);
+    // And testing widely for errors...
+    try {
 
-    $pushEnableButton.addEventListener("click", (e) => {
-        e.preventDefault();
-        Notification.requestPermission().then(permission => {
-            // Update the displayed permission status.
-            showPermission(Notification.permission);
-
-            // If granted, subscribe to push notifications now.
-            if (permission === "granted") {
-                // In static/js/web-push.js
-                PushNotificationSubscribe();
-
-                // Test the notification now.
-                const notification = new Notification(`Hello from ${document.location.hostname}!`, {
-                    body: "This is an example notification from this site.",
-                    icon: "/static/img/favicon-192.png",
-                });
+        // Get the current permission status: default, granted, denied.
+        const showPermission = (permission) => {
+            $pushStatusGranted.style.display = "none";
+            $pushStatusDenied.style.display = "none";
+            $pushStatusDefault.style.display = "none";
+            switch (permission) {
+                case "granted":
+                    $pushStatusGranted.style.display = "";
+                    $pushEnableButton.innerHTML = "Test Push Notification";
+                    break;
+                case "denied":
+                    $pushEnableButton.style.display = "none";
+                    $pushDeniedHelp.style.display = "";
+                    $pushStatusDenied.style.display = "";
+                    break;
+                default:
+                    $pushStatusDefault.style.display = "";
+                    $pushEnableButton.innerHTML = "Grant Push Notification Permission";
+                    break;
             }
+        };
+        showPermission(Notification.permission);
+
+        $pushEnableButton.addEventListener("click", (e) => {
+            e.preventDefault();
+            Notification.requestPermission().then(permission => {
+                // Update the displayed permission status.
+                showPermission(Notification.permission);
+
+                // If granted, subscribe to push notifications now.
+                if (permission === "granted") {
+                    // In static/js/web-push.js
+                    PushNotificationSubscribe();
+
+                    // Test the notification now.
+                    const notification = new Notification(`Hello from ${document.location.hostname}!`, {
+                        body: "This is an example notification from this site.",
+                        icon: "/static/img/favicon-192.png",
+                    });
+                }
+            });
         });
-    });
+    } catch(err) {
+        $pushStatusDefault.innerHTML = `<i class="fa fa-xmark mr-1"></i> Error: ${err}`;
+        $pushStatusDefault.style.display = "block";
+    }
 });
 
 // Location tab scripts.