Try and fix but broke it. Deprecated earlier than planned

Attempt fix null services
Bump sw version
2023-07-11 23:49:53 +01:00 · 2023-07-11 23:02:49 +01:00 · 2023-07-01 22:19:01 +01:00 · 2023-07-01 22:17:07 +01:00 · 2023-06-26 16:14:09 +01:00 · 2023-06-26 16:09:04 +01:00
47 changed files with 3512 additions and 986 deletions
--- a/.dockerignore
+++ b/.dockerignore
@ -1,2 +1,7 @@
 .dockerignore
-Dockerfile
+Dockerfile
+package.json
+package-lock.json
+.eslintrc.js
+node_modules
+.gitea
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -0,0 +1,31 @@
+module.exports = {
+  'env': {
+    'browser': true,
+    'es2021': true
+  },
+  'extends': 'eslint:recommended',
+  'overrides': [
+  ],
+  'parserOptions': {
+    'ecmaVersion': 'latest'
+  },
+  'rules': {
+    'indent': [
+      'error',
+      2
+    ],
+    'linebreak-style': [
+      'error',
+      'unix'
+    ],
+    'quotes': [
+      'error',
+      'single'
+    ],
+    'semi': [
+      'error',
+      'never'
+    ],
+    'no-undef': 'off',
+  }
+}
--- a/.gitea/workflows/docker-build.yaml
+++ b/.gitea/workflows/docker-build.yaml
@ -0,0 +1 @@
+# Build and push docker container to repository
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1 @@
+node_modules
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@ -0,0 +1,3 @@
+{
+    "ansible.python.interpreterPath": "/bin/python"
+}
--- a/404.html
+++ b/404.html
@ -1,23 +1,24 @@
-<html>
+<html lang="en">
    <head>
-        <meta charset="UTF-8"/>
-        <meta name="description" content="OwlBoard - Live train departures for traincrew."/>
+        <meta charset="UTF-8">
+        <meta name="description" content="OwlBoard - Live train departures for traincrew.">
+        <meta name="robots" content="noindex">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="application-name" content="OwlBoard">
        <meta name="author" content="Frederick Boniface">
        <meta name="theme-color" content="#00b7b7">
        <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
-        <link rel="stylesheet" type="text/css" href="./styles/main.css"/>
-        <link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
-        <link rel="manifest" type="application/json" href="./manifest.json"/>
+        <link rel="stylesheet" type="text/css" href="./styles/main.css">
+        <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+        <link rel="manifest" type="application/json" href="./manifest.json">
        <!-- NO SCRIPTS LOADED - NOT REQUIRED AT PRESENT -->
        <title>OwlBoard - Error</title>
    </head>
    <body>
      <div id="top_button" class="hide_micro">
-        <picture aria-label="Back" class="sidebar_control" onclick="history.back()">
+        <picture class="sidebar_control" onclick="history.back()">
          <source srcset="/images/nav/back.svg" type="image/svg+xml">
-          <img src="back-40.png" alt="Back">
+          <img aria-label="Back" src="back-40.png" alt="Back">
        </picture>
      </div>
      <picture>
--- a/5
+++ b/5
@ -4,9 +4,10 @@ RUN npm i uglifyjs-folder uglifycss html-minifier-terser -g
 COPY . /data/in
 RUN bash /data/in/conf/deploy.sh

+## Maybe use: georgjung/nginx-brotli:mainline-alpine
+## Instead?
 FROM fholzer/nginx-brotli:latest
 RUN rm /etc/nginx/nginx.conf
-RUN apk update
-RUN apk add --upgrade libxml2 libxslt
+RUN apk update && apk add --upgrade libxml2 libxslt
 COPY ./conf/nginx.conf /etc/nginx/nginx.conf
 COPY --from=compressor /data/out/ /site-static/
--- a/auth.html
+++ b/auth.html
@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Live train departures for traincrew.">
+    <meta name="robots" content="noindex">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="application-name" content="OwlBoard">
+    <meta name="author" content="Frederick Boniface">
+    <meta name="theme-color" content="#00b7b7">
+    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
+    <script src="./js/lib.main.js" defer></script>
+    <script src="./js/auth.js" defer></script>
+    <title>OwlBoard</title>
+  </head>
+  <body>
+    <!-- Loading Box -->
+    <div id="loading">
+      <div class="spinner">
+      </div>
+      <p id="loading_desc">Registering</p>
+    </div>
+
+    <!-- Main Content Begins -->
+    <div id="top_button" class="hide_micro">
+      <a href="./">
+        <picture id="home_icon">
+          <source srcset="./images/nav/home_icon.svg" type="image/svg+xml">
+          <img src="./images/nav/home_icon-40.png" alt="Home">
+        </picture>
+      </a>
+    </div>
+    <picture>
+      <source srcset="./images/logo/wide_logo.svg" type="image/svg+xml">
+      <source media="(max-height: 739px)" srcset="./images/logo/logo-full-200.png" type="image/png">
+      <source srcset="./images/logo/logo-full-250.png" type="image/png">
+      <img class="titleimg" src="./images/logo/logo-full-250.png" alt="OwlBoard Logo">
+    </picture>
+    <div id="cmd">
+    </div>
+    <!-- Footer -->
+    <footer>
+      <p>&copy; Fred Boniface 2023 - v<a href="./stats.html"><span id="ver_str">???</span></a></p>
+    </footer>
+  </body>
+</html>
--- a/board-staff.html
+++ b/board-staff.html
@ -0,0 +1,135 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Live train departures for traincrew.">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="robots" content="noindex">
+    <meta name="application-name" content="OwlBoard">
+    <meta name="author" content="Frederick Boniface">
+    <meta name="theme-color" content="#00b7b7">
+    <title>OwlBoard - Loading</title>
+    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/board.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
+    <script src="./js/lib.main.js" defer></script>
+    <script src="./js/lib.board.js" defer></script>
+    <script src="./js/staff-board.js" defer></script>
+  </head>
+  <body>
+    <div id="loading">
+      <div class="spinner">
+      </div>
+      <p id="loading_desc">\nLoading</p>
+    </div>
+
+    <div id="content">
+      <div id="header">
+        <div id="station_name">
+          <h1 id="stn_name" class="header-large">Arrivals &amp; Departures</h1>
+        </div>
+        <div id="header-right">
+          <picture id="refresh" onclick="location.reload()">
+            <source srcset="./images/nav/refresh.svg" type="image/svg+xml">
+            <img src="./images/nav/refresh-50.png" alt="OwlBoard Logo">
+          </picture>
+          <a href="/">
+            <picture id="home_icon">
+              <source srcset="./images/nav/home_icon.svg" type="image/svg+xml">
+              <img src="./images/nav/home_icon-40.png" alt="Home">
+            </picture>
+          </a>
+        </div>
+      </div>
+
+      <div id="alerts" onclick="">
+        <div id="alerts_bar" onclick="inflateAlerts()">
+          <picture>
+            <source srcset="./images/nav/alert_icon.svg" type="image/svg+xml">
+            <img id="alert_icon" src="./images/nav/alert_icon.svg" alt="">
+          </picture>
+          <p id="alert_bar_note"></p>
+          <button id="alert_expand_arrow">&#8897;</button>
+          <div id="alerts_msg" onclick="NULL">
+          </div>
+        </div>
+      </div>
+
+      <div id="output">
+        <table>
+          <caption>Train Services</caption>
+          <tr>
+            <th class="name">Headcode</th>
+            <th class="name">Origin</th>
+            <th class="name">Dest.</th>
+            <th class="plat">Plat.</th>
+            <th class="time">Sch Arr.</th>
+            <th class="time">Exp Arr.</th>
+            <th class="time">Sch Dep.</th>
+            <th class="time">Exp Dep.</th>
+          </tr>
+        </table>
+      </div>
+
+      <div id="no_services" class="main-notice hidden-while-loading">
+        <p>There are no scheduled train services from this station</p>
+      </div>
+
+      <div id="ferry" class="hide-when-loading secondary-table">
+        <table>
+          <caption>Ferry Services</caption>
+          <tr>
+            <th class="name">Origin</th>
+            <th class="name">Dest.</th>
+            <th class="plat"></th>
+            <th class="time">Sch Arr.</th>
+            <th class="time">Exp Arr.</th>
+            <th class="time">Sch Dep.</th>
+            <th class="time">Exp Dep.</th>
+          </tr>
+        </table>
+      </div>
+
+      <div id="bus" class="hide-when-loading secondary-table">
+        <table>
+          <caption>Bus Services</caption>
+          <tr>
+            <th class="name">Headcode</th>
+            <th class="name">Origin</th>
+            <th class="name">Dest.</th>
+            <th class="plat"></th>
+            <th class="time">Sch Arr.</th>
+            <th class="time">Exp Arr.</th>
+            <th class="time">Sch Dep.</th>
+            <th class="time">Exp Dep.</th>
+          </tr>
+        </table>
+      </div>
+
+      <div id="error_notice" class="main-notice hide-when-loading">
+        <h1 class="error">Oops</h1>
+          <p class="error">There was an error with your request</p>
+          <p id="err_not_auth" class="notices-hidden">You are not authorised to view staff versions, you can sign up in <a href="./settings.html#railstaff">settings</a></p>
+          <p id="err_not_found" class="notices-hidden">The station you are searching for cannot be found</p>
+          <p id="err_no_data" class="notices-hidden">The station has no data.  It may not be in operation yet/anymore.</p>
+          <p id="err_conn" class="notices-hidden">Connection Error, check your data connection.  Retrying.</p>
+      </div>
+
+      <div id="footer">
+        <a href="https://nationalrail.co.uk" target="_blank" rel="nofollow external noreferrer noopener">
+          <picture id="nre_logo">
+            <source srcset="./images/nre/nre-powered_400w.jxl" type="image/jxl">
+            <source srcset="./images/nre/nre-powered_400w.webp" type="image/webp">
+            <img src="./images/nre/nre-powered_400w.png" alt="Powered by National Rail Enquiries">
+          </picture>
+        </a>
+        <div id="timeblock">
+          <p class="header-small">Data from:</p>
+          <p id="fetch_time" class="header-small">Loading...</p>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>
--- a/board.html
+++ b/board.html
@ -1,18 +1,20 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <meta charset="UTF-8"/>
-    <meta name="description" content="OwlBoard - Live train departures for traincrew."/>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Live train departures for traincrew.">
+    <meta name="robots" content="noindex">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="robots" content="noindex">
    <meta name="application-name" content="OwlBoard">
    <meta name="author" content="Frederick Boniface">
    <meta name="theme-color" content="#00b7b7">
    <title>OwlBoard - Loading</title>
    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
-    <link rel="stylesheet" type="text/css" href="./styles/main.css"/>
-    <link rel="stylesheet" type="text/css" href="./styles/boards.css"/>
-    <link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
-    <link rel="manifest" type="application/json" href="./manifest.json"/>
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/board.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
    <script src="./js/lib.main.js" defer></script>
    <script src="./js/lib.board.js" defer></script>
    <script src="./js/simple-board.js" defer></script>
@ -27,11 +29,19 @@
    <div id="content">
      <div id="header">
        <div id="station_name">
-          <h1 id="stn_name" class="header-large"></h1>
+          <h1 id="stn_name" class="header-large">Arrivals &amp; Departures</h1>
        </div>
        <div id="header-right">
-          <p class="header-small">Data from:</p>
-          <p id="fetch_time" class="header-small">Loading...</p>
+          <picture id="refresh" onclick="location.reload()">
+            <source srcset="./images/nav/refresh.svg" type="image/svg+xml">
+            <img src="./images/nav/refresh-50.png" alt="OwlBoard Logo">
+          </picture>
+          <a href="/">
+            <picture id="home_icon">
+              <source srcset="./images/nav/home_icon.svg" type="image/svg+xml">
+              <img src="./images/nav/home_icon-40.png" alt="Home">
+            </picture>
+          </a>
        </div>
      </div>

@ -113,16 +123,10 @@
            <img src="./images/nre/nre-powered_400w.png" alt="Powered by National Rail Enquiries">
          </picture>
        </a>
-        <a href="/">
-          <picture id="owlboard_logo">
-            <source srcset="./images/logo/mono-logo.svg" type="image/svg+xml">
-            <img src="./images/logo/mono-logo-33.png" alt="OwlBoard Logo">
-          </picture>
-          <picture id="home_icon">
-            <source srcset="./images/nav/home_icon.svg" type="image/svg+xml">
-            <img src="./images/nav/home_icon-40.png" alt="Home">
-          </picture>
-        </a>
+        <div id="timeblock">
+          <p class="header-small">Data from:</p>
+          <p id="fetch_time" class="header-small">Loading...</p>
+        </div>
      </div>
    </div>
  </body>
--- a/conf/nginx.conf
+++ b/conf/nginx.conf
@ -1,6 +1,9 @@
 user  nginx;
 worker_processes  1;

+##load_module modules/ngx_http_brotli_static_module.so;
+# Required to load module if using the newer image
+
 error_log  /var/log/nginx/error.log notice;
 pid        /var/run/nginx.pid;

@ -39,8 +42,11 @@ http {
            gzip_static on;
            brotli_static on;
            error_page 404 /404.html;
-            expires 3d;
-            add_header Cache-Control "public, no-transform";
+            add_header Cache-Control "public, no-transform, max-age=1209600";
+        }
+
+        location /misc/ {
+            proxy_pass http://backend;
        }

        location /api/ {
@ -48,8 +54,7 @@ http {
            proxy_cache_key $scheme://$host$uri$is_args$query_string;
            proxy_ignore_headers Cache-Control;
            proxy_cache_valid 200 2m;  # Evaluate whether 2m or 1m is more appropriate
-            expires 2m;
-            add_header Cache-Control "private, no-transform";
+            add_header Cache-Control "private, no-transform, max-age=120";
        }

        location /api/v1/list/ {
@ -57,8 +62,7 @@ http {
            proxy_cache_key $scheme://$host$uri$is_args$query_string;
            proxy_ignore_headers Cache-Control;
            proxy_cache_valid 200 10080m;
-            expires 3d;
-            add_header Cache-Control "public, no-transform";
+            add_header Cache-Control "public, no-transform, max-age=604800";
        }
    }
 }
--- a/conn-err.html
+++ b/conn-err.html
@ -1,23 +1,25 @@
-<html>
+<!DOCTYPE html>
+<html lang="en">
    <head>
-        <meta charset="UTF-8"/>
-        <meta name="description" content="OwlBoard - Live train departures for traincrew."/>
+        <meta charset="UTF-8">
+        <meta name="description" content="OwlBoard - Live train departures for traincrew.">
+        <meta name="robots" content="noindex">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="application-name" content="OwlBoard">
        <meta name="author" content="Frederick Boniface">
        <meta name="theme-color" content="#00b7b7">
        <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
-        <link rel="stylesheet" type="text/css" href="./styles/main.css"/>
-        <link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
-        <link rel="manifest" type="application/json" href="./manifest.json"/>
+        <link rel="stylesheet" type="text/css" href="./styles/main.css">
+        <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+        <link rel="manifest" type="application/json" href="./manifest.json">
        <!-- NO SCRIPTS LOADED - NOT REQUIRED AT PRESENT -->
        <title>OwlBoard - Error</title>
    </head>
    <body>
      <div id="top_button" class="hide_micro">
-        <picture aria-label="Close Menu" class="sidebar_control" onclick="history.back()">
+        <picture class="sidebar_control" onclick="history.back()">
          <source srcset="/images/nav/back.svg" type="image/svg+xml">
-          <img src="back-40.png" alt="Close menu">
+          <img aria-label="Close Menu" src="back-40.png" alt="Close menu">
        </picture>
      </div>
      <picture>
--- a/find-code.html
+++ b/find-code.html
@ -1,33 +1,31 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <meta charset="UTF-8"/>
-    <meta name="description" content="OwlBoard - Live train departures for traincrew."/>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Find CRS, TIPLOC & STANOX Codes with ease.">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="application-name" content="OwlBoard">
    <meta name="author" content="Frederick Boniface">
    <meta name="theme-color" content="#00b7b7">
    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
-    <link rel="stylesheet" type="text/css" href="./styles/main.css"/>
-    <link rel="stylesheet" type="text/css" href="./styles/find-code.css"/>
-    <link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
-    <link rel="manifest" type="application/json" href="./manifest.json"/>
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/find-code.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
    <title>OwlBoard - Code Lookup</title>
    <script src="./js/lib.main.js" defer></script>
    <script src="./js/find-code.js" defer></script>
  </head>

  <body>
-
    <div id="top_button" class="hide_micro">
      <a href="/">
-        <picture aria-label="Home" class="sidebar_control">
+        <picture class="sidebar_control">
          <source srcset="/images/nav/back.svg" type="image/svg+xml">
-          <img src="back-40.png" alt="Home">
+          <img aria-label="Home" src="back-40.png" alt="Home">
        </picture>
      </a>
    </div>
-
    <picture>
      <source srcset="/images/logo/wide_logo.svg" type="image/svg+xml">
      <source media="(max-height: 739px)" srcset="/images/logo/logo-full-200.png" type="image/png">
@ -35,8 +33,8 @@
      <img class="titleimg" src="/images/logo/logo-full-250.png" alt="OwlBoard Logo">
    </picture>
      <h2>Code Lookup</h2>
-        <p>Enter one known code in the relevant box below and hit submit.  
-          Where they exist, the other code types will be filled in.</p>
+        <p>Enter one known code in the relevant box below and hit submit.
+           Where they exist, the other code types will be filled in.</p>
        <p>You cannot yet lookup by location name as the values are not unique.</p>
        <p>Location name search will be added in the future.</p>

@ -47,17 +45,15 @@
      </div>

      <label for="name">Location name:</label><br>
-      <input type="text" class="small-lookup-box" id="name" name="name" readonly=""><br>
+      <input type="text" class="small-lookup-box" id="name" name="name" readonly><br>
      <label for="3alpha">CRS/3ALPHA:</label><br>
-      <input type="text" class="small-lookup-box" id="3alpha" name="3alpha" maxlength="3"><br>
+      <input type="text" class="small-lookup-box" id="3alpha" name="3alpha" maxlength="3" autocomplete="off"><br>
      <label for="nlc">NLC:</label><br>
-      <input type="number" class="small-lookup-box" id="nlc" name="nlc" min="100000" max="999999"><br>
+      <input type="number" class="small-lookup-box" id="nlc" name="nlc" min="100000" max="999999" autocomplete="off"><br>
      <label for="tiploc">TIPLOC:</label><br>
-      <input type="text" class="small-lookup-box" id="tiploc" name="tiploc" maxlength="7"><br>
+      <input type="text" class="small-lookup-box" id="tiploc" name="tiploc" maxlength="7" autocomplete="off"><br>
      <label for="stanox">STANOX:</label><br>
-      <input type="number" class="small-lookup-box" id="stanox" name="stanox"><br>
-      <label for="stanme" hidden>STANME:</label><br>
-      <input type="test" class="small-lookup-box" id="stanme" name="stanme" readonly="" hidden><br>
+      <input type="number" class="small-lookup-box" id="stanox" name="stanox" autocomplete="off"><br>
      <input type="submit" value="Find" class="lookup-button" onclick="fetchEntry()">
      <input type="submit" value="Clear" class="lookup-button" onclick="clearForm()">
  </body>
--- a/help.html
+++ b/help.html
@ -1,17 +1,18 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <meta charset="UTF-8"/>
-    <meta name="description" content="OwlBoard - Live train departures for traincrew."/>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - How to use OwlBoard.">
+    <meta name="robots" content="noindex">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="application-name" content="OwlBoard">
    <meta name="author" content="Frederick Boniface">
    <meta name="theme-color" content="#00b7b7">
-    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
-    <link rel="stylesheet" type="text/css" href="./styles/main.css"/>
-    <link rel="stylesheet" type="text/css" href="./styles/help.css"/>
-    <link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
-    <link rel="manifest" type="application/json" href="./manifest.json"/>
+    <link rel="apple-touch-icon" href="./images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/help.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
    <!-- NO SCRIPTS LOADED - NOT REQUIRED AT PRESENT -->
    <title>OwlBoard</title>
  </head>
@ -19,41 +20,47 @@
  <body>

    <div id="top_button" class="hide_micro">
-      <a href="/">
-        <picture aria-label="Home" class="sidebar_control">
-          <source srcset="/images/nav/back.svg" type="image/svg+xml">
-          <img src="back-40.png" alt="Home">
+      <a href="./">
+        <picture class="sidebar_control">
+          <source srcset="./images/nav/back.svg" type="image/svg+xml">
+          <img aria-label="Home" src="./images/nav/back-40.png" alt="Home">
        </picture>
      </a>
    </div>

    <picture>
      <source srcset="/images/logo/wide_logo.svg" type="image/svg+xml">
-      <source media="(max-height: 739px)" srcset="/images/logo/logo-full-200.png" type="image/png">
-      <source srcset="/images/logo/logo-full-250.png" type="image/png">
-      <img class="titleimg" src="/images/logo/logo-full-250.png" alt="OwlBoard Logo">
+      <source media="(max-height: 739px)" srcset="./images/logo/logo-full-200.png" type="image/png">
+      <source srcset="./images/logo/logo-full-250.png" type="image/png">
+      <img class="titleimg" src="./images/logo/logo-full-250.png" alt="OwlBoard Logo">
    </picture>
    <h2>Help</h2>
-      <p>OwlBoard gives you quick and easy access to departure boards for 
-         all National Rail stations in the UK.</p>
-      <p>Just type a CRS, TIPLOC or STANOX into the textbox on the homepage and tap 
+      <p>OwlBoard gives you quick and easy access to departure boards for
+         all National Rail stations in the UK.  It replaces <a href="https://athena.fb-infra.uk">Athena</a>
+         and adds location reference codes, PIS code lookups and gives faster access to departure boards.</p>
+      <p>Just type a CRS, TIPLOC or STANOX into the textbox on the homepage and tap
         enter on the screen or your keypad.  You can also select a differnt board type,
         more details on your choices below.</p>
-      <p>For example, Portway Park & 
-         Ride's CRS is 'PRI', and its TIPLOC is 'PTWYPR'; Portsmouth Harbour's 
-         CRS is 'PMH', and its TIPLOC is 'PHBR'.</p>
-      <p>A CRS is always three letters, 
-         a TIPLOC can be between 4-7 letters.</p>
+      <p>For example, Portway Park &amp; Ride's CRS is 'PRI', and its TIPLOC is 'PTWYPR';
+         Portsmouth Harbour's CRS is 'PMH', and its TIPLOC is 'PHBR'.</p>
+      <p>A CRS is always three letters, a TIPLOC can be between 4-7 letters or numbers.</p>
      <br>
      <h3>Don't know the CRS or TIPLOC?</h3>
-        <p>Sorry, you can't search by name but you can use our <a href="find-code.html">
+        <p>Sorry, you can't search by name but you can use our <a href="./find-code.html">
           Code Lookup</a> page to help.</p>
      <h3>Board Types</h3>
        <h4>Basic Board - Default</h4>
-          <p>The basic board shows the next 10 train arrival and departures, as well as 
+          <p>The basic board shows the next 10 train arrival and departures, as well as
             bus and ferry departures where available.</p>
          <p>You can tap on a trains origin or destination to see service details.</p>
      <br>
+      <h3>PIS Lookup</h3>
+        <p>PIS Codes are used on-train to tell the PIS system the stopping patter of the
+           service.  Some systems allow you to enter the headcode and will then load the
+           stops, but others require a code to be input into the system.</p>
+        <p>Once you are logged in to the <a href="./settings.html#railstaff">Rail Staff
+           Version</a> of OwlBoard you can lookup PIS Codes by typing in the CRS code of
+           the first and last stop of your service.  Lookup by headcode is being worked on.</p>
      <h3>Glossary</h3>
        <p>Some of the terms may be new to you or different from those commonly used.</p>
        <table id="table">
@ -71,7 +78,7 @@
          </tr>
          <tr>
            <td>NLC</td>
-            <td>National Location Code - Used for finance & accounting</td>
+            <td>National Location Code - Used for finance &amp; accounting</td>
          </tr>
          <tr>
            <td>RT</td>
@ -85,6 +92,10 @@
            <td>TIPLOC</td>
            <td>Timing Point Location (Name)</td>
          </tr>
+          <tr>
+            <td>PIS</td>
+            <td>Passenger Information System (or Passenger Information Screems)</td>
+          </tr>
        </table>
      <br>
      <h3>Spotted an issue with the site?</h3>
--- a/images/nav/refresh-50.png
+++ b/images/nav/refresh-50.png
--- a/images/nav/refresh.svg
+++ b/images/nav/refresh.svg
@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="32" height="32" version="1.1" viewBox="0 96 640 640" xmlns="http://www.w3.org/2000/svg">
+<path d="m320 736q-133 0-226.5-93.5t-93.5-226.5 93.5-226.5 226.5-93.5q85 0 149 34.5t111 94.5v-129h60v254h-254v-60h168q-38-60-97-97t-137-37q-109 0-184.5 75.5t-75.5 184.5 75.5 184.5 184.5 75.5q83 0 152-47.5t96-125.5h62q-29 105-115 169t-195 64z" fill="#fff"/>
+</svg>
--- a/index.html
+++ b/index.html
@ -1,16 +1,16 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <meta charset="UTF-8"/>
-    <meta name="description" content="OwlBoard - Live train departures for traincrew."/>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Live train departures, PIS codes & reference data for traincrew.">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="application-name" content="OwlBoard">
    <meta name="author" content="Frederick Boniface">
    <meta name="theme-color" content="#00b7b7">
-    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
-    <link rel="stylesheet" type="text/css" href="./styles/main.css"/>
-    <link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
-    <link rel="manifest" type="application/json" href="./manifest.json"/>
+    <link rel="apple-touch-icon" href="./images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" href="./styles/main.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
    <script src="./js/lib.main.js" defer></script>
    <script src="./js/index.js" defer></script>
    <title>OwlBoard</title>
@ -25,33 +25,34 @@

    <!-- Popup Menu -->
    <div id="top_button" class="hide_micro">
-      <picture aria-label="Menu" class="sidebar_control" id="sidebar_open_short" onclick="sidebarOpen()">
-        <source srcset="/images/nav/hamburger.svg" type="image/svg+xml">
-        <img src="hamburger_40.png" alt="Open menu">
+      <picture class="sidebar_control" id="sidebar_open_short" onclick="sidebarOpen()">
+        <source srcset="./images/nav/hamburger.svg" type="image/svg+xml">
+        <img aria-label="Menu" src="./images/nav/hamburger_40.png" alt="Open menu">
      </picture>
-      <picture aria-label="Close Menu" class="sidebar_control" id="sidebar_close_short" onclick="sidebarClose()">
-        <source srcset="/images/nav/close.svg" type="image/svg+xml">
-        <img src="close-40.png" alt="Close menu">
+      <picture class="sidebar_control" id="sidebar_close_short" onclick="sidebarClose()">
+        <source srcset="./images/nav/close.svg" type="image/svg+xml">
+        <img aria-label="Close Menu" src="./images/nav/close-40.png" alt="Close menu">
      </picture>
    </div>
    <div id="sidebar">
-      <a href="/">Home</a>
-      <a href="/find-code.html">Code Search</a>
-      <a href="/settings.html">Settings</a>
-      <a href="/help.html">Help</a>
-      <a href="/issue.html">Report Issue</a>
+      <a href="./">Home</a>
+      <a href="./find-code.html">Code Search</a>
+      <a href="./pis.html">PIS Codes</a>
+      <a href="./settings.html">Settings</a>
+      <a href="./help.html">Help</a>
+      <a href="./issue.html">Report Issue</a>
    </div>

    <!-- Main Content Begins -->
    <picture>
-      <source srcset="/images/logo/wide_logo.svg" type="image/svg+xml">
-      <source media="(max-height: 739px)" srcset="/images/logo/logo-full-200.png" type="image/png">
-      <source srcset="/images/logo/logo-full-250.png" type="image/png">
-      <img class="titleimg" src="/images/logo/logo-full-250.png" alt="OwlBoard Logo">
+      <source srcset="./images/logo/wide_logo.svg" type="image/svg+xml">
+      <source media="(max-height: 739px)" srcset="./images/logo/logo-full-200.png" type="image/png">
+      <source srcset="./images/logo/logo-full-250.png" type="image/png">
+      <img class="titleimg" src="./images/logo/logo-full-250.png" alt="OwlBoard Logo">
    </picture>
    <br>
    <form action="board.html">
-      <input class="lookup-box" type="text" id="crs-lookup" name="stn" placeholder="Enter CRS/TIPLOC" autocomplete="off"/>
+      <input class="lookup-box" type="text" id="crs-lookup" name="stn" placeholder="Enter CRS/TIPLOC" autocomplete="off">
      <br>
      <input type="submit" value="Lookup Board" class="lookup-button" onclick="vibe('ok')">
    </form>
@ -60,11 +61,13 @@
      <div id="quick_links">
      </div>
      <div class="text-description">
-        <p>Customise your quick links on the <a href="/settings.html">Settings</a> page.</p>
+        <p>New feature: <a href="./pis.html">Find PIS by Headcode</a></p>
+        <p>Later this month: New website &amp; Staff Departure Boards</p>
+        <p>Customise your quick links on the <a href="./settings.html">Settings</a> page.</p>
      </div>
    <!-- Footer -->
    <footer>
-      <p>Created by <a href="https://fredboniface.co.uk" target="_blank" rel="noreferrer noopener">Fred Boniface</a> - 1.0.6</p>
+      <p>&copy; Fred Boniface 2023 - <a href="./stats.html"><span id="ver_str">???</span></a></p>
    </footer>
  </body>
 </html>
--- a/issue.html
+++ b/issue.html
@ -1,58 +1,59 @@
-<html>
-    <head>
-        <meta charset="UTF-8"/>
-        <meta name="description" content="OwlBoard - Live train departures for traincrew."/>
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <meta name="application-name" content="OwlBoard">
-        <meta name="author" content="Frederick Boniface">
-        <meta name="theme-color" content="#00b7b7">
-        <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
-        <link rel="stylesheet" type="text/css" href="./styles/main.css"/>
-        <link rel="stylesheet" type="text/css" href="./styles/issue.css"/>
-        <link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
-        <link rel="manifest" type="application/json" href="./manifest.json"/>
-        <script src="./js/lib.main.js" defer></script>
-        <script src="./js/issue.js" defer></script>
-        <title>OwlBoard - Report</title>
-    </head>
-    <body>
-      <!-- Loading Box -->
-      <div id="loading">
-        <div class="spinner">
-        </div>
-        <p id="loading_desc">Loading</p>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Report an issue with OwlBoard.">
+    <meta name="robots" content="noindex">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="application-name" content="OwlBoard">
+    <meta name="author" content="Frederick Boniface">
+    <meta name="theme-color" content="#00b7b7">
+    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/issue.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
+    <script src="./js/lib.main.js" defer></script>
+    <script src="./js/issue.js" defer></script>
+    <title>OwlBoard - Report</title>
+  </head>
+  <body>
+    <!-- Loading Box -->
+    <div id="loading">
+      <div class="spinner">
      </div>
-      <div id="top_button" class="hide_micro">
-        <a href="/">
-          <picture aria-label="Home" class="sidebar_control">
-            <source srcset="/images/nav/back.svg" type="image/svg+xml">
-            <img src="back-40.png" alt="Home">
-          </picture>
-        </a>
-      </div>
-      <picture>
-        <source srcset="/images/logo/wide_logo.svg" type="image/svg+xml">
-        <source media="(max-height: 739px)" srcset="/images/logo/logo-full-200.png" type="image/png">
-        <source srcset="/images/logo/logo-full-250.png" type="image/png">
-        <img class="titleimg" src="/images/logo/logo-full-250.png" alt="OwlBoard Logo">
-      </picture>
-      <h2>Report an Issue</h2>
-        <p>To help diagnosing an issue, data about your browser and device will be
-           collected alongside the data that you enter below.</p>
-        <p>The data will be available publically in the <a href="https://git.fjla.uk/fred.boniface/owlboard/issues">
-           OwlBoard Issue Tracker</a>.  A preview will be shown before the data is sent.</p>
-          <label for="subject">Subject:</label><br>
-          <input type="text" name="subject" id="subject" class="text-entry"/><br>
-          <label for="content">Message:</label><br>
-          <textarea name="message" id="message" class="text-entry-long"></textarea><br>
-          <input type="submit" name="submit" id="submit" label="Preview" class="lookup-button" onclick="submit()">
+      <p id="loading_desc">Loading</p>
+    </div>
+    <div id="top_button" class="hide_micro">
+      <a href="/">
+        <picture class="sidebar_control">
+          <source srcset="/images/nav/back.svg" type="image/svg+xml">
+          <img aria-label="Home" src="./images/nav/back-40.png" alt="Home">
+        </picture>
+      </a>
+    </div>
+    <picture>
+      <source srcset="/images/logo/wide_logo.svg" type="image/svg+xml">
+      <source media="(max-height: 739px)" srcset="/images/logo/logo-full-200.png" type="image/png">
+      <source srcset="/images/logo/logo-full-250.png" type="image/png">
+      <img class="titleimg" src="/images/logo/logo-full-250.png" alt="OwlBoard Logo">
+    </picture>
+    <h2>Report an Issue</h2>
+      <p>To help diagnosing an issue, data about your browser and device will be
+         collected alongside the data that you enter below.</p>
+      <p>OwlBoard reported issues are visible to the public on the <a href="https://git.fjla.uk/owlboard/backend/issues">
+         OwlBoard Issue Tracker</a>.  Do not include sensitive information, a preview will be shown before the data is sent.</p>
+      <label for="subject">Subject:</label><br>
+      <input type="text" name="subject" id="subject" class="text-entry"><br>
+      <label for="content">Message:</label><br>
+      <textarea name="message" id="message" class="text-entry-long"></textarea><br>
+      <input type="submit" name="submit" id="submit" label="Preview" class="lookup-button" onclick="submit()">
      <div id="preflight">
-        <h3>Check & Send</h3>
+        <h3>Check &amp; Send</h3>
        <h3>---</h3>
-        <h4 id="pre_subject"></h4>
-        <p id="pre_message"></p>
-        <button id="send" class="lookup-button" onclick="send()">Send</button>
-        <button id="cancel" class="lookup-button" onclick="cancel()">Cancel</button>
+          <h4 id="pre_subject">Subject</h4>
+            <p id="pre_message"></p>
+            <button type="submit" id="send" class="lookup-button" onclick="send()">Send</button>
+            <button type="reset" id="cancel" class="lookup-button" onclick="cancel()">Cancel</button>
      </div>
-    </body>
+  </body>
 </html>
--- a/js/auth.js
+++ b/js/auth.js
@ -0,0 +1,80 @@
+/* eslint-disable no-unused-vars */
+/*
+Auth process: User Requests Key => Server emails key to user =>
+              user opens link to auth.html =>
+              website POSTs key to server => Server checks validity =>
+              Server responds with the users auth key =>
+              auth.js adds this to localStorage
+*/
+const cmd = document.getElementById('cmd') // Assign element to const
+versionDisplay() // Show web version in footer
+init() // Run init function
+
+async function sendHome(){
+  await delay(2000)
+  location.replace('./')
+}
+
+async function cmdOut(message) {
+  html = '<p>' + message + '</p>'
+  cmd.insertAdjacentHTML('beforeend', html)
+}
+
+async function registerKey(key) { // Posts key to server and listens for response.
+  const url = `${apiEndpoint}/v1/register/register`
+  const res = await fetch(url, { // The response will contain the UUID which will be registered
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json'
+    },
+    redirect: 'follow',
+    body: JSON.stringify({uuid: key})
+  })
+  const data = await res.json()
+  return res.status === 201
+    ? (localStorage.setItem('uuid', data.api_key), true)
+    : false
+}
+
+async function checkAuth(key) {
+  const url = `${apiEndpoint}/v1/auth/test`
+  const res = await fetch(url, {
+    method: 'GET',
+    redirect: 'follow',
+    headers: {
+      'uuid': key
+    }
+  })
+  return res.status === 200 ? true : false
+}
+
+async function init(){ // Reads registration key from query, and calls registerKey(key)
+  cmdOut('Reading authorisation code')
+  const key = await getQuery('key')
+  if (key === 'false') {
+    cmdOut('No valid key found')
+    cmdOut('Try clicking the link again or request a new activation link')
+    hideLoading()
+    return
+  }
+  cmdOut('Requesting API Key from server')
+  if (!await registerKey(key)) {
+    cmdOut('Failed to register or invalid key')
+    cmdOut('Try again later or request a new link')
+    hideLoading()
+    return
+  }
+  showLoading()
+  if (! await checkAuth(localStorage.getItem('uuid'))) {
+    cmdOut('Authentication Check failed')
+    cmdOut('Please logout and request a new link')
+    hideLoading()
+    await delay(2000)
+    location.replace('./')
+  }
+  hideLoading()
+  cmdOut('Authentication succesful')
+  cmdOut('Redirecting to home')
+  await delay(3000)
+  location.replace('./')
+}
--- a/js/find-code.js
+++ b/js/find-code.js
@ -1,97 +1,99 @@
-hideLoading();
+hideLoading()

+// eslint-disable-next-line no-unused-vars
 async function fetchEntry(){  // This can be condensed
-    showLoading();
-    var name = document.getElementById("name")
-    var crs = document.getElementById("3alpha")
-    var nlc = document.getElementById("nlc")
-    var tiploc = document.getElementById("tiploc")
-    var stanox = document.getElementById("stanox")
+  showLoading()
+  let name = document.getElementById('name')
+  let crs = document.getElementById('3alpha')
+  let nlc = document.getElementById('nlc')
+  let tiploc = document.getElementById('tiploc')
+  let stanox = document.getElementById('stanox')

-    var values = {
-        name: name.value,
-        crs: crs.value,
-        nlc: nlc.value,
-        tiploc: tiploc.value,
-        stanox: stanox.value
-    }
-      parseData(values)
+  let values = {
+    name: name.value,
+    crs: crs.value,
+    nlc: nlc.value,
+    tiploc: tiploc.value,
+    stanox: stanox.value
+  }
+  parseData(values)
 }

 async function parseData(values){
-    vibe()
-    if (values.crs != ""){
-        setLoadingDesc(`Searching\n${values.crs.toUpperCase()}`)
-        var data = await getData("crs", values.crs)
-    } else if (values.nlc != ""){
-        setLoadingDesc(`Searching\n${values.nlc.toUpperCase()}`)
-        var data = await getData("nlc", values.nlc)
-    } else if (values.tiploc != ""){
-        setLoadingDesc(`Searching\n${values.tiploc.toUpperCase()}`)
-        var data = await getData("tiploc", values.tiploc)
-    } else if (values.stanox != ""){
-        setLoadingDesc(`Searching\n${values.stanox.toUpperCase()}`)
-        var data = await getData("stanox", values.stanox)
-    } else if (values.name != ""){
-        setLoadingDesc(`Searching\n${values.name}`)
-        var data = await getData("name", values.name)
-    } else {
-        log("find-code.parseData: No data entered", "WARN")
-        await clearForm();
-        document.getElementById("name").value = "No data entered"
-        vibe("err");
-        hideLoading();
-        return;
-    }
-    displayData(data);
+  vibe()
+  let data
+  if (values.crs != ''){
+    setLoadingDesc(`Searching\n${values.crs.toUpperCase()}`)
+    data = await getData('crs', values.crs)
+  } else if (values.nlc != ''){
+    setLoadingDesc(`Searching\n${values.nlc.toUpperCase()}`)
+    data = await getData('nlc', values.nlc)
+  } else if (values.tiploc != ''){
+    setLoadingDesc(`Searching\n${values.tiploc.toUpperCase()}`)
+    data = await getData('tiploc', values.tiploc)
+  } else if (values.stanox != ''){
+    setLoadingDesc(`Searching\n${values.stanox.toUpperCase()}`)
+    data = await getData('stanox', values.stanox)
+  } else if (values.name != ''){
+    setLoadingDesc(`Searching\n${values.name}`)
+    data = await getData('name', values.name)
+  } else {
+    log('find-code.parseData: No data entered', 'WARN')
+    await clearForm()
+    document.getElementById('name').value = 'No data entered'
+    vibe('err')
+    hideLoading()
+    return
+  }
+  displayData(data)
 }

 async function getData(type, value){
-    log(`find-code.getData: Looking for: ${type} '${value}'`, "INFO")
-    try {
-        var url = `${window.location.origin}/api/v1/find/${type}/${value}`;
-        var resp = await fetch(url);
-        return await resp.json()
-    } catch (err) {
-        log(`find-code.getData: Error getting data: ${err}`, "WARN")
-        vibe("err")
-        return "";
-    }
+  log(`find-code.getData: Looking for: ${type} '${value}'`, 'INFO')
+  try {
+    var url = `${apiEndpoint}/v1/find/${type}/${value}`
+    var resp = await fetch(url)
+    return await resp.json()
+  } catch (err) {
+    log(`find-code.getData: Error getting data: ${err}`, 'WARN')
+    vibe('err')
+    return ''
+  }
 }

 async function displayData(data){
-    hideLoading();
-    if (data.status === "failed" || data == ""){
-        log(`find-code.displayData: Unable to find data`, "WARN")
-        clearForm();
-        document.getElementById("name").value = "Not Found";
-    } else {
-        log(`find-code.displayData: Inserting data`, "INFO")
-        vibe("ok")
-        try {
-            document.getElementById("name").value = data['0']['NLCDESC']
-        } catch (err) {}
-        try {
-            document.getElementById("3alpha").value = data['0']['3ALPHA']
-        } catch (err) {}
-        try {
-            document.getElementById("nlc").value = data['0']['NLC']
-        } catch (err) {}
-        try {
-            document.getElementById("tiploc").value = data['0']['TIPLOC']
-        } catch (err) {}
-        try {
-            document.getElementById("stanox").value = data['0']['STANOX']
-        } catch (err) {}
-    }
+  hideLoading()
+  if (data.status === 'failed' || data == ''){
+    log('find-code.displayData: Unable to find data', 'WARN')
+    clearForm()
+    document.getElementById('name').value = 'Not Found'
+  } else {
+    log('find-code.displayData: Inserting data', 'INFO')
+    vibe('ok')
+    try {
+      document.getElementById('name').value = data['0']['NLCDESC']
+    } catch (err) {log(err)}
+    try {
+      document.getElementById('3alpha').value = data['0']['3ALPHA']
+    } catch (err) {log(err)}
+    try {
+      document.getElementById('nlc').value = data['0']['NLC']
+    } catch (err) {log(err)}
+    try {
+      document.getElementById('tiploc').value = data['0']['TIPLOC']
+    } catch (err) {log(err)}
+    try {
+      document.getElementById('stanox').value = data['0']['STANOX']
+    } catch (err) {log(err)}
+  }
 }

 async function clearForm(){
-    document.getElementById("name").value = ""
-    document.getElementById("3alpha").value = ""
-    document.getElementById("nlc").value = ""
-    document.getElementById("tiploc").value = ""
-    document.getElementById("stanox").value = ""
-    vibe("ok");
-    hideLoading();
+  document.getElementById('name').value = ''
+  document.getElementById('3alpha').value = ''
+  document.getElementById('nlc').value = ''
+  document.getElementById('tiploc').value = ''
+  document.getElementById('stanox').value = ''
+  vibe('ok')
+  hideLoading()
 }
--- a/js/index.js
+++ b/js/index.js
@ -1,26 +1,28 @@
 // Init:
-pageInit();
+pageInit()
+versionDisplay()

-if ("serviceWorker" in navigator) {
-  navigator.serviceWorker.register("/sw.js");
+if ('serviceWorker' in navigator) {
+  navigator.serviceWorker.register('/sw.js')
 }

 async function pageInit() {
-  await loadQuickLinks();
-  hideLoading(); // From lib.main
+  await loadQuickLinks()
+  hideLoading() // From lib.main
 }

+// eslint-disable-next-line no-unused-vars
 async function gotoBoard(station){
-  vibe("ok")
-  window.location.assign(`${window.location.origin}/board.html?stn=${station}`);
+  vibe('ok')
+  window.location.assign(`${window.location.origin}/board.html?stn=${station}`)
 }

 async function loadQuickLinks(){
-  var data = await getQuickLinks(); // From lib.main
-  var buttons = "";
-    for(var i = 0; i < data.length; i++) {
-        buttons += `
+  var data = await getQuickLinks() // From lib.main
+  var buttons = ''
+  for(var i = 0; i < data.length; i++) {
+    buttons += `
        <button class="actionbutton" onclick="gotoBoard('${data[i]}')">${data[i].toUpperCase()}</button>`
-    }
-  document.getElementById("quick_links").insertAdjacentHTML("beforeend", buttons)
+  }
+  document.getElementById('quick_links').insertAdjacentHTML('beforeend', buttons)
 }
--- a/js/issue.js
+++ b/js/issue.js
@ -1,88 +1,89 @@
-init();
+/* eslint-disable no-unused-vars */
+init()

 async function init() {
-    hideLoading()
+  hideLoading()
 }

 async function submit() {
-    setLoadingDesc("Collecting\nData")
-    showLoading()
-    var browserData = await getBrowserData();
-    setLoadingDesc("Reading\nForm")
-    var formData = await getFormData();
-    preflight({browserData: browserData, formData: formData})
+  setLoadingDesc('Collecting\nData')
+  showLoading()
+  var browserData = await getBrowserData()
+  setLoadingDesc('Reading\nForm')
+  var formData = await getFormData()
+  preflight({browserData: browserData, formData: formData})
 }

 async function getFormData() {
-    let data = {}
-    data.subject = document.getElementById("subject").value
-    data.message = document.getElementById("message").value
-    return data
+  let data = {}
+  data.subject = document.getElementById('subject').value
+  data.message = document.getElementById('message').value
+  return data
 }

 async function getBrowserData() {
-    let data = {}
-    data.userAgent = navigator.userAgent
-    data.userAgentData = JSON.stringify(navigator.userAgentData)
-    data.localStorage = JSON.stringify(await storageAvailable('localStorage'))
-    data.sessionStorage = JSON.stringify(await storageAvailable('sessionStorage'))
-    data.viewport = `${window.innerWidth} x ${window.innerHeight}`
-    return data
+  let data = {}
+  data.userAgent = navigator.userAgent
+  data.userAgentData = JSON.stringify(navigator.userAgentData)
+  data.localStorage = JSON.stringify(await storageAvailable('localStorage'))
+  data.sessionStorage = JSON.stringify(await storageAvailable('sessionStorage'))
+  data.viewport = `${window.innerWidth} x ${window.innerHeight}`
+  return data
 }

 async function preflight(data) {
-    document.getElementById("pre_subject").textContent = data.formData.subject
-    pre_msg = `UserAgent: ${data.browserData.userAgent}
+  document.getElementById('pre_subject').textContent = data.formData.subject
+  pre_msg = `UserAgent: ${data.browserData.userAgent}
     \nUserAgentData: ${data.browserData.userAgentData}
     \nlocalStorage Avail: ${data.browserData.localStorage}
     \nsessionStorage Avail: ${data.browserData.sessionStorage}
     \nViewport size: ${data.browserData.viewport}
     \nUser message:\n\n${data.formData.message}`
-    document.getElementById("pre_message").innerText = pre_msg
-    hideLoading()
-    document.getElementById("preflight").style = "display: block"
-    sessionStorage.setItem("preflight_subject", data.formData.subject)
-    sessionStorage.setItem("preflight_msg", pre_msg)
+  document.getElementById('pre_message').innerText = pre_msg
+  hideLoading()
+  document.getElementById('preflight').style = 'display: block'
+  sessionStorage.setItem('preflight_subject', data.formData.subject)
+  sessionStorage.setItem('preflight_msg', pre_msg)
 }

 async function cancel() {
-    document.getElementById("preflight").style = "display: none"
+  document.getElementById('preflight').style = 'display: none'
 }

 async function send() {
-    setLoadingDesc("Sending\nData")
-    document.getElementById("preflight").style = "display: none"
-    showLoading()
-    var subject = sessionStorage.getItem("preflight_subject");
-    var msg = sessionStorage.getItem("preflight_msg")
-    if (typeof subject != "string") {
-        subject = document.getElementById("preflight_subject").innerText
-    }
-    if (typeof msg != "string") {
-        msg = document.getElementById("preflight_msg")
-    }
-    var payload = JSON.stringify({subject: subject, msg: msg})
-    console.log(payload);
-    let opt = {
-        method: 'POST',
-        headers: {
-            'Content-Type': 'application/json',
-            'Accept': 'application/json'
-        },
-        redirect: 'follow',
-        body: payload
-    }
-    var res = await fetch(`${window.location.origin}/api/v1/issue`, opt)
-    if (res.status == 200) {
-        setLoadingDesc("Success")
-        vibe("ok")
-        await delay(2500)
-        window.location.replace("/")
-    } else {
-        setLoadingDesc("Error")
-        vibe("err")
-        await delay(2500)
-        hideLoading()
-        document.getElementById("preflight").style = "display: none;"
-    }
+  setLoadingDesc('Sending\nData')
+  document.getElementById('preflight').style = 'display: none'
+  showLoading()
+  var subject = sessionStorage.getItem('preflight_subject')
+  var msg = sessionStorage.getItem('preflight_msg')
+  if (typeof subject != 'string') {
+    subject = document.getElementById('preflight_subject').innerText
+  }
+  if (typeof msg != 'string') {
+    msg = document.getElementById('preflight_msg')
+  }
+  var payload = JSON.stringify({subject: subject, msg: msg})
+  console.log(payload)
+  let opt = {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      'Accept': 'application/json'
+    },
+    redirect: 'follow',
+    body: payload
+  }
+  var res = await fetch(`${apiEndpoint}/v1/issue`, opt)
+  if (res.status == 200) {
+    setLoadingDesc('Success')
+    vibe('ok')
+    await delay(2500)
+    window.location.replace('/')
+  } else {
+    setLoadingDesc('Error')
+    vibe('err')
+    await delay(2500)
+    hideLoading()
+    document.getElementById('preflight').style = 'display: none;'
+  }
 }
--- a/js/lib.board.js
+++ b/js/lib.board.js
@ -1,195 +1,205 @@
+/* eslint-disable no-unused-vars */
 /* Fetch Functions */
 async function publicLdb(stn) {
-    var url = `${window.location.origin}/api/v1/ldb/${stn}`;
-    var resp = await fetch(url);
-    return await resp.json();
+  var url = `${apiEndpoint}/v1/ldb/${stn}`
+  console.time('Time: Fetch LDB Data')
+  var resp = await fetch(url)
+  console.timeEnd('Time: Fetch LDB Data')
+  return await resp.json()
 }

 /* Set page heading */
 async function setHeaders(title,time) {
-    var prefix = `OwlBoard - `
-    document.title = `${prefix}${title}`
-    document.getElementById("stn_name").textContent = title
-    document.getElementById("fetch_time").textContent = time.toLocaleTimeString()
-    sessionStorage.setItem("board_location", title);
+  var prefix = 'OwlBoard - '
+  document.title = `${prefix}${title}`
+  document.getElementById('stn_name').textContent = title
+  document.getElementById('fetch_time').textContent = time.toLocaleTimeString()
+  sessionStorage.setItem('board_location', title)
 }

 /* Display No Trains Message */
 async function displayNoTrains() {
-    log("No Trains", "WARN")
-    document.getElementById('no_services').style = "display: block;";
-    hideLoading();
+  log('No Trains', 'WARN')
+  document.getElementById('no_services').style = 'display: block;'
+  hideLoading()
 }

 /* Parse the value of `platform` to account for unknown platforms */
 async function parsePlatform(svc){
-    if (svc.platform != undefined) {
-        var platform = svc.platform;
-    } else {
-        var platform = "-";
-    }
-    if (svc.platformChanged) { // Not present in public API, ready for staff version.
-        var changed = "changed";
-    } else {
-        var changed = "";
-    }
-    return {num: platform, change: changed}
+  let platform, changed
+  if (svc.platform != undefined) {
+    platform = svc.platform
+  } else {
+    platform = '-'
+  }
+  if (svc.platformChanged) { // Not present in public API, ready for staff version.
+    changed = 'changed'
+  } else {
+    changed = ''
+  }
+  return {num: platform, change: changed}
 }


 /* Change value of time strings to fit well on small screens */
 async function parseTime(string){
-    switch (string) {
-        case "Delayed":
-            var output = "LATE";
-            var change = "changed";
-            break;
-        case "Cancelled":
-            var output = "CANC";
-            var change = "cancelled";
-            break;
-        case "On time":
-            var output = "RT";
-            var change = "";
-            break;
-        case "":
-            var output = "-";
-            var change = "";
-            break;
-        case undefined:
-            var output = "-";
-            var change = "";
-            break;
-        case "No report":
-            var output = "-";
-            var change = "";
-            break;
-        case "undefined":
-            var output = false;
-            var change = "";
-            break;
-        default:
-            var output = string;
-            var change = "changed";
-    }
-    return {data: output, changed: change};
+  let output
+  let change
+  switch (string) {
+  case 'Delayed':
+    output = 'LATE'
+    change = 'changed'
+    break
+  case 'Cancelled':
+    output = 'CANC'
+    change = 'cancelled'
+    break
+  case 'On time':
+    output = 'RT'
+    change = ''
+    break
+  case '':
+    output = '-'
+    change = ''
+    break
+  case undefined:
+    output = '-'
+    change = ''
+    break
+  case 'No report':
+    output = '-'
+    change = ''
+    break
+  case 'undefined':
+    output = false
+    change = ''
+    break
+  default:
+    output = string
+    change = 'changed'
+  }
+  return {data: output, changed: change}
 }

 /* Convert multiple Origin/Destinations to single string */
 async function parseName(location) {
-    if (Array.isArray(location)) {
-        var name = `${location[0]['locationName']} & ${location[1]['locationName']}`
-        return name;
-    }
-    else {
-        return location.locationName;
-    }
+  if (Array.isArray(location)) {
+    var name = `${location[0]['locationName']} & ${location[1]['locationName']}`
+    return name
+  }
+  else {
+    return location.locationName
+  }
 }

 // Display Alert Messages
 async function displayAlerts(array) {
-    var counter = 0
-    var messages = ""
-    for(var i = 0; i < array.length; i++) {
-        // Increment counter
-        counter += 1;
-        // Reset Vars
-        messages += `<p>${array[i]}</p>`;
+  var counter = 0
+  var messages = ''
+  for(var i = 0; i < array.length; i++) {
+    // Increment counter
+    counter += 1
+    // Reset Vars
+    messages += `<p>${array[i]}</p>`
+  }
+  if (counter > 0) {
+    document.getElementById('alerts_msg').insertAdjacentHTML('beforeend', messages)
+    document.getElementById('alerts').style = 'display:block'
+    document.getElementById('alerts_bar').style = 'display:block'
+    if (counter == 1) {
+      document.getElementById('alert_bar_note').textContent = `There is ${counter} active alert`
+    } else if (counter > 1) {
+      document.getElementById('alert_bar_note').textContent = `There are ${counter} active alerts`
    }
-    if (counter > 0) {
-        document.getElementById("alerts_msg").insertAdjacentHTML("beforeend", messages)
-        document.getElementById("alerts").style = "display:block"
-        document.getElementById("alerts_bar").style = "display:block"
-        if (counter == 1) {
-            document.getElementById("alert_bar_note").textContent = `There is ${counter} active alert`
-        } else if (counter > 1) {
-            document.getElementById("alert_bar_note").textContent = `There are ${counter} active alerts`
-        }
-        return true;
-    }
-    return false;
+    return true
+  }
+  return false
 }


 /* Show/Hide alerts box */
 async function inflateAlerts() {
-    document.getElementById("alerts_msg").style = "display:block;";
-    document.getElementById("alert_expand_arrow").style = "transform: rotate(180deg);";
-    document.getElementById("alerts_bar").setAttribute("onclick", "deflateAlerts()")
+  document.getElementById('alerts_msg').style = 'display:block;'
+  document.getElementById('alert_expand_arrow').style = 'transform: rotate(180deg);'
+  document.getElementById('alerts_bar').setAttribute('onclick', 'deflateAlerts()')
 }

 async function deflateAlerts() {
-    document.getElementById("alerts_msg").style = "display.none;";
-    document.getElementById("alert_expand_arrow").style = "transform: rotate(0deg);";
-    document.getElementById("alerts_bar").setAttribute("onclick", "inflateAlerts()")
+  document.getElementById('alerts_msg').style = 'display.none;'
+  document.getElementById('alert_expand_arrow').style = 'transform: rotate(0deg);'
+  document.getElementById('alerts_bar').setAttribute('onclick', 'inflateAlerts()')
 }

 /*//// SERVICE DETAIL LISTS ////*/
 // Build calling list:  -- This outputs calling point data to sessionStorage in the format: key{pre: [{PREVIOUS_Stops}], post: [{POST_STOPS}]}
 async function buildCallLists(svc) {
-    var sSvcId = svc.serviceID;
-    var oSvcData = {
-        plat: svc.platform,
-        sta: svc.sta,
-        eta: svc.eta,
-        std: svc.std,
-        etd: svc.etd
-    };
-    try {
-        if (typeof svc.previousCallingPoints.callingPointList.callingPoint != 'undefined') {
-            let array = await makeArray(svc.previousCallingPoints.callingPointList.callingPoint);
-            oSvcData.pre = array;
-        }
-    } catch (err) { /* Do nothing if ERR */ }
-    try {
-        if (typeof svc.subsequentCallingPoints.callingPointList.callingPoint != 'undefined') {
-            let array = await makeArray(svc.subsequentCallingPoints.callingPointList.callingPoint);
-            oSvcData.post = array;
-        }
-    } catch (err) { /* Do nothing if ERR */ }
-    sessionStorage.setItem(sSvcId, JSON.stringify(oSvcData))
+  var sSvcId = svc.serviceID
+  var oSvcData = {
+    plat: svc.platform,
+    sta: svc.sta,
+    eta: svc.eta,
+    std: svc.std,
+    etd: svc.etd
+  }
+  try {
+    if (typeof svc.previousCallingPoints.callingPointList.callingPoint != 'undefined') {
+      let array = await makeArray(svc.previousCallingPoints.callingPointList.callingPoint)
+      oSvcData.pre = array
+    }
+  } catch (err) { /* Do nothing if ERR */ }
+  try {
+    if (typeof svc.subsequentCallingPoints.callingPointList.callingPoint != 'undefined') {
+      let array = await makeArray(svc.subsequentCallingPoints.callingPointList.callingPoint)
+      oSvcData.post = array
+    }
+  } catch (err) { /* Do nothing if ERR */ }
+  sessionStorage.setItem(sSvcId, JSON.stringify(oSvcData))
 }

 /* Display calling list: - Read data from sessionStorage and write to DOM. */
 async function showCalls(id) {
-    log(`Showing details for service ${id}`, "INFO")
-    var svcDetail = await JSON.parse(sessionStorage.getItem(id));
-    var pre = "";
-    var post = "";
-    if (typeof svcDetail.pre != 'undefined') {
-        for(var preCall = 0; preCall < svcDetail.pre.length; preCall++) {
-            pre += await singleCall(svcDetail.pre[preCall]);
-        }
+  log(`Showing details for service ${id}`, 'INFO')
+  var svcDetail = await JSON.parse(sessionStorage.getItem(id))
+  var pre = ''
+  var post = ''
+  if (typeof svcDetail.pre != 'undefined') {
+    for(var preCall = 0; preCall < svcDetail.pre.length; preCall++) {
+      pre += await singleCall(svcDetail.pre[preCall])
    }
-    if (typeof svcDetail.post != 'undefined') {
-        for(var postCall = 0; postCall < svcDetail.post.length; postCall++) {
-            post += await singleCall(svcDetail.post[postCall]);
-        }
+  }
+  if (typeof svcDetail.post != 'undefined') {
+    for(var postCall = 0; postCall < svcDetail.post.length; postCall++) {
+      post += await singleCall(svcDetail.post[postCall])
    }
-    /* Run retreived data through parsers */
-    var thisStd = await parseTime(svcDetail.std);
-    var thisEtd = await parseTime(svcDetail.etd);
-    var thisSta = await parseTime(svcDetail.sta);
-    var thisEta = await parseTime(svcDetail.eta);
-    /* Prepare data for this station */
-    if (thisStd.data != "-") {
-        var sTime = `${thisStd.data}`
-        var eTime = `${thisEtd.data}`
-        var change = thisEtd.changed
-    } else {
-        var sTime = `${thisSta.data}`
-        var eTime = `${thisEta.data}`
-        var change = thisEta.changed
-    };
+  }
+  /* Run retreived data through parsers */
+  var thisStd = await parseTime(svcDetail.std)
+  var thisEtd = await parseTime(svcDetail.etd)
+  var thisSta = await parseTime(svcDetail.sta)
+  var thisEta = await parseTime(svcDetail.eta)
+  /* Prepare data for this station */
+  let sTime
+  let eTime
+  let change
+  if (thisStd.data != '-') {
+    sTime = `${thisStd.data}`
+    eTime = `${thisEtd.data}`
+    change = thisEtd.changed
+  } else {
+    sTime = `${thisSta.data}`
+    eTime = `${thisEta.data}`
+    change = thisEta.changed
+  }

-    let here = `<tr>
-                  <td class="detail-name detail-name-here detail-table-content">${sessionStorage.getItem("board_location")}</td>
+  let here = `<tr>
+                  <td class="detail-name detail-name-here detail-table-content">${sessionStorage.getItem('board_location')}</td>
                  <td class="detail-table-content">${sTime}</td>
                  <td class="detail-table-content ${change}">${eTime}</td>
                </tr> `
-    /* Prepare then insert DOM Data */
-    let dom = ` <div id="${id}" class="call-data">
+  /* Prepare then insert DOM Data */
+  let dom = ` <div id="${id}" class="call-data">
                  <p class="close-data" onclick="hideCalls('${id}')">X</p>
+                  <p class="call-table-description">Click on a stations name to go to it's departure board</p>
                  <table class="call-table">
                    <tr>
                      <th class="detail-name-head">Location</th>
@ -202,27 +212,29 @@ async function showCalls(id) {
                  </table>
                </div>`

-    document.body.insertAdjacentHTML("beforeend", dom);
-    document.getElementById(id).style = "display: block;";
-    return;
+  document.body.insertAdjacentHTML('beforeend', dom)
+  document.getElementById(id).style = 'display: block;'
+  return
 }

 async function hideCalls(id) {
-    let element = document.getElementById(id)
-    element.style = "display: none;";
-    element.remove();
-    return;
+  let element = document.getElementById(id)
+  element.style = 'display: none;'
+  element.remove()
+  return
 }

 /* Builds the train data information in to a table row */
 async function singleCall(data) {
-    if (typeof data.et != "undefined") {
-        var time = await parseTime(data.et)
-    } else if (typeof data.at != "undefined") {
-        var time = await parseTime(data.at)
-    }
-    return `<tr>
-              <td class="detail-name detail-table-content">${data.locationName}</td>
+  let link = `./board.html?stn=${data.crs}`
+  let time
+  if (typeof data.et != 'undefined') {
+    time = await parseTime(data.et)
+  } else if (typeof data.at != 'undefined') {
+    time = await parseTime(data.at)
+  }
+  return `<tr>
+              <td class="detail-name detail-table-content"><a href="${link}">${data.locationName}</a></td>
              <td class="detail-table-content">${data.st}</td>
              <td class="detail-table-content ${time.changed}">${time.data}</td>
            </tr>`
@ -230,19 +242,20 @@ async function singleCall(data) {

 /* 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(3000);
-        vibe("err")
-        location.reload()
-    } else {
-        sessionStorage.removeItem("failcount");
-        window.location.assign("conn-err.html")
-    }
+  let errCount
+  if (sessionStorage.getItem('failcount')) {
+    errCount = parseInt(sessionStorage.getItem('failcount'))
+  } else {
+    errCount = 0
+  }
+  errCount += 1
+  sessionStorage.setItem('failcount', errCount.toString())
+  if (errCount < 10){
+    await delay(3000)
+    vibe('err')
+    location.reload()
+  } else {
+    sessionStorage.removeItem('failcount')
+    window.location.assign('conn-err.html')
+  }
 }
--- a/js/lib.main.js
+++ b/js/lib.main.js
@ -1,138 +1,199 @@
+/* eslint-disable no-unused-vars */
+/* All Page Init */
+const version = '2023.6.7'
+const apiEndpoint = 'https://owlboard.info/api'
+
 /* Feature Detectors */

 /* Valid values for ${type}: localstorage, sessionstorage */
 async function storageAvailable(type) {  // Currently not used
-    try {
-        let storage = window[type];
-        let x = '__storage_test__';
-        storage.setItem(x, "test");
-        storage.getItem(x);
-        storage.removeItem(x);
-        log(`lib.main.storageAvailable: ${type} is available`, "INFO")
-        return true;
-    } catch (err) {
-        log(`lib.main.storageAvailable: ${type} is not available`, "ERR")
-        return false;
-    }
+  try {
+    let storage = window[type]
+    let x = '__storage_test__'
+    storage.setItem(x, 'test')
+    storage.getItem(x)
+    storage.removeItem(x)
+    log(`lib.main.storageAvailable: ${type} is available`, 'INFO')
+    return true
+  } catch (err) {
+    log(`lib.main.storageAvailable: ${type} is not available`, 'ERR')
+    return false
+  }
+}
+
+async function versionDisplay() { // Outputs version string on to any page with a tag with id="ver_str"
+  localStorage.setItem('version', version)
+  document.getElementById('ver_str').textContent = version
+  return
 }

 /* Array Converter
   Converts a string to a single item array */
 async function makeArray(data) {
-    if (!Array.isArray(data)) {
-        var array = [];
-        array.push(data);
-        return array;
-    }
-    return data;
+  if (!Array.isArray(data)) {
+    var array = []
+    array.push(data)
+    return array
+  }
+  return data
 }

 /* Timeouts */
 /* Usage: '' */
-const delay = ms => new Promise(res => setTimeout(res, ms));
+const delay = ms => new Promise(res => setTimeout(res, ms))


 /* Log Helper */
-/* Values for level: 1, 2, 3 */
 /* Maintains backwards compatibility for previous
   implementation of log helper */
 async function log(msg, type) {
-    var time = new Date().toISOString();
-    switch (type) {
-        case "ERR":
-            console.error(`${time} - ${msg}`);
-            break;
-        case "WARN":
-            console.warn(`${time} - ${msg}`);
-            break;
-        case "INFO":
-            console.info(`${time} - ${msg}`);
-            break;
-        default:
-            console.log(`${time} - ${msg}`);
-            break;
-    };
-};
+  const mode = 'dev'
+  if (mode === 'prod' && type != 'ERR') {
+    return
+  }
+  var time = new Date().toISOString()
+  switch (type) {
+  case 'ERR':
+    console.error(`${time} - ${msg}`)
+    break
+  case 'WARN':
+    console.warn(`${time} - ${msg}`)
+    break
+  case 'INFO':
+    console.info(`${time} - ${msg}`)
+    break
+  default:
+    console.log(`${time} - ${msg}`)
+    break
+  }
+}

 /* Show/Hide - Menu Control */
 async function sidebarOpen() {
-    document.getElementById("sidebar").style.width = "50%";
-    document.getElementById("sidebar_open_short").style.display = "none";
-    document.getElementById("sidebar_close_short").style.display = "block";
-  }
+  document.getElementById('sidebar').style.width = '50%'
+  document.getElementById('sidebar_open_short').style.display = 'none'
+  document.getElementById('sidebar_close_short').style.display = 'block'
+}
  
-  async function sidebarClose() {
-    document.getElementById("sidebar").style.width = "0%"
-    document.getElementById("sidebar_open_short").style.display = "block";
-    document.getElementById("sidebar_close_short").style.display = "none";
-  }
+async function sidebarClose() {
+  document.getElementById('sidebar').style.width = '0%'
+  document.getElementById('sidebar_open_short').style.display = 'block'
+  document.getElementById('sidebar_close_short').style.display = 'none'
+}

 /* Loading Box Control */
 async function hideLoading() {
-    document.getElementById("loading").style = "display: none;";
+  document.getElementById('loading').style = 'display: none;'
 }

-    /* DEPRECIATED: Alias for hideLoading() - Marked for removal*/
-    async function clearLoading() {
-        log("Depreciated function called - clearLoading() - Alias to hideLoading()", "WARN")
-        await hideLoading();
-    }
+/* DEPRECIATED: Alias for hideLoading() - Marked for removal*/
+async function clearLoading() {
+  log('Depreciated function called - clearLoading() - Alias to hideLoading()', 'WARN')
+  hideLoading()
+}

 async function showLoading() {
-    document.getElementById("loading").style = "display: block;";
+  document.getElementById('loading').style = 'display: block;'
 }

 async function setLoadingDesc(desc) {
-    document.getElementById("loading_desc").textContent = `${desc}`;
+  document.getElementById('loading_desc').textContent = `${desc}`
 }

 /* Fetch User Settings */
 async function getQuickLinks() {
-    var defaults =
-                ["bri","lwh","srd","mtp","rda","cfn",
-                "sml","shh","pri","avn","sar","svb"];
-    try {
-        if (localStorage.getItem("qlOpt")) {
-            var data = JSON.parse(localStorage.getItem("qlOpt"));
-        } else {
-            data = defaults;
-        }
-    } catch (err) {
-        data = defaults;
+  var defaults =
+                ['bri','lwh','srd','mtp','rda','cfn',
+                  'sml','shh','pri','avn','sar','svb']
+  try {
+    if (localStorage.getItem('qlOpt')) {
+      var data = JSON.parse(localStorage.getItem('qlOpt'))
+    } else {
+      data = defaults
    }
-    return data.sort();
+  } catch (err) {
+    data = defaults
+  }
+  return data.sort()
 }

 /* Fetch a known query parameter from the pages URL */
 async function getQuery(param) {
-    var params = new URLSearchParams(window.location.search)
-    var query = params.get(param)
-    if (query) {
-        return query
-    } else {
-        return 'false'
+  var params = new URLSearchParams(window.location.search)
+  var query = params.get(param)
+  if (query) {
+    return query
+  } else {
+    return 'false'
+  }
+}
+
+async function getApi(path,auth = false) {
+  let apiVer = 'v1'
+  let url = `${apiEndpoint}/${apiVer}/${path}`
+  log(`getApi: Fetching from endpoint: ${url}, Auth=${auth}`)
+  let options
+  if (auth) {
+    let key = localStorage.getItem('uuid')
+    options = {
+      method: 'GET',
+      redirect: 'follow',
+      headers: {
+        'uuid': key
+      }
    }
+  } else {
+    options = {
+      method: 'GET',
+      redirect: 'follow'
+    }
+  }
+  try {
+    var resp = await fetch(url, options)
+    var json = await resp.json()
+    log(`resp.status: ${resp.status}`)
+    log(`resp.json: ${json}`)
+    if (resp.status != 200) {
+      log(`lib.main: getApi: Response status: ${resp.status}`)
+      return resp.status
+    }
+    if (!resp.ok) {
+      log('lib.main: getApi: Fetch error')
+      return false
+    }
+    return json
+  } catch(err) {
+    log(`lib.main: getApi: Caught fetch error.  Status: ${resp.status}`)
+    return resp.status
+  }
+}
+
+async function showHideAuthNotice() {
+  let uuid = localStorage.getItem('uuid')
+  if (uuid) {
+    document.getElementById('auth-required').style = 'display:none'
+  }
 }

 async function vibe(type) {
-    let canVibrate = "vibrate" in navigator || "mozVibrate" in navigator
-    if (canVibrate && !("vibrate" in navigator)){
-        navigator.vibrate = navigator.mozVibrate
-    }
-    switch (type) {
-        case "err":
-            navigator.vibrate([300])
-            break;
-        case "ok":
-            navigator.vibrate([50,50,50])
-            break;
-        default:
-            navigator.vibrate(30)
-    }
+  let canVibrate = 'vibrate' in navigator || 'mozVibrate' in navigator
+  if (canVibrate && !('vibrate' in navigator)){
+    navigator.vibrate = navigator.mozVibrate
+  }
+  switch (type) {
+  case 'err':
+    navigator.vibrate([300])
+    break
+  case 'ok':
+    navigator.vibrate([50,50,50])
+    break
+  default:
+    navigator.vibrate(30)
+  }
 }

-async function convertUnixLocal(unix) {
-    var jsTime = unix*1000
-    var dt = new Date(jsTime)
-    return dt.toLocaleString()
+async function convertUnixLocal(unix) { // Convert unix time string to local
+  var jsTime = unix*1000
+  var dt = new Date(jsTime)
+  return dt.toLocaleString()
 }
--- a/js/pis.js
+++ b/js/pis.js
@ -0,0 +1,130 @@
+/* eslint-disable no-unused-vars */
+hideLoading()
+versionDisplay()
+showHideAuthNotice()
+
+async function findByOrigDest() {
+  showLoading()
+  const formData = await fetchOrigDest()
+  log(`findByOrigDest: Searching for PIS Code for ${JSON.stringify(formData)}`)
+  const endpoint = `pis/origdest/${formData.origin}/${formData.destination}`
+  console.time('findByOrigDest-GET')
+  const json = await getApi(endpoint, auth = true)
+  console.timeEnd('findByOrigDest-GET')
+  if (json == false) {
+    await displayNoData()
+  } else if (json == 401) {
+    await displayUnauthorised()
+  } else {
+    await insertData(json)
+  }
+  document.getElementById('crs-box').style = 'display:none'
+  document.getElementById('result-box').style = 'display:block'
+  hideLoading()
+}
+
+async function findByHeadcode() {
+  showLoading()
+  const formData = await fetchHeadcode()
+  window.location.assign(`./train-detail.html?headcode=${formData}`)
+}
+
+async function findByPisCode() {
+  showLoading()
+  const formData = await fetchPisCode()
+  log(`findByPisCode: Searching for PIS Code ${formData}`)
+  const endpoint = `pis/code/${formData}`
+  console.time('findByPisCode-GET')
+  const json = await getApi(endpoint, auth = true)
+  console.timeEnd('findByPisCode-GET')
+  if (json == false) {
+    await displayNoData()
+  } else if (json == 401) {
+    await displayUnauthorised()
+  } else {
+    await insertData(json)
+  }
+  document.getElementById('crs-box').style = 'display:none'
+  document.getElementById('result-box').style = 'display:block'
+  hideLoading()
+}
+
+async function findRandomCode() {
+  showLoading()
+  log('findRandomCode: Fetching random PIS codes')
+  const endpoint = 'pis/code/random'
+  console.time('findRandomCode-GET')
+  const json = await getApi(endpoint, auth = true)
+  console.timeEnd('findRandomCode-GET')
+  if (json == false) {
+    await displayNoData()
+  } else if (json == 401) {
+    await displayUnauthorised()
+  } else {
+    await insertData(json)
+  }
+  document.getElementById('crs-box').style = 'display:none'
+  document.getElementById('result-box').style = 'display:block'
+  hideLoading()
+}
+
+async function fetchOrigDest() {
+  var orig = document.getElementById('origin').value
+  var dest = document.getElementById('destination').value
+  return {origin: orig, destination: dest}
+}
+
+async function fetchPisCode() {
+  return document.getElementById('pis').value
+}
+
+async function fetchHeadcode() {
+  return document.getElementById('headcode').value
+}
+
+async function insertData(json) {
+  // Receives the JSON Respose ([{},{}]) containing one or more possible
+  // PIS codes.  Display the code and the stops with a method of scrolling between them.
+  // Maybe as a table or a carousel?
+  console.time('insertData')
+  const div = document.getElementById('result-box')
+  let tableData = `<table id="result-table">
+        <tr>
+        <th>Code</th>
+        <th>Stations</th>
+        </tr>`
+  let results = 0
+  for(var i = 0; i < json.length; i++) {  // Hopefully can style output with CSS
+    tableData += `<tr><td class="pis-code">${json[i]['code']}</td>
+            <td class="station">${json[i]['stops'].join(', ')}</td></tr>`
+    results++
+  }
+  tableData += '</table>'
+  div.insertAdjacentHTML('beforeend', tableData)
+  document.getElementById('result-count').textContent = results.toString()
+  console.timeEnd('insertData')
+}
+
+async function displayNoData() {
+  const msg = '<p id="result-table">No results found</p>'
+  document.getElementById('result-box').insertAdjacentHTML('beforeend', msg)
+}
+
+async function displayUnauthorised() {
+  const msg = '<p id="result-table">Unauthorised - please ensure you are logged into the <a href="../settings.html#railstaff">rail staff version</a></p>'
+  document.getElementById('result-box').insertAdjacentHTML('beforeend', msg)
+}
+
+async function reset() {
+  try {
+    document.getElementById('origin').value = ''
+    document.getElementById('destination').value = ''
+    document.getElementById('pis').value = ''
+    document.getElementById('result-box').style = 'display:none'
+    document.getElementById('result-table').remove()
+    document.getElementById('crs-box').style = 'display:block'
+    document.getElementById('result-count').textContent = 0
+  } catch(e) {
+    log('Nothing to reset')
+  }
+}
--- a/js/registered.js
+++ b/js/registered.js
@ -0,0 +1,19 @@
+versionDisplay()
+init()
+
+async function init(){
+  let result = await getQuery('res')
+  if (result == 'success') {
+    document.getElementById('reg_success').style = 'display:block'
+  } else if (result =='fail') {
+    let reason = await getQuery('msg')
+    document.getElementById('reg_fail').style = 'display:block'
+    if (reason != 'false') {
+      document.getElementById('fail_msg').style = 'display:block'
+      document.getElementById('fail_reason').textContent = reason
+    }
+  } else {
+    document.getElementById('other').style = 'display:block'
+  }
+  hideLoading()
+}
--- a/js/settings.js
+++ b/js/settings.js
@ -1,57 +1,120 @@
+/* eslint-disable no-unused-vars */
+//
 // Init:
-const ql = ["ql0","ql1","ql2","ql3","ql4","ql5","ql6","ql7","ql8","ql9","ql10","ql11"]
-storageAvailable("localStorage");
-getQl();
-hideLoading();
+//
+// Setup quick links
+const ql = ['ql0','ql1','ql2','ql3','ql4','ql5','ql6','ql7','ql8','ql9','ql10','ql11']
+storageAvailable('localStorage')
+getQl()
+// Check if already registered
+ifAlreadyRegistered()
+// Hide loading
+hideLoading()

-async function getQl(){
-    var qlOpt = await getQuickLinks()
-    if (qlOpt){
-        var i = 0
-        while (i < 12) {
-            if (qlOpt[i] != 'undefined') {
-                document.getElementById(`ql${i}`).value = qlOpt[i]
-                i +=1
-            }
-        }
+async function ifAlreadyRegistered() { // If already registered, show this on the page
+  if (! await isRegistered()) {
+    return null
+  } else {
+    document.getElementsByName('eml')[0].placeholder = 'Registered'
+    document.getElementById('reg_text').textContent = 'You are already registered'
+    document.getElementById('reg_button').textContent = 'Log Out'
+  }
+}
+
+async function getQl(){ // Fetch Quick Links from localstorage
+  var qlOpt = await getQuickLinks()
+  if (qlOpt){
+    var i = 0
+    while (i < 12) {
+      if (qlOpt[i] != 'undefined') {
+        document.getElementById(`ql${i}`).value = qlOpt[i]
+        i +=1
+      }
    }
+  }
 }

-async function setQl(){
-    await showLoading();
-    var qlSet = []
-    for (i in ql) {
-        var opt = document.getElementById(`ql${i}`).value
-        if (opt != ""){
-            qlSet.push(opt)
-        }
-        qlSet.sort()
+async function setQl(){ // Fetch Quick Links from text input and save to localstorage
+  await showLoading()// called as an onclick function
+  var qlSet = []
+  for (i in ql) {
+    var opt = document.getElementById(`ql${i}`).value
+    if (opt != ''){
+      qlSet.push(opt)
    }
-    localStorage.setItem("qlOpt", JSON.stringify(qlSet))
-    log(`settings.setQl: User settings saved`, "INFO")
-    await hideLoading();
-    await showDone();
-    vibe("ok")
-    await delay(800);
-    hideDone();
+    qlSet.sort()
+  }
+  localStorage.setItem('qlOpt', JSON.stringify(qlSet))
+  log('settings.setQl: User settings saved', 'INFO')
+  await hideLoading()
+  await showDone()
+  vibe('ok')
+  await delay(800)
+  hideDone()
 }

-async function clearQl(){
-    showLoading();
-    localStorage.removeItem("qlOpt")
-    log(`settings.setQl: User settings reset to default`, "INFO")
-    getQl()
-    await hideLoading();
-    await showDone();
-    vibe("ok");
-    await delay(800);
-    hideDone();
+async function clearQl(){ // Clear Quick Links from localstorage
+  showLoading()
+  localStorage.removeItem('qlOpt')
+  log('settings.setQl: User settings reset to default', 'INFO')
+  getQl()
+  await hideLoading()
+  await showDone()
+  vibe('ok')
+  await delay(800)
+  hideDone()
 }

-async function showDone() {
-    document.getElementById("done").style = "opacity: 1";
+async function isRegistered() { // Check if a device is registered, returns BOOL
+  if (localStorage.getItem('uuid')) {
+    return true
+    // Also need an API Call here to check if auth is working.
+    // A Suitable function exists in auth.js - move it to lib.main.js
+  }
+  localStorage.removeItem('uuid')
+  return false
 }

-async function hideDone() {
-    document.getElementById("done").style = "opacity: 0";
+async function register() { // Registers a device by sending POST request to API Server
+  if (! await isRegistered()) {
+    showLoading()
+    let url = `${apiEndpoint}/v1/register/request`
+    let email = document.getElementById('eml').value
+    let res = await fetch(url, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      redirect: 'follow',
+      body: JSON.stringify({email: email})
+    })
+    let regState, regMsg
+    if (res.status == 201) {
+      regState = 'success'
+      regMsg = 'ok'
+    } else if (res.status == 403) {
+      log(`settings.register: Error: Fetch returned: ${res.body['errorCode']}`, 'err')
+      document.getElementsByName('eml')[0].placeholder = 'Not Authorised'
+      regState = 'fail'
+      regMsg = 'Unauthorised email domain'
+    }
+    window.location.assign(`./registered.html?res=${regState}&msg=${regMsg}`)
+  } else {
+    logout()
+  }
+}
+
+async function logout() { // Simply removed the UUID from localstorage
+  // A request to delete the UUID should be sent to the server.
+  localStorage.removeItem('uuid')
+  location.reload()
+  return
+}
+
+async function showDone() { // Diaplays the 'Done' dialogue.
+  document.getElementById('done').style = 'opacity: 1; display: block'
+}
+
+async function hideDone() { // Hides the 'Done' dialogue.
+  document.getElementById('done').style = 'opacity: 0; display: none'
 }
--- a/js/simple-board.js
+++ b/js/simple-board.js
@ -1,131 +1,132 @@
 /* Page Init: */
+// Run the init function at page load.
 init()

 /* Init function */
-async function init() {
-    console.time("Loading Time")
-    setLoadingDesc(`Loading\nservices`)
-    var stn = await getQuery("stn");
-    setLoadingDesc(`Loading\n${stn.toUpperCase()}`)
-    log(`init: Looking up: ${stn}`);
-    var sv = await getQuery("sv");
-    log(`init: Staff Version: ${sv}`);
-    if (sv === 'true') {
-        log("init: Staff Version not supported yet.")
-        log("init: Unable to proceed.")
-    } else {
-        try {
-            var data = await publicLdb(stn)
-            setLoadingDesc(`${stn.toUpperCase()}\nParsing Data`)
-            log("simple-board.init: Fetched LDB Data", "INFO")
-        } catch (err) {
-            var data = "err"
-            setLoadingDesc(`Waiting\nConnection`)
-            log(`simple-board.init: Error fetching data: ${err}`, "ERR")
-        }
-        parseLdb(data)
+async function init() { // Gets query string and then fetch API response and pass to parsing function
+  console.time('Time: Init to Complete')
+  setLoadingDesc('Loading\nservices')
+  var stn = await getQuery('stn')
+  setLoadingDesc(`Loading\n${stn.toUpperCase()}`)
+  log(`init: Looking up: ${stn}`)
+  var sv = await getQuery('sv')
+  log(`init: Staff Version: ${sv}`)
+  if (sv === 'true') {
+    log('init: Staff Version not supported yet.')
+    log('init: Unable to proceed.')
+  } else {
+    let data
+    try {
+      data = await publicLdb(stn)
+      setLoadingDesc(`${stn.toUpperCase()}\nParsing Data`)
+      log('simple-board.init: Fetched LDB Data', 'INFO')
+    } catch (err) {
+      data = 'err'
+      setLoadingDesc('Waiting\nConnection')
+      log(`simple-board.init: Error fetching data: ${err}`, 'ERR')
    }
+    parseLdb(data)
+  }
 }

 /* Check for any errors in data returned from the Fetch call
   If no errors, if there are none, call buildPage(). */
 async function parseLdb(data) {
-    if (data.ERROR == "NOT_FOUND") { // Station not found
-        hideLoading();
-        document.getElementById("error_notice").style = "display: block;";
-        document.getElementById("err_not_found").style = "display: block;";
-        setHeaders("Not Found",new Date())
-    } else if (data == false) {  // No data for station
-        hideLoading();
-        document.getElementById("error_notice").style = "display: block;";
-        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())
-        showLoading();
-        await delay(5000);
-        log(`parseLdb: Passing to error handler`, "ERR")
-        errorHandler();
-    } else {
-        buildPage(data);
-    }
+  if (data.ERROR == 'NOT_FOUND') { // Station not found
+    hideLoading()
+    document.getElementById('error_notice').style = 'display: block;'
+    document.getElementById('err_not_found').style = 'display: block;'
+    setHeaders('Not Found',new Date())
+  } else if (data == false) {  // No data for station
+    hideLoading()
+    document.getElementById('error_notice').style = 'display: block;'
+    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())
+    showLoading()
+    await delay(5000)
+    log('parseLdb: Passing to error handler', 'ERR')
+    errorHandler()
+  } else {
+    buildPage(data)
+  }
 }

 // Build and Display Functions
 async function buildPage(data) {
-    setLoadingDesc('Loading\nData')
-    var stationName = data.GetStationBoardResult.locationName;
-    log(`buildPage: Data ready for ${stationName}`);
-    var generateTime = new Date(await data.GetStationBoardResult.generatedAt);
-    log(`buildPage: Data prepared at ${generateTime.toLocaleString()}`)
-    setHeaders(stationName, generateTime);
-    // Check for notices and if true pass to function
-    if (data.GetStationBoardResult.nrccMessages) {
-        setLoadingDesc('Loading\nAlerts')
-        await displayAlerts(await makeArray(data.GetStationBoardResult.nrccMessages.message));
-    }
-    if (data.GetStationBoardResult.trainServices) {
-        setLoadingDesc('Loading\nTrains')
-        displayTrains(await makeArray(data.GetStationBoardResult.trainServices.service))
-    } else {
-        displayNoTrains()
-    }
-    if (data.GetStationBoardResult.ferryServices) {
-        setLoadingDesc('Loading\nFerries')
-        displayFerry(await makeArray(data.GetStationBoardResult.ferryServices.service))
-    }
-    if (data.GetStationBoardResult.busServices) {
-        setLoadingDesc('Loading\nBusses')
-        displayBus(await makeArray(data.GetStationBoardResult.busServices.service))
-    }
-    console.timeEnd("Loading Time")
+  setLoadingDesc('Loading\nData')
+  var stationName = data.GetStationBoardResult.locationName
+  log(`buildPage: Data ready for ${stationName}`)
+  var generateTime = new Date(await data.GetStationBoardResult.generatedAt)
+  log(`buildPage: Data prepared at ${generateTime.toLocaleString()}`)
+  setHeaders(stationName, generateTime)
+  // Check for notices and if true pass to function
+  if (data.GetStationBoardResult.nrccMessages) {
+    setLoadingDesc('Loading\nAlerts')
+    await displayAlerts(await makeArray(data.GetStationBoardResult.nrccMessages.message))
+  }
+  if (data.GetStationBoardResult.trainServices) {
+    setLoadingDesc('Loading\nTrains')
+    displayTrains(await makeArray(data.GetStationBoardResult.trainServices.service))
+  } else {
+    displayNoTrains()
+  }
+  if (data.GetStationBoardResult.ferryServices) {
+    setLoadingDesc('Loading\nFerries')
+    displayFerry(await makeArray(data.GetStationBoardResult.ferryServices.service))
+  }
+  if (data.GetStationBoardResult.busServices) {
+    setLoadingDesc('Loading\nBusses')
+    displayBus(await makeArray(data.GetStationBoardResult.busServices.service))
+  }
+  hideLoading()
+  console.timeEnd('Time: Init to Complete')
 }


-async function displayTrains(data) {
-    log(`simple-board.displayTrains: Inserting data in DOM`)
-    for(var i = 0; i < data.length; i++) {
-        // Reset Vars
-        var svc = data[i];
-        displayService(svc);
-        buildCallLists(svc);
-    }
-
-    hideLoading();
-    document.getElementById("output").style = "display:block;";
-    log(`simple-board.displayTrains: Insertion complete`)
+async function displayTrains(data) { // Iterated through train services and passes API sections to other functions
+  log('simple-board.displayTrains: Inserting data in DOM')
+  for(var i = 0; i < data.length; i++) {
+    // Reset Vars
+    var svc = data[i]
+    displayService(svc)
+    buildCallLists(svc)
+  }
+  document.getElementById('output').style = 'display:block;'
+  log('simple-board.displayTrains: Insertion complete')
 }

-async function displayFerry(ferrySvc) {
-    for(var i = 0; i < ferrySvc.length; i++) {
-        displayFerryService(ferrySvc[i])
-    }
+async function displayFerry(ferrySvc) { // Iterates through each ferry service and passes to another function
+  for(var i = 0; i < ferrySvc.length; i++) {
+    displayFerryService(ferrySvc[i])
+  }
 }

-async function displayBus(busSvc) {
-    for(var i = 0; i < busSvc.length; i++) {
-        displayBusService(busSvc[i])
-        buildCallLists(busSvc[i])
-    }
+async function displayBus(busSvc) { // Iterates through each bus service and passes to other functions.
+  for(var i = 0; i < busSvc.length; i++) {
+    displayBusService(busSvc[i])
+    buildCallLists(busSvc[i])
+  }
 }

-async function displayService(svc) {
-    var table = document.getElementById("output");
+async function displayService(svc) { // Creates a table row from each train service.
+  var table = document.getElementById('output')
 
-    // Determine Time Message
-    var sta = await parseTime(svc.sta);
-    var eta = await parseTime(svc.eta);
-    var std = await parseTime(svc.std);
-    var etd = await parseTime(svc.etd);
-    // Determine Platform Message
-    //if (svc.platform != undefined){var plt = svc.platform} else {var plt = "-"};
-    var plt = await parsePlatform(svc);
-    // Define Table Row
-    var row = `
+  // Determine Time Message
+  var sta = await parseTime(svc.sta)
+  var eta = await parseTime(svc.eta)
+  var std = await parseTime(svc.std)
+  var etd = await parseTime(svc.etd)
+  // Determine Platform Message
+  //if (svc.platform != undefined){var plt = svc.platform} else {var plt = "-"};
+  var plt = await parsePlatform(svc)
+  // Define Table Row
+  var row = `
    <table>
      <tr>
        <td class="name name-item" onclick="showCalls('${svc.serviceID}')">${await parseName(svc.origin.location)}</td>
@ -137,36 +138,41 @@ async function displayService(svc) {
        <td class="time ${etd.changed}">${etd.data}</td>
      </tr>
    </table>`
-    // Put Table Row
-    table.insertAdjacentHTML("beforeend", row)
-    // Display Operator
-    if (svc.operator) {
-        var opRow = `<p class="msg op">A ${svc.operator} service</p>`
-        table.insertAdjacentHTML("beforeend", opRow);
+  // Put Table Row
+  table.insertAdjacentHTML('beforeend', row)
+  // Display Operator where provided (it always will be, I think)
+  if (svc.operator) {
+    var opRow = `<p class="msg op">A ${svc.operator} service`
+    if (svc.length) { // Displays number of carriages where provided
+      opRow += ` with ${svc.length} carriages</p>`
+    } else {
+      opRow += '</p>'
    }
-    // Parse cancelReason & delayReason
-    if (svc.cancelReason) {
-        var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
-        table.insertAdjacentHTML("beforeend", cancelRow);
-    }
-    if (svc.delayReason) {
-        var delayRow = `<p class="msg">${svc.delayReason}</p>`
-        table.insertAdjacentHTML("beforeend", delayRow);
-    }    
+    table.insertAdjacentHTML('beforeend', opRow)
+  }
+  // Parse cancelReason and then delayReason
+  if (svc.cancelReason) {
+    var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
+    table.insertAdjacentHTML('beforeend', cancelRow)
+  }
+  if (svc.delayReason) {
+    var delayRow = `<p class="msg">${svc.delayReason}</p>`
+    table.insertAdjacentHTML('beforeend', delayRow)
+  }    
 }

-async function displayFerryService(svc) {
-    var table = document.getElementById("ferry");
-    log(JSON.stringify(svc))
-    // Determine Time Message
-    var sta = await parseTime(svc.sta);
-    var eta = await parseTime(svc.eta);
-    var std = await parseTime(svc.std);
-    var etd = await parseTime(svc.etd);
-    // Determine Platform Message
-    var plt = "";
-    // Define Table Row
-    var row = `
+async function displayFerryService(svc) { // Creates a table for for each ferry service
+  var table = document.getElementById('ferry')
+  log(JSON.stringify(svc))
+  // Determine Time Message
+  var sta = await parseTime(svc.sta)
+  var eta = await parseTime(svc.eta)
+  var std = await parseTime(svc.std)
+  var etd = await parseTime(svc.etd)
+  // Determine Platform Message
+  var plt = ''
+  // Define Table Row
+  var row = `
    <table>
      <tr>
        <td class="name name-item">${await parseName(svc.origin.location)}</td>
@ -178,32 +184,32 @@ async function displayFerryService(svc) {
        <td class="time ${etd.changed}">${etd.data}</td>
      </tr>
    </table>`
-    // Put Table Row
-    table.insertAdjacentHTML("beforeend", row)
-    // Parse cancelReason & delayReason
-    if (svc.cancelReason) {
-        var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
-        table.insertAdjacentHTML("beforeend", cancelRow);
-    }
-    if (svc.delayReason) {
-        var delayRow = `<p class="msg">${svc.delayReason}</p>`
-        table.insertAdjacentHTML("beforeend", delayRow);
-    }
-    document.getElementById("ferry").style = "display:block"
+  // Put Table Row
+  table.insertAdjacentHTML('beforeend', row)
+  // Parse cancelReason & delayReason
+  if (svc.cancelReason) {
+    var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
+    table.insertAdjacentHTML('beforeend', cancelRow)
+  }
+  if (svc.delayReason) {
+    var delayRow = `<p class="msg">${svc.delayReason}</p>`
+    table.insertAdjacentHTML('beforeend', delayRow)
+  }
+  document.getElementById('ferry').style = 'display:block'
 }

-async function displayBusService(svc) {
-    var table = document.getElementById("bus");
-    log(JSON.stringify(svc))
-    // Determine Time Message
-    var sta = await parseTime(svc.sta);
-    var eta = await parseTime(svc.eta);
-    var std = await parseTime(svc.std);
-    var etd = await parseTime(svc.etd);
-    // Determine Platform Message
-    var plt = "";
-    // Define Table Row
-    var row = `
+async function displayBusService(svc) { // Creates a table row for each bus service.
+  var table = document.getElementById('bus')
+  log(JSON.stringify(svc))
+  // Determine Time Message
+  var sta = await parseTime(svc.sta)
+  var eta = await parseTime(svc.eta)
+  var std = await parseTime(svc.std)
+  var etd = await parseTime(svc.etd)
+  // Determine Platform Message
+  var plt = ''
+  // Define Table Row
+  var row = `
    <table>
      <tr>
        <td class="name name-item" onclick="showCalls('${svc.serviceID}')">${svc.origin.location.locationName}</td>
@ -215,21 +221,21 @@ async function displayBusService(svc) {
        <td class="time ${etd.changed}">${etd.data}</td>
      </tr>
    </table>`
-    // Put Table Row
-    table.insertAdjacentHTML("beforeend", row)
-    // Display operator
-    if (svc.operator) {
-        var opRow = `<p class="msg op">A ${svc.operator} service</p>`
-        table.insertAdjacentHTML("beforeend", opRow);
-    }
-    // Parse cancelReason & delayReason
-    if (svc.cancelReason) {
-        var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
-        table.insertAdjacentHTML("beforeend", cancelRow);
-    }
-    if (svc.delayReason) {
-        var delayRow = `<p class="msg">${svc.delayReason}</p>`
-        table.insertAdjacentHTML("beforeend", delayRow);
-    }
-    document.getElementById("bus").style = "display:block"
+  // Put Table Row
+  table.insertAdjacentHTML('beforeend', row)
+  // Display operator
+  if (svc.operator) {
+    var opRow = `<p class="msg op">A ${svc.operator} service</p>`
+    table.insertAdjacentHTML('beforeend', opRow)
+  }
+  // Parse cancelReason & delayReason
+  if (svc.cancelReason) {
+    var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
+    table.insertAdjacentHTML('beforeend', cancelRow)
+  }
+  if (svc.delayReason) {
+    var delayRow = `<p class="msg">${svc.delayReason}</p>`
+    table.insertAdjacentHTML('beforeend', delayRow)
+  }
+  document.getElementById('bus').style = 'display:block'
 }
--- a/js/staff-board.js
+++ b/js/staff-board.js
@ -0,0 +1,241 @@
+/* Page Init: */
+// Run the init function at page load.
+init()
+
+/* Init function */
+async function init() { // Gets query string and then fetch API response and pass to parsing function
+  console.time('Time: Init to Complete')
+  setLoadingDesc('Loading\nservices')
+  var stn = await getQuery('stn')
+  setLoadingDesc(`Loading\n${stn.toUpperCase()}`)
+  log(`init: Looking up: ${stn}`)
+  var sv = await getQuery('sv')
+  log(`init: Staff Version: ${sv}`)
+  if (sv === 'true') {
+    log('init: Staff Version not supported yet.')
+    log('init: Unable to proceed.')
+  } else {
+    let data
+    try {
+      data = await publicLdb(stn)
+      setLoadingDesc(`${stn.toUpperCase()}\nParsing Data`)
+      log('simple-board.init: Fetched LDB Data', 'INFO')
+    } catch (err) {
+      data = 'err'
+      setLoadingDesc('Waiting\nConnection')
+      log(`simple-board.init: Error fetching data: ${err}`, 'ERR')
+    }
+    parseLdb(data)
+  }
+}
+
+/* Check for any errors in data returned from the Fetch call
+   If no errors, if there are none, call buildPage(). */
+async function parseLdb(data) {
+  if (data.ERROR == 'NOT_FOUND') { // Station not found
+    hideLoading()
+    document.getElementById('error_notice').style = 'display: block;'
+    document.getElementById('err_not_found').style = 'display: block;'
+    setHeaders('Not Found',new Date())
+  } else if (data == false) {  // No data for station
+    hideLoading()
+    document.getElementById('error_notice').style = 'display: block;'
+    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())
+    showLoading()
+    await delay(5000)
+    log('parseLdb: Passing to error handler', 'ERR')
+    errorHandler()
+  } else {
+    buildPage(data)
+  }
+}
+
+// Build and Display Functions
+async function buildPage(data) {
+  setLoadingDesc('Loading\nData')
+  var stationName = data.GetStationBoardResult.locationName
+  log(`buildPage: Data ready for ${stationName}`)
+  var generateTime = new Date(await data.GetStationBoardResult.generatedAt)
+  log(`buildPage: Data prepared at ${generateTime.toLocaleString()}`)
+  setHeaders(stationName, generateTime)
+  // Check for notices and if true pass to function
+  if (data.GetStationBoardResult.nrccMessages) {
+    setLoadingDesc('Loading\nAlerts')
+    await displayAlerts(await makeArray(data.GetStationBoardResult.nrccMessages.message))
+  }
+  if (data.GetStationBoardResult.trainServices) {
+    setLoadingDesc('Loading\nTrains')
+    displayTrains(await makeArray(data.GetStationBoardResult.trainServices.service))
+  } else {
+    displayNoTrains()
+  }
+  if (data.GetStationBoardResult.ferryServices) {
+    setLoadingDesc('Loading\nFerries')
+    displayFerry(await makeArray(data.GetStationBoardResult.ferryServices.service))
+  }
+  if (data.GetStationBoardResult.busServices) {
+    setLoadingDesc('Loading\nBusses')
+    displayBus(await makeArray(data.GetStationBoardResult.busServices.service))
+  }
+  hideLoading()
+  console.timeEnd('Time: Init to Complete')
+}
+
+
+async function displayTrains(data) { // Iterated through train services and passes API sections to other functions
+  log('simple-board.displayTrains: Inserting data in DOM')
+  for(var i = 0; i < data.length; i++) {
+    // Reset Vars
+    var svc = data[i]
+    displayService(svc)
+    buildCallLists(svc)
+  }
+  document.getElementById('output').style = 'display:block;'
+  log('simple-board.displayTrains: Insertion complete')
+}
+
+async function displayFerry(ferrySvc) { // Iterates through each ferry service and passes to another function
+  for(var i = 0; i < ferrySvc.length; i++) {
+    displayFerryService(ferrySvc[i])
+  }
+}
+
+async function displayBus(busSvc) { // Iterates through each bus service and passes to other functions.
+  for(var i = 0; i < busSvc.length; i++) {
+    displayBusService(busSvc[i])
+    buildCallLists(busSvc[i])
+  }
+}
+
+async function displayService(svc) { // Creates a table row from each train service.
+  var table = document.getElementById('output')
+ 
+  // Determine Time Message
+  var sta = await parseTime(svc.sta)
+  var eta = await parseTime(svc.eta)
+  var std = await parseTime(svc.std)
+  var etd = await parseTime(svc.etd)
+  // Determine Platform Message
+  //if (svc.platform != undefined){var plt = svc.platform} else {var plt = "-"};
+  var plt = await parsePlatform(svc)
+  // Define Table Row
+  var row = `
+    <table>
+      <tr>
+        <td class="name name-item" onclick="showCalls('${svc.serviceID}')">${await parseName(svc.origin.location)}</td>
+        <td class="name name-item" onclick="showCalls('${svc.serviceID}')">${await parseName(svc.destination.location)}</td>
+        <td class="plat ${plt.changed}">${plt.num}</td>
+        <td class="time">${sta.data}</td>
+        <td class="time ${eta.changed}">${eta.data}</td>
+        <td class="time">${std.data}</td>
+        <td class="time ${etd.changed}">${etd.data}</td>
+      </tr>
+    </table>`
+  // Put Table Row
+  table.insertAdjacentHTML('beforeend', row)
+  // Display Operator where provided (it always will be, I think)
+  if (svc.operator) {
+    var opRow = `<p class="msg op">A ${svc.operator} service`
+    if (svc.length) { // Displays number of carriages where provided
+      opRow += ` with ${svc.length} carriages</p>`
+    } else {
+      opRow += '</p>'
+    }
+    table.insertAdjacentHTML('beforeend', opRow)
+  }
+  // Parse cancelReason and then delayReason
+  if (svc.cancelReason) {
+    var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
+    table.insertAdjacentHTML('beforeend', cancelRow)
+  }
+  if (svc.delayReason) {
+    var delayRow = `<p class="msg">${svc.delayReason}</p>`
+    table.insertAdjacentHTML('beforeend', delayRow)
+  }    
+}
+
+async function displayFerryService(svc) { // Creates a table for for each ferry service
+  var table = document.getElementById('ferry')
+  log(JSON.stringify(svc))
+  // Determine Time Message
+  var sta = await parseTime(svc.sta)
+  var eta = await parseTime(svc.eta)
+  var std = await parseTime(svc.std)
+  var etd = await parseTime(svc.etd)
+  // Determine Platform Message
+  var plt = ''
+  // Define Table Row
+  var row = `
+    <table>
+      <tr>
+        <td class="name name-item">${await parseName(svc.origin.location)}</td>
+        <td class="name name-item">${await parseName(svc.destination.location)}</td>
+        <td class="plat}">${plt}</td>
+        <td class="time">${sta.data}</td>
+        <td class="time ${eta.changed}">${eta.data}</td>
+        <td class="time">${std.data}</td>
+        <td class="time ${etd.changed}">${etd.data}</td>
+      </tr>
+    </table>`
+  // Put Table Row
+  table.insertAdjacentHTML('beforeend', row)
+  // Parse cancelReason & delayReason
+  if (svc.cancelReason) {
+    var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
+    table.insertAdjacentHTML('beforeend', cancelRow)
+  }
+  if (svc.delayReason) {
+    var delayRow = `<p class="msg">${svc.delayReason}</p>`
+    table.insertAdjacentHTML('beforeend', delayRow)
+  }
+  document.getElementById('ferry').style = 'display:block'
+}
+
+async function displayBusService(svc) { // Creates a table row for each bus service.
+  var table = document.getElementById('bus')
+  log(JSON.stringify(svc))
+  // Determine Time Message
+  var sta = await parseTime(svc.sta)
+  var eta = await parseTime(svc.eta)
+  var std = await parseTime(svc.std)
+  var etd = await parseTime(svc.etd)
+  // Determine Platform Message
+  var plt = ''
+  // Define Table Row
+  var row = `
+    <table>
+      <tr>
+        <td class="name name-item" onclick="showCalls('${svc.serviceID}')">${svc.origin.location.locationName}</td>
+        <td class="name name-item" onclick="showCalls('${svc.serviceID}')">${svc.destination.location.locationName}</td>
+        <td class="plat}">${plt}</td>
+        <td class="time">${sta.data}</td>
+        <td class="time ${eta.changed}">${eta.data}</td>
+        <td class="time">${std.data}</td>
+        <td class="time ${etd.changed}">${etd.data}</td>
+      </tr>
+    </table>`
+  // Put Table Row
+  table.insertAdjacentHTML('beforeend', row)
+  // Display operator
+  if (svc.operator) {
+    var opRow = `<p class="msg op">A ${svc.operator} service</p>`
+    table.insertAdjacentHTML('beforeend', opRow)
+  }
+  // Parse cancelReason & delayReason
+  if (svc.cancelReason) {
+    var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
+    table.insertAdjacentHTML('beforeend', cancelRow)
+  }
+  if (svc.delayReason) {
+    var delayRow = `<p class="msg">${svc.delayReason}</p>`
+    table.insertAdjacentHTML('beforeend', delayRow)
+  }
+  document.getElementById('bus').style = 'display:block'
+}
--- a/js/stat.js
+++ b/js/stat.js
@ -1,25 +0,0 @@
-init();
-
-async function init() {
-    display(await get())
-}
-
-async function get() {
-    var url = `${window.location.origin}/api/v1/stats`;
-    var resp = await fetch(url);
-    return await resp.json();
-}
-
-async function display(data) {
-    document.getElementById('server_host').textContent = data.host;
-    let dat = data.dat[0]
-    console.log(JSON.stringify(dat))
-    document.getElementById('time').textContent = await convertUnixLocal(dat.since);
-    document.getElementById('ldbws').textContent = dat.ldbws || "0";
-    document.getElementById('ldbsvws').textContent = dat.ldbsvws || "0";
-    document.getElementById('apicorpus').textContent = dat.corpus_api || "0";
-    document.getElementById('corpus').textContent = dat.corpus || "0";
-    document.getElementById('stations').textContent = dat.stations || "0";
-    document.getElementById('users').textContent = dat.user || "0";
-    document.getElementById('meta').textContent = dat.meta || "0";
-}
--- a/js/stats.js
+++ b/js/stats.js
@ -0,0 +1,37 @@
+init()
+
+async function init() { // The page init function
+  versionDisplay()
+  await display(await get())
+  hideLoading()
+}
+
+async function get() { // Fetch data from API
+  var url = `${apiEndpoint}/api/v1/stats`
+  var resp = await fetch(url)
+  return await resp.json()
+}
+
+async function display(data) { // Parses and displays data from API
+  document.getElementById('server_host').textContent = data.host
+  document.getElementById('server_mode').textContent = data.mode || 'Unknown'
+  document.getElementById('ver-bkend').textContent = data.verBkend || 'Unknown'
+  let dat = data.dat[0]
+  let ver = data.ver[0]
+  document.getElementById('time').textContent = await convertUnixLocal(dat.since)
+  document.getElementById('ldbws').textContent = dat.ldbws || '0'
+  document.getElementById('ldbsvws').textContent = dat.ldbsvws || '0'
+  document.getElementById('corpus_api').textContent = dat.corpus_api || '0'
+  document.getElementById('corpus').textContent = dat.corpus || '0'
+  document.getElementById('stations').textContent = dat.stations || '0'
+  document.getElementById('users').textContent = dat.users || '0'
+  document.getElementById('meta').textContent = dat.meta || '0'
+  document.getElementById('pis').textContent = dat.pis || '0'
+  document.getElementById('timetable_count').textContent = data.count.timetable || '0'
+  document.getElementById('ver-dbman').textContent = ver.dbmanager || 'Unknown'
+  document.getElementById('user_count').textContent = data.count.users || 'Unknown'
+  document.getElementById('reg_count').textContent = data.count.reg || '0'
+  document.getElementById('pis_count').textContent = data.count.pis || 'Unknown'
+  document.getElementById('corpus_count').textContent = data.count.corpus || 'Unknown'
+  document.getElementById('stations_count').textContent = data.count.stations || 'Unknown'
+}
--- a/js/train-detail.js
+++ b/js/train-detail.js
@ -0,0 +1,124 @@
+versionDisplay()
+
+let data // Maybe this is a bad idea?
+
+init()
+
+async function init() {
+  const headcode = await getQuery('headcode')
+  if (headcode == 'false') {
+    parse([]) // Pass an empty array to parse()
+  }
+  const res = await get(headcode)
+  parse(res)
+}
+
+async function get(headcode) {
+  const apiPath = `train/headcode/today/${headcode}`
+  data = await getApi(apiPath, auth = true)
+  if (typeof data == 'number' || !data) {
+    log('train-detail.get: Status: ' + data, 'ERR')
+    return []
+  }
+  log(data, 'DBUG')
+  return data
+}
+
+async function parse(data) {
+  if (data.length >= 1) {
+    document.getElementById('train_options').style = 'display:none;'
+    displayOne(data[0])
+  }
+  displayOptions(data)
+  document.getElementById('train_data').style = 'display:block;'
+}
+
+async function displayOptions(data) {
+  if (data.length){
+  for (service in data) {
+    if (data[service]) {
+      const serviceData = data[service]
+      if (serviceData?.stops) {
+      const lastStop = serviceData?.stops[(serviceData['stops'].length - 1)]
+      log(`displayOptions: data[${service}] = ${serviceData}`, 'dbug')
+      let button = `
+      <button class='service_button' onclick='displayOne(data[${service}])'>
+        <span class='service_toc'>${serviceData?.operator || 'GW'}</span>
+        <span class='service_origin_time'>${serviceData?.stops[0]['wttDeparture']}</span>
+        <span class='service_origin_tiploc'>${serviceData?.stops[0]['tiploc']}</span>
+        to 
+        <span class='service_dest_tiploc'>${lastStop?.tiploc}</span>
+      </button>
+    `
+      document.getElementById('train_options').insertAdjacentHTML('beforeend', button)
+    }
+    document.getElementById('train_options').style = 'display:block;'
+    return data
+  }
+}}}
+
+async function displayOne(object) {
+  // Display a single service
+  const dataTableHead = `
+    <p id='data_headcode'>${object?.headcode}</p>
+    <p id='data_piscode'>PIS Code: ${object?.pis}</p>
+    <table id='data_table'>
+    <tr>
+      <th>Location</th>
+      <th>Arr.</th>
+      <th>Dep.</th>
+    </tr>
+    `
+  const dataTableClose = `
+    </table>`
+  let publicStops = []
+  let stopRows = ''
+  if (object?.stops) {
+    for (const stop of object['stops']) {
+      if (stop['isPublic']) {
+        publicStops.push(stop)
+      }
+    }
+    console.log(publicStops)
+    for (const stop of publicStops) {
+      stopRows += await createPublicStopTableRow(stop)
+    }
+    // If there are no public stops, show non-public locations
+    if (!publicStops?.length) {
+      for (const stop of object['stops']) {
+        stopRows += await createPublicStopTableRow(stop, 'wtt')
+      }
+    }
+  }
+  const displayBox = document.getElementById('train_data')
+  displayBox.innerHTML = ''
+  displayBox.insertAdjacentHTML('beforeend', dataTableHead + stopRows + dataTableClose)
+  displayBox.style = 'display:block;'
+}
+
+async function createPublicStopTableRow(stop, type='public') {
+  let arr, dep
+  let data_tiploc = stop['tiploc']
+  if (type === 'wtt') {
+    arr = stop['wttArrival'], dep = stop['wttDeparture']
+  }
+  if (type === 'public') {
+    arr = stop['publicArrival'], dep = stop['publicDeparture']
+  }
+  if (typeof data_tiploc === 'undefined') {
+    data_tiploc = ''
+  }
+  if (typeof arr === 'undefined') {
+    arr = '-'
+  }
+  if (typeof dep === 'undefined') {
+    dep = '-'
+  }
+  return `
+      <tr>
+        <td id='data_tiploc'>${data_tiploc}</td>
+        <td id='public_arr'>${arr}</td>
+        <td id='public_dep'>${dep}</td>
+      </tr>
+    `
+}
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,14 @@
+{
+  "name": "web",
+  "version": "0.0.1",
+  "description": "web",
+  "main": "index.html",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "eslint": "^8.39.0"
+  }
+}
--- a/pis.html
+++ b/pis.html
@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Beta: Quick access to route codes for PIS Systems.">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="application-name" content="OwlBoard">
+    <meta name="author" content="Frederick Boniface">
+    <meta name="theme-color" content="#00b7b7">
+    <link rel="apple-touch-icon" href="./images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/pis.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
+    <title>OwlBoard - PIS</title>
+    <script src="./js/lib.main.js" defer></script>
+    <script src="./js/pis.js" defer></script>
+  </head>
+
+  <body>
+
+    <div id="top_button" class="hide_micro">
+      <a href="./">
+        <picture class="sidebar_control">
+          <source srcset="./images/nav/back.svg" type="image/svg+xml">
+          <img aria-label="Home" src="./images/nav/back-40.png" alt="Home">
+        </picture>
+      </a>
+    </div>
+
+    <picture>
+      <source srcset="/images/logo/wide_logo.svg" type="image/svg+xml">
+      <source media="(max-height: 739px)" srcset="/images/logo/logo-full-200.png" type="image/png">
+      <source srcset="/images/logo/logo-full-250.png" type="image/png">
+      <img class="titleimg" src="/images/logo/logo-full-250.png" alt="OwlBoard Logo">
+    </picture>
+    <h2>PIS Codes</h2>
+
+    <div id="loading">
+      <div class="spinner">
+      </div>
+      <p id="loading_desc">Searching</p>
+    </div>
+
+    <div id="crs-box">
+        <p>Currently supported (Beta): GWR: ex-Wessex, HEx<br>Duplicate stopping patterns have been removed.</p>
+        <p id="auth-required">You need to be logged into a free <a href="./settings.html#railstaff">rail staff version</a> account for this feature.</p>
+        <h3>Search by Headcode</h3>
+        <form action="javascript:findByHeadcode();">
+          <div id="crs-inputs">
+            <div class="crs-input">
+              <label for="pis">Headcode:</label><br>
+              <input type="text" class="small-lookup-box pis-input" id="headcode" name="headcode" maxlength="4" autocomplete="off"><br><br>
+            </div>
+          </div>
+          <button type="submit" value="Find" class="lookup-button">Submit</button>
+        </form>
+        <h3>Search by CRS Codes</h3>  
+          <form action="javascript:findByOrigDest();">
+            <div id="crs-inputs">
+              <div class="crs-input">
+                <label for="origin">From:</label><br>
+                <input type="text" class="small-lookup-box pis-input" id="origin" name="origin" maxlength="3" autocomplete="off">
+              </div>
+              <div class="crs-input">
+                <label for="destination">To:</label><br>
+                <input type="text" class="small-lookup-box pis-input" id="destination" name="destination" maxlength="3" autocomplete="off"><br><br>
+              </div>
+            </div>
+            <button type="submit" value="Find" class="lookup-button">Submit</button>
+          </form>
+        <h3>Search by PIS Code</h3>
+          <form action="javascript:findByPisCode();">
+            <div id="crs-inputs">
+              <div class="crs-input">
+                <label for="pis">PIS Code:</label><br>
+                <input type="number" class="small-lookup-box pis-input" id="pis" name="pis" maxlength="4" autocomplete="off"><br><br>
+              </div>
+            </div>
+            <button type="submit" value="Find" class="lookup-button">Submit</button>
+          </form>
+    </div>
+
+    <div id="result-box">
+        <h3>Results: <span id="result-count">0</span></h3>
+        <!-- display: none; by default, some kind of box which shows each code
+             and destination individually with a previous and next arrow. -->
+    </div>
+
+    <button type="reset" id="reset" class="lookup-button" onclick="reset()">Reset</button>
+    <!-- Footer -->
+    <footer>
+      <p>&copy; Fred Boniface 2023 - <a href="./stats.html"><span id="ver_str">???</span></a></p>
+    </footer>
+  </body>
+</html>
--- a/registered.html
+++ b/registered.html
@ -0,0 +1,73 @@
+<!-- CONTAINS A STYLE BLOCK IN HEAD -->
+<!-- CONTAINS A SCRIPT BLOCK IN HEAD -->
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Live train departures, PIS codes & reference data for traincrew.">
+    <meta name="robots" content="noindex">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="application-name" content="OwlBoard">
+    <meta name="author" content="Frederick Boniface">
+    <meta name="theme-color" content="#00b7b7">
+    <link rel="apple-touch-icon" href="./images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" href="./styles/main.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
+    <script src="./js/lib.main.js" defer></script>
+    <script src="./js/registered.js" defer></script>
+    <title>OwlBoard</title>
+    <style>
+      #reg_success{display:none}
+      #reg_fail{display:none}
+      #fail_msg{display:none}
+      #other{display:none}
+    </style>
+  </head>
+  <body>
+    <!-- Loading Box -->
+    <div id="loading">
+      <div class="spinner">
+      </div>
+      <p id="loading_desc">Loading</p>
+    </div>
+
+    <!-- Main Content Begins -->
+    <picture>
+      <source srcset="./images/logo/wide_logo.svg" type="image/svg+xml">
+      <source media="(max-height: 739px)" srcset="./images/logo/logo-full-200.png" type="image/png">
+      <source srcset="./images/logo/logo-full-250.png" type="image/png">
+      <img class="titleimg" src="./images/logo/logo-full-250.png" alt="OwlBoard Logo">
+    </picture>
+    <br>
+    <div id="reg_success">
+      <h2>Check your emails</h2>
+        <p>An email containing a magic link has been sent</p>
+        <p>Click the link on the device that you want to use OwlBoard on - don't
+           worry, you can use the same address to sign up on another device</p>
+        <p>Do note that you will only be signed in in the browser you open the link with
+           and can only be used once</p>
+        <p>Do check your spam or junk folder if you don't see the email in the
+           next ten minutes.</p>
+        <p>For your privacy, only the 'host' part of your email address has been stored for example "@owlboard.info"</p>
+    </div>
+    <div id="reg_fail">
+      <h2>We couldn't sign you up</h2>
+        <p>Sorry, we couldn't sign you up at the moment.</p>
+        <p id="fail_msg">The error message is: <span id="fail_reason"></span></p>
+        <p>Please try again later, if you still can't sign up then check that
+           you are using a valid railway email address.  You can <a href="./issue.html">
+           submit an issue</a> if you think there is something wrong on our end.</p>
+    </div>
+    <div id="other">
+      <h2>We're not sure if that worked</h2>
+        <p>Sorry, we don't know if the signup worked, do check your emails and
+           try again if you don't receive one from us.</p>
+    </div>
+    <a class="actionbutton" href="./">Go Home</a>
+    <!-- Footer -->
+    <footer>
+      <p>&copy; Fred Boniface 2023 - <a href="./stats.html"><span id="ver_str">???</span></a></p>
+    </footer>
+  </body>
+</html>
--- a/settings.html
+++ b/settings.html
@ -1,17 +1,18 @@
 <!DOCTYPE html>
 <html lang="en">
  <head>
-    <meta charset="UTF-8"/>
-    <meta name="description" content="OwlBoard - Live train departures for traincrew."/>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Personalise your OwlBoard.">
+    <meta name="robots" content="noindex">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="application-name" content="OwlBoard">
    <meta name="author" content="Frederick Boniface">
    <meta name="theme-color" content="#00b7b7">
    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
-    <link rel="stylesheet" type="text/css" href="./styles/main.css"/>
-    <link rel="stylesheet" type="text/css" href="./styles/settings.css"/>
-    <link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
-    <link rel="manifest" type="application/json" href="./manifest.json"/>
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/settings.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
    <title>OwlBoard - Settings</title>
    <script src="./js/lib.main.js" defer></script>
    <script src="./js/settings.js" defer></script>
@ -35,9 +36,9 @@

    <div id="top_button" class="hide_micro">
      <a href="/">
-        <picture aria-label="Home" class="sidebar_control">
-          <source srcset="/images/nav/back.svg" type="image/svg+xml">
-          <img src="back-40.png" alt="Home">
+        <picture class="sidebar_control">
+          <source srcset="./images/nav/back.svg" type="image/svg+xml">
+          <img aria-label="Home" src="./images/nav/back-40.png" alt="Home">
        </picture>
      </a>
    </div>
@ -65,8 +66,16 @@
        <input type="text" maxlength="3" id="ql9" name="ql9" autocomplete="off" class="small-lookup-box"><br>
        <input type="text" maxlength="3" id="ql10" name="ql10" autocomplete="off" class="small-lookup-box">
        <input type="text" maxlength="3" id="ql11" name="ql11" autocomplete="off" class="small-lookup-box"><br>
-        <button onclick="setQl()" class="lookup-button">Apply</button>
-        <button onclick="clearQl()" class="lookup-button">Defaults</button>
-
+        <button type="submit" onclick="setQl()" class="lookup-button">Apply</button>
+        <button type="reset" onclick="clearQl()" class="lookup-button">Defaults</button>
+        <br><br><br>
+      <label id="railstaff">Register for Rail Staff Version:</label>
+        <p id="reg_text">Enter your work email address:</p>
+        <input type="text" maxlength="128" id="eml" name="eml" autocomplete="email" class="lookup-box" placeholder="email"><br>
+        <p>One registration confirmation email will be sent, your email address will not be stored after sending</p>
+        <p>Do check your spam/junk folder.</p>
+        <p>If your domain is not authorised and you are a using a railway company email address,
+           <a href="./issue.html">submit an issue</a> and it can be added.</p>
+        <button type="submit" onclick="register()" class="lookup-button" id="reg_button">Register</button>
  </body>
 </html>
--- a/stat.html
+++ b/stat.html
@ -1,70 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-    <head>
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <title>OwlBoard - STATS</title>
-        <script src="./js/lib.main.js" defer></script>
-        <script src="./js/stat.js" defer></script>
-    </head>
-    <body style="text-align:center">
-        <h1>OwlBoard Server Stats</h1>
-        <h2>API Server: <span id="server_host"></span></h2>
-        <p>Counters Reset - <span id="time"></span></p>
-        <table style="margin:auto;text-align:center;">
-          <tr>
-            <th>Resource</th>
-            <th>Hit Count</th>
-          </tr>
-          <tr>
-            <td>Upstream API-LDBWS</td>
-            <td id="ldbws"></td>
-          </tr>
-          <tr>
-            <td>Upstream API-LDBSVWS</td>
-            <td id="ldbsvws"></td>
-          </tr>
-          <tr>
-            <td>Upstream API-CORPUS</td>
-            <td id="apicorpus"></td>
-          </tr>
-          <tr>
-            <td>DB-CORPUS</td>
-            <td id="corpus"></td>
-          </tr>
-          <tr>
-            <td>DB-stations</td>
-            <td id="stations"></td>
-          </tr>
-          <tr>
-            <td>DB-users</td>
-            <td id="users"></td>
-          </tr>
-          <tr>
-            <td>DB-meta</td>
-            <td id="meta"></td>
-          </tr>
-        </table>
-        <br><br>
-        <p>The statistics represent hits & queries from all containers in the cluster.</p>
-        <table style="margin:auto;text-align:left;">
-          <tr>
-            <th>An OwlBoard Cluster consists of:</th>
-          </tr>
-          <tr>
-            <td>Kubernetes environment with suitable ingress configured</td>
-          </tr>
-          <tr>
-            <td>At least one MongoDB database (maybe clustered across multiple instances)</td>
-          </tr>
-          <tr>
-            <td>db-manager run as a initContainer and optionally as a CronJob</td>
-          </tr>
-          <tr>
-            <td>At least one backend (API server)</td>
-          </tr>
-          <tr>
-            <td>At least one web server service (Caching is done at this level so more than one service may increase API hits)</td>
-          </tr>
-        </table>
-    </body>
-</html>
--- a/stats.html
+++ b/stats.html
@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - Personalise your OwlBoard.">
+    <meta name="robots" content="noindex">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="application-name" content="OwlBoard">
+    <meta name="author" content="Frederick Boniface">
+    <meta name="theme-color" content="#00b7b7">
+    <link rel="apple-touch-icon" href="/images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/stats.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
+    <title>OwlBoard - Statistics</title>
+    <script src="./js/lib.main.js" defer></script>
+    <script src="./js/stats.js" defer></script>
+  </head>
+
+  <body>
+    <div id="loading">
+      <div class="spinner">
+      </div>
+      <p>Loading</p>
+    </div>
+
+    <div id="top_button" class="hide_micro">
+      <a href="/">
+        <picture class="sidebar_control">
+          <source srcset="./images/nav/back.svg" type="image/svg+xml">
+          <img aria-label="Home" src="./images/nav/back-40.png" alt="Home">
+        </picture>
+      </a>
+    </div>
+
+    <picture>
+      <source srcset="./images/logo/wide_logo.svg" type="image/svg+xml">
+      <source media="(max-height: 739px)" srcset="/images/logo/logo-full-200.png" type="image/png">
+      <source srcset="./images/logo/logo-full-250.png" type="image/png">
+      <img class="titleimg" src="./images/logo/logo-full-250.png" alt="OwlBoard Logo">
+    </picture>
+    <h2>Statistics</h2>
+      <p class="stat_desc">API Server: <span class="stat_result" id="server_host"></span><br>
+         Runtime Mode: <span class="stat_result" id="server_mode"></span><br>
+         Statistics Reset: <span class="stat_result" id="time"></span>
+      </p>
+      <h3>Component Versions</h3>
+        <p class="stat_desc">OwlBoard Web: <span class="stat_result" id="ver_str"></span><br>
+           OwlBoard Backend: <span class="stat_result" id="ver-bkend"></span><br>
+           OwlBoard DBManager: <span class="stat_result" id="ver-dbman"></span>
+        </p>
+      <h3>Usage Statistics</h3>
+        <p class="stat_desc">
+           Upstream LDBWS Lookups: <span class="stat_result" id="ldbws"></span><br>
+           Upstream LDBSVWS Lookups: <span class="stat_result" id="ldbsvws"></span><br>
+           Upstream CORPUS Fetches: <span class="stat_result" id="corpus_api"></span><br>
+           CORPUS DB Lookups: <span class="stat_result" id="corpus"></span><br>
+           Stations DB Lookups: <span class="stat_result" id="stations"></span><br>
+           PIS DB Lookups: <span class="stat_result" id="pis"></span><br>
+           User DB Lookups: <span class="stat_result" id="users"></span><br>
+           Meta DB Lookups: <span class="stat_result" id="meta"></span>
+        </p>
+      <h3>DB Counts</h3>
+        <p class="stat_desc">
+           Extarnal Registered Users: <span class="stat_result" id="user_count"></span><br>
+           Pending Registrations: <span class="stat_result" id="reg_count"></span><br>
+           Available PIS Codes: <span class="stat_result" id="pis_count"></span><br>
+           Available CORPUS Entries: <span class="stat_result" id="corpus_count"></span><br>
+           Available Station Entries: <span class="stat_result" id="stations_count"></span><br>
+           Services in local timetable: <span class="stat_result" id="timetable_count"></span>
+        </p>
+    <!-- Footer -->
+    <footer>
+        <p>&copy; Fred Boniface 2023</p>
+    </footer>
+  </body>
+</html>
--- a/styles/boards.css
+++ b/styles/boards.css
@ -64,6 +64,18 @@
    }
 }

+#refresh {
+    position: absolute;
+    right: 60px;
+    top: 12px;
+    cursor: pointer;
+}
+
+#refresh img {
+    width: 25px;
+    height: 25px;
+}
+
 .header-small {
    text-align: right;
    padding-right: 5px;
@ -264,7 +276,7 @@ caption{
    vertical-align: bottom;
    width: 100%;
    margin-right: -100%;
-    margin-left: 30px;
+    margin-left: 5px;
    border-top: 1px solid;
 }

@ -273,6 +285,14 @@ caption{
    width: 90%;
 }

+.call-table-description {
+    color: var(--second-text-color)
+}
+
+.detail-name a {
+    text-decoration: none;
+}
+
 .detail-name-here {
    color: var(--board-name-color);
 }
@ -324,17 +344,19 @@ caption{
    top: 6px;
 }

-#owlboard_logo {
+#timeblock {
    position: absolute;
-    right: 60px;
-    top: 8px;
+    margin-top: 2.5px;
+    right: 0;
+    margin-right: 10px;
+    color: azure;
+    font-size: 13px
 }

-#home_icon {
-    position: absolute;
-    width: 10px;
-    right: 40px;
-    top: 8px;
+#timeblock p {
+    margin-top: 0;
+    margin-bottom: 0;
+    text-align: center;
 }

 /* Animations */
--- a/styles/main.css
+++ b/styles/main.css
@ -106,6 +106,12 @@ body {
 }
 body a {color:var(--link-color)}
 body a:visited {color:var(--link-visited-color)}
+#home_icon {
+  position: absolute;
+  width: 30px;
+  right: 10px;
+  top: 10px;
+}
 .titleimg {
  width: 45%;
  padding-top: 20px;
@ -295,6 +301,10 @@ label {
  transition: 0.5s;
 }

+#auth-required {
+  color: var(--main-warning-color);
+}
+
 /* Footer Styles */
 footer {
  background-color: var(--accent-color);
--- a/styles/pis.css
+++ b/styles/pis.css
@ -0,0 +1,45 @@
+#crs-inputs {
+    display: flex;
+    justify-content: center;
+}
+
+.pis-input {
+    width: 55%;
+    max-width: 200px;
+    margin: auto;
+}
+
+#result-box {
+    display: none;
+}
+
+#result-table {
+    margin: auto;
+    color: var(--second-text-color);
+    width: 85%;
+    max-width: 700px;
+    text-align: center;
+}
+
+td, th {
+    border-bottom: 1px solid;
+}
+
+#reset {
+    margin-top: 15px
+}
+
+#reset {
+    margin-top: 25px;
+}
+
+.pis-code {
+    font-weight:bold;
+}
+
+.station {
+    text-transform: uppercase;
+    overflow-wrap: anywhere;
+    font-family: firamono, monospace;
+    line-height: 1.2;
+}
--- a/styles/settings.css
+++ b/styles/settings.css
@ -5,6 +5,7 @@

 #done {
    opacity: 0;
+    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
--- a/styles/stats.css
+++ b/styles/stats.css
@ -0,0 +1,8 @@
+.stat_desc {
+    color: var(--second-text-color);
+}
+
+.stat_result {
+    font-weight: bold;
+    color: var(--second-text-color);
+}
--- a/styles/train-detail.css
+++ b/styles/train-detail.css
@ -0,0 +1,33 @@
+.titleimg {
+    width: 150px;
+    height: 98px;
+    padding-bottom: 0;
+}
+
+.service_button {
+    font-size: 15px;
+    color: white;
+    background-color: var(--accent-color);
+    border: none;
+    border-radius: 30px;
+    padding: 10px;
+    margin: 5px;
+}
+
+#data_headcode {
+    color: var(--second-text-color);
+    font-size: 25px;
+    font-weight: bolder;
+    margin-bottom: 5px
+}
+
+#data_piscode {
+    margin: 5px;
+    color: var(--second-text-color)
+}
+
+#data_table {
+    color: var(--second-text-color);
+    width: 200px;
+    margin: auto
+}  
--- a/sw.js
+++ b/sw.js
@ -1,82 +1,105 @@
 /* Service Worker */

-const appVersion = "1.0.6"
-const cacheName = `owlboard-${appVersion}`
+const swVersion = '2023.6.7-990'
+const cacheName = `owlboard-${swVersion}`
 const cacheIDs = [cacheName]
-const cacheFiles = [
-    "/404.html",
-    "/conn-err.html",
-    "/help.html",
-    "/",
-    "/issue.html",
-    "/find-code.html",
-    "/settings.html",
-    "/manifest.json",
-    "/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/issue.css",
-    "/styles/main.css",
-    "/styles/settings.css",
-    "/js/find-code.js",
-    "/js/index.js",
-    "/js/issue.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/app-icons/any/plain-logo.svg",
-    "images/app-icons/any/plain-logo-512.png",
-    "/images/nav/alert_icon.svg",
-    "/images/nav/save.svg",
-    "/images/nav/home_icon.svg",
-    "/images/nav/back.svg",
-    "/images/nav/hamburger.svg",
-    "/images/nav/close.svg",
-    "/images/nre/nre-powered_400w.webp",
-    "/images/nre/nre-powered_400w.jxl"
+let staticCache = [
+  '/styles/fonts/firamono/firamono-500.woff2',
+  '/styles/fonts/firamono/firamono-regular.woff2',
+  '/styles/fonts/urwgothic/urwgothic.woff2',
+  '/styles/fonts/urwgothic/urwgothicDemi.woff2',
+  '/images/icon.svg',
+  '/images/logo/wide_logo.svg',
+  '/images/logo/mono-logo.svg',
+  '/images/app-icons/any/plain-logo.svg',
+  '/images/app-icons/any/plain-logo-512.png',
+  '/images/nav/alert_icon.svg',
+  '/images/nav/save.svg',
+  '/images/nav/home_icon.svg',
+  '/images/nav/back.svg',
+  '/images/nav/hamburger.svg',
+  '/images/nav/close.svg',
+  '/images/nav/refresh.svg',
+  '/images/nre/nre-powered_400w.webp',
+  '/images/nre/nre-powered_400w.jxl',
+  '/sw.js'
+]
+const dynamicCache = [
+  '/404.html',
+  '/auth.html',
+  '/board.html',
+  '/conn-err.html',
+  '/help.html',
+  '/',
+  '/issue.html',
+  '/find-code.html',
+  '/settings.html',
+  '/pis.html',
+  '/stats.html',
+  '/registered.html',
+  '/train-detail.html',
+  '/manifest.json',
+  '/styles/board.css',
+  '/styles/find-code.css',
+  '/styles/help.css',
+  '/styles/issue.css',
+  '/styles/main.css',
+  '/styles/settings.css',
+  '/styles/pis.css',
+  '/styles/stats.css',
+  '/styles/train-detail.css',
+  '/js/find-code.js',
+  '/js/index.js',
+  '/js/issue.js',
+  '/js/lib.board.js',
+  '/js/lib.main.js',
+  '/js/auth.js',
+  '/js/settings.js',
+  '/js/simple-board.js',
+  '/js/pis.js',
+  '/js/stats.js',
+  '/js/registered.js',
+  '/js/train-detail.js'
 ]

-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);
-        })()
-    );
-  });
+for(let i = 0; i < dynamicCache.length; i++) {
+  let item = dynamicCache[i] + `?${swVersion}`
+  staticCache.push(item)
+}

-  self.addEventListener("fetch", (e) => {
-    e.respondWith(
-      (async () => {
-        const r = await caches.match(e.request);
-        if (r) {
-          return r;
-        }
-        const response = await fetch(e.request);
-        console.log(`[Service Worker] Not cached - fetching from server: ${e.request.url}`);
-        return response;
-      })()
-    );
-  });
+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(staticCache)
+    })()
+  )
+})

-  self.addEventListener('activate', function (event) {
-    event.waitUntil(caches.keys().then(function (keys) {
-      return Promise.all(keys.filter(function (key) {
-        return !cacheIDs.includes(key);
-      }).map(function (key) {
-        return caches.delete(key);
-      }));
-    }).then(function () {
-      return self.clients.claim();
-    }));
-  });
+self.addEventListener('fetch', (e) => {
+  e.respondWith(
+    (async () => {
+      const r = await caches.match(e.request,{ignoreSearch: true})
+      if (r) {
+        return r
+      }
+      const response = await fetch(e.request)
+      console.log(`[Service Worker] Not cached - fetching from server: ${e.request.url}`)
+      return response
+    })()
+  )
+})
+
+self.addEventListener('activate', function (event) {
+  event.waitUntil(caches.keys().then(function (keys) {
+    return Promise.all(keys.filter(function (key) {
+      return !cacheIDs.includes(key)
+    }).map(function (key) {
+      return caches.delete(key)
+    }))
+  }).then(function () {
+    return self.clients.claim()
+  }))
+})
--- a/train-detail.html
+++ b/train-detail.html
@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en">
+
+  <head>
+
+    <meta charset="UTF-8">
+    <meta name="description" content="OwlBoard - How to use OwlBoard.">
+    <meta name="robots" content="noindex">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="application-name" content="OwlBoard">
+    <meta name="author" content="Frederick Boniface">
+    <meta name="theme-color" content="#00b7b7">
+    <link rel="apple-touch-icon" href="./images/app-icons/any/apple-192.png">
+    <link rel="stylesheet" type="text/css" href="./styles/main.css">
+    <link rel="stylesheet" type="text/css" href="./styles/train-detail.css">
+    <link rel="icon" type="image/svg+xml" href="./images/icon.svg">
+    <link rel="manifest" type="application/json" href="./manifest.json">
+    <script src="./js/lib.main.js" defer></script>
+    <script src="./js/train-detail.js" defer></script>
+    <title>OwlBoard - Train Details</title>
+
+  </head>
+
+  <body>
+
+    <div id="top_button" class="hide_micro">
+      <a href="./">
+        <picture class="sidebar_control">
+          <source srcset="./images/nav/back.svg" type="image/svg+xml">
+          <img aria-label="Home" src="./images/nav/back-40.png" alt="Home">
+        </picture>
+      </a>
+    </div>
+
+    <picture>
+      <source srcset="/images/logo/wide_logo.svg" type="image/svg+xml">
+      <source media="(max-height: 739px)" srcset="./images/logo/logo-full-200.png" type="image/png">
+      <source srcset="./images/logo/logo-full-250.png" type="image/png">
+      <img class="titleimg" id="titleimg" src="./images/logo/logo-full-250.png" alt="OwlBoard Logo">
+    </picture>
+      <div id="train_options">
+
+      </div>
+      <div id="train_data">
+
+      </div>
+    <footer>
+      <p>&copy; Fred Boniface 2023 - <a href="./stats.html"><span id="ver_str">???</span></a></p>
+    </footer>
+
+  </body>
+
+</html>
Author	SHA1	Message	Date
Fred Boniface	c1ad8c7244	Try and fix but broke it. Deprecated earlier than planned	2023-07-11 23:49:53 +01:00
Fred Boniface	b11ce6922d	Attempt fix null services	2023-07-11 23:02:49 +01:00
Fred Boniface	1313c41889	Bump sw version	2023-07-01 22:19:01 +01:00
Fred Boniface	64be61f62d	Prepare for migration to new site	2023-07-01 22:17:07 +01:00
Fred Boniface	5f710832b0	Bump version	2023-06-26 16:14:09 +01:00
Fred Boniface	82ad831b83	Update nginx conf for /misc/ route	2023-06-26 16:09:04 +01:00
Fred Boniface	7b6218e861	Change homepage notes, bump version	2023-06-11 22:19:27 +01:00
Fred Boniface	fb9c7a4fcc	Notes	2023-06-09 12:23:10 +01:00
Fred Boniface	caf4ce5611	Add notes	2023-06-09 12:21:53 +01:00
Fred Boniface	d2ba491675	Finalise initial release of 'find by headcode', bump version	2023-06-08 21:30:28 +01:00
Fred Boniface	665de609d0	Fix check for number of services	2023-06-08 14:13:34 +01:00
Fred Boniface	d341103aa5	Fix onclick action	2023-06-08 14:09:36 +01:00
Fred Boniface	eb0dea084a	Add notes	2023-06-08 11:37:26 +01:00
Fred Boniface	3b322d8d6e	Fix faulty HTML	2023-06-08 11:17:46 +01:00
Fred Boniface	41d027ffab	Change page layout to fit more data	2023-06-08 11:13:36 +01:00
Fred Boniface	e7fcb69e4c	Add table headers	2023-06-08 10:55:31 +01:00
Fred Boniface	a937ae7229	Complete single service display on train-detail	2023-06-08 10:53:00 +01:00
Fred Boniface	2c001426ca	Fix object properties	2023-06-07 23:40:20 +01:00
Fred Boniface	440527480b	Adjust if	2023-06-07 23:37:55 +01:00
Fred Boniface	108483597b	Initial train-detail page	2023-06-07 23:31:51 +01:00
Fred Boniface	70f93029ef	Bump Version	2023-05-25 21:39:55 +01:00
Fred Boniface	c2eb2edfd9	Adjust getRandom endpoint	2023-05-25 21:39:22 +01:00
Fred Boniface	4b47f303e9	Bump vesion	2023-05-24 20:53:36 +01:00
Fred Boniface	6b739bc42b	Add find by PIS Code	2023-05-24 20:52:55 +01:00
Fred Boniface	f3a488752e	Add actions	2023-05-24 19:52:39 +01:00
Fred Boniface	4877baae67	Clarify - NO SENSITIVE DATA on issue	2023-05-24 12:12:30 +01:00
Fred Boniface	2433671d85	Add timetable count to stats	2023-05-24 09:33:37 +01:00
Fred Boniface	20a17e8dd0	Bump the version properly	2023-05-24 00:50:18 +01:00
Fred Boniface	54cfc620cb	Bump version	2023-05-24 00:49:50 +01:00
Fred Boniface	e2624efb5a	Fix another silly error	2023-05-24 00:49:28 +01:00
Fred Boniface	affba1e93b	Fix error	2023-05-24 00:48:03 +01:00
Fred Boniface	c6a8ce2d58	Fix typo	2023-05-24 00:45:35 +01:00
Fred Boniface	08a72d8c0c	Improve signup process	2023-05-24 00:40:46 +01:00
Fred Boniface	f0081aa301	Change log mode to prod	2023-05-23 23:53:24 +01:00
Fred Boniface	c8d8dc5736	Add stats to cache	2023-05-23 23:52:55 +01:00
Fred Boniface	256070eb50	Bump version number	2023-05-23 22:19:24 +01:00
Fred Boniface	8e4725c65b	Remove 'v' from version strings	2023-05-23 22:18:28 +01:00
Fred Boniface	237a8758b4	Change PIS supported <p>	2023-05-23 22:17:41 +01:00
Fred Boniface	3c772686b0	Change stats page wording	2023-05-23 16:43:26 +01:00
Fred Boniface	7aa70a4769	Bump sw issue number	2023-05-23 14:42:28 +01:00
Fred Boniface	55a2c48dd6	Remove links to personal website	2023-05-23 14:41:40 +01:00
Fred Boniface	3668a8f029	Fix typo	2023-05-23 12:11:39 +01:00
Fred Boniface	bdc2d83bd2	Update stats display	2023-05-23 12:03:48 +01:00
Fred Boniface	3e26bc5268	Fix spelling error	2023-05-23 11:00:29 +01:00
Fred Boniface	9bc3813202	Adjust supported PIS <p>, bump version	2023-05-23 10:56:40 +01:00
Fred Boniface	1b42088b30	Fix issue: 15 OwlBoard/backend#15	2023-05-20 23:57:29 +01:00
Fred Boniface	972d56060b	Update PIS List, bump version	2023-05-17 21:13:23 +01:00
Fred Boniface	4c95cd809f	Move to YEAR.MONTH.RELEASE versioning	2023-05-14 19:59:03 +01:00
Fred Boniface	ed071ae633	Additional PIS	2023-05-10 13:16:53 +01:00
Fred Boniface	bc91a843f5	Disable various autocompletes	2023-05-08 22:11:14 +01:00
Fred Boniface	98faaaa7ba	Bump SW date	2023-05-08 22:03:47 +01:00
Fred Boniface	d780a6fd88	Fixing bad styling decisions	2023-05-08 22:03:07 +01:00
Fred Boniface	abbceee88d	Bugfixes	2023-05-08 21:44:04 +01:00
Fred Boniface	1a0c50653f	Bump version - again!	2023-05-08 21:38:38 +01:00
Fred Boniface	458f0a51dd	Adjust margin on service detail line	2023-05-08 21:37:59 +01:00
Fred Boniface	8ed7c6f907	HTML Lint	2023-05-08 21:36:23 +01:00
Fred Boniface	9973da52a6	Lint JS	2023-05-08 21:31:47 +01:00
Fred Boniface	a2afa9f500	Add departure board links to serviceDetail	2023-05-08 21:27:49 +01:00
Fred Boniface	9fab253bd3	Fix RT Colour	2023-05-08 21:18:09 +01:00
Fred Boniface	4ff7f6adf2	Add right-time colour	2023-05-08 21:17:33 +01:00
Fred Boniface	7e89447816	Lint fixes, expand help, deep links	2023-05-08 21:06:48 +01:00
Fred Boniface	15fa5823e6	Add additional PIS Codes	2023-05-08 20:20:15 +01:00
Fred Boniface	c463ffbb1e	Upgrade stats page (!3 ) Add additional stats to the page Reviewed-on: #3	2023-05-07 21:18:04 +01:00
Fred Boniface	d8b32c25c0	pis (!2 ) Reviewed-on: #2	2023-05-06 21:53:43 +01:00
Fred Boniface	91b33b1458	Dockerfile optimisations	2023-04-04 11:01:42 +01:00
Fred Boniface	7f077b76be	Fixes issue OwlBoard/backend#7	2023-04-03 01:15:51 +01:00
Fred Boniface	cba06873c3	Fix board footer layout, bump patch version	2023-03-31 20:41:25 +01:00
Fred Boniface	9a7797ce20	Adjust order of log function to reduce unneccesary things	2023-03-30 20:46:53 +01:00
Fred Boniface	cd3384ece8	Fix version number	2023-03-30 20:41:20 +01:00
Fred Boniface	b5571c2eb2	When in prod mode, only log timers an errors	2023-03-30 20:37:26 +01:00
Fred Boniface	a80c9c632b	Update board layout, bump minor version	2023-03-30 20:15:12 +01:00
Fred Boniface	e4304e31ac	Add refresh icon	2023-03-30 19:53:29 +01:00
Fred Boniface	830f7c3da5	Fix error in stat page	2023-03-13 20:44:50 +00:00
Fred Boniface	39fd810118	Adjust stats page, bump patch version	2023-03-13 20:40:16 +00:00
Fred Boniface	97f656f5b6	Adjusted position of functions	2023-03-13 20:28:07 +00:00
Fred Boniface	49e979e151	Fix stats version display	2023-03-13 20:13:10 +00:00
Fred Boniface	75cc85e845	Fix incoorect version increment	2023-03-13 14:14:57 +00:00
Fred Boniface	a2f98e77f5	Fix issues, bump version	2023-03-12 12:53:20 +00:00
Fred Boniface	d328236f16	Add server mode to stats	2023-03-10 22:12:03 +00:00
Fred Boniface	b09c97e911	Add version to stats page	2023-03-10 22:10:25 +00:00
Fred Boniface	c9d231fd7e	Version String: - Bump to 1.0.8 - Read from index.html and load string in to localStorage	2023-03-10 22:01:13 +00:00
Fred Boniface	3a24d8ef2e	Add time counters for total time and fetch time.	2023-03-10 21:52:36 +00:00
Fred Boniface	8e2185d185	Add ignoreSearch to SW Cache fetches	2023-03-01 11:38:31 +00:00
				`@ -0,0 +1 @@`
				`# Build and push docker container to repository`