From 6297422515877fbf414bcb39f2f89492cfec25c9 Mon Sep 17 00:00:00 2001
From: Fred Boniface <fred@fjla.uk>
Date: Thu, 26 Jan 2023 21:10:40 +0000
Subject: [PATCH] Frontend: Initial service worker attempt

Signed-off-by: Fred Boniface <fred@fjla.uk>
---
 static/conf/nginx.conf             |  1 -
 static/{50x.html => conn-err.html} |  8 ++--
 static/js/index.js                 |  4 ++
 static/js/lib.board.js             | 17 ++++++++
 static/js/simple-board.js          | 15 ++++---
 static/sw.js                       | 63 +++++++++++++++++++++++++++++-
 6 files changed, 95 insertions(+), 13 deletions(-)
 rename static/{50x.html => conn-err.html} (85%)

diff --git a/static/conf/nginx.conf b/static/conf/nginx.conf
index 35f9fe3..aa26019 100644
--- a/static/conf/nginx.conf
+++ b/static/conf/nginx.conf
@@ -33,7 +33,6 @@ http {
             gzip_static on;
             brotli_static on;
             error_page 404 /404.html;
-            error_page 500 501 502 503 504 505 /50x.html;
         }
 
         location /api/ {
diff --git a/static/50x.html b/static/conn-err.html
similarity index 85%
rename from static/50x.html
rename to static/conn-err.html
index aa2d01e..eb492d4 100644
--- a/static/50x.html
+++ b/static/conn-err.html
@@ -23,8 +23,10 @@
         <img class="titleimg" src="/images/logo/logo-full-250.png" alt="OwlBoard Logo">
       </picture>
       <h2>Oh no!</h2>
-        <p>OwlBoard has encountered a Server Error</p>
-        <p>Try going to the <a href="/">homepage</a></p>
-        <p>Error number: 50x</p>
+        <p>OwlBoard has encountered a Connection Error</p>
+        <p>Check your data connection and try again</p>
+        <p>Go to the <a href="/">homepage</a></p>
+        <br>
+        <p>Error Code: CERR</p>
     </body>
 </html>
\ No newline at end of file
diff --git a/static/js/index.js b/static/js/index.js
index a31da24..f33ef90 100644
--- a/static/js/index.js
+++ b/static/js/index.js
@@ -1,6 +1,10 @@
 // Init:
 pageInit();
 
+if ("serviceWorker" in navigator) {
+  navigator.serviceWorker.register("/sw.js");
+}
+
 async function pageInit() {
   await loadQuickLinks();
   hideLoading(); // From lib.main
diff --git a/static/js/lib.board.js b/static/js/lib.board.js
index 4621976..93d993f 100644
--- a/static/js/lib.board.js
+++ b/static/js/lib.board.js
@@ -224,4 +224,21 @@ async function singleCall(data) {
               <td class="detail-table-content">${data.st}</td>
               <td class="detail-table-content ${time.changed}">${time.data}</td>
             </tr>`
+}
+
+/* Error Handler */
+async function errorHandler() {
+    if (sessionStorage.getItem("failcount")) {
+        var errCount = parseInt(sessionStorage.getItem("failcount"))
+    } else {
+        var errCount = 0;
+    }
+    errCount += 1;
+    sessionStorage.setItem("failcount", errCount.toString())
+    if (errCount < 10){
+        await delay(2000);
+        location.reload()
+    } else {
+        window.location.assign("conn-err.html")
+    }
 }
\ No newline at end of file
diff --git a/static/js/simple-board.js b/static/js/simple-board.js
index 2e9d35d..34d318a 100644
--- a/static/js/simple-board.js
+++ b/static/js/simple-board.js
@@ -17,15 +17,13 @@ async function init() {
         try {
             var data = await publicLdb(stn)
             setLoadingDesc(`${stn.toUpperCase()}\nParsing Data`)
-            log("init: Fetched LDB Data")
-            parseLdb(data)
+            log("simple-board.init: Fetched LDB Data", "INFO")
         } catch (err) {
-            var data = null
+            var data = "err"
             setLoadingDesc(`Handling\nError`)
-            log("init: Unable to fetch LDB data")
-            await delay(2000);
-            location.reload();
+            log(`simple-board.init: Error fetching data: ${err}`, "ERR")
         }
+        parseLdb(data)
     }
 }
 
@@ -43,13 +41,14 @@ async function parseLdb(data) {
         document.getElementById("err_no_data").style = "display:block;";
         setHeaders("No Data",new Date())
     } else if (data == "err") {  // Connection Error
+        await delay(2000);
         hideLoading();
         document.getElementById("error_notice").style = "display: block;";
         document.getElementById("err_conn").style = "display: block;";
         setHeaders("Connection Error",new Date())
         await delay(5000);
-        log(`parseLdb: Waited five seconds, reloading`)
-        location.reload()
+        log(`parseLdb: Passing to error handler`, "ERR")
+        errorHandler();
     } else {
         buildPage(data);
     }
diff --git a/static/sw.js b/static/sw.js
index 2b94a17..46ebdf1 100644
--- a/static/sw.js
+++ b/static/sw.js
@@ -1 +1,62 @@
-/* Service Worker */
\ No newline at end of file
+/* Service Worker */
+
+const appVersion = "0.0.1-dev"
+const cacheName = "owlboard0-0-1-dev"
+const cacheFiles = [
+    "/404.html",
+    "/board.html",
+    "/conn-err.html",
+    "/find-code.html",
+    "/help.html",
+    "/",
+    "/issue.html",
+    "/settings.html",
+    "/styles/fonts/firamono/firamono-500.woff2",
+    "/styles/fonts/firamono/firamono-regular.woff2",
+    "/styles/fonts/urwgothic/urwgothic.woff2",
+    "/styles/fonts/urwgothic/urwgothicDemi.woff2",
+    "/styles/boards.css",
+    "/styles/find-code.css",
+    "/styles/help.css",
+    "/styles/main.css",
+    "/styles/settings.css",
+    "/js/find-code.js",
+    "/js/index.js",
+    "/js/lib.board.js",
+    "/js/lib.main.js",
+    "/js/settings.js",
+    "/js/simple-board.js",
+    "/images/icon.svg",
+    "/images/logo/wide_logo.svg",
+    "/images/logo/mono-logo.svg",
+    "/images/nav/alert_icon.svg",
+    "/images/nav/save.svg",
+    "/images/nav/home_icon.svg",
+    "/images/nre/nre-powered_200w.webp"
+]
+
+self.addEventListener("install", (e) => {
+    console.log("[Service Worker] Install");
+    e.waitUntil(
+        (async () => {
+            const cache = await caches.open(cacheName);
+            console.log("[Service Worker] Caching app data");
+            await cache.addAll(cacheFiles);
+        })()
+    );
+  });
+
+  self.addEventListener("fetch", (e) => {
+    e.respondWith(
+      (async () => {
+        const r = await caches.match(e.request);
+        console.log(`[Service Worker] Fetching resource: ${e.request.url}`);
+        if (r) {
+          return r;
+        }
+        const response = await fetch(e.request);
+        console.log(`[Service Worker] Fetching from server: ${e.request.url}`);
+        return response;
+      })()
+    );
+  });
\ No newline at end of file