Organize client side code

static/help.html

@@ -10,7 +10,6 @@
     <link rel="stylesheet" type="text/css" href="./styles/style.css"/>
     <link rel="icon" type="image/png" href="./images/logo/logo-sq-256.png"/>
     <link rel="manifest" type="application/json" href="./manifest.json"/>
-    <script src="./js/nav.js"></script>
     <title>OwlBoard</title>
   </head>
 
@@ -24,9 +23,6 @@
         <source media="(min-width:450px)" srcset="./images/logo/logo-full-256.png" type="image/png">
         <img class="titleimg" src="./images/logo/logo-full-512.png" alt="OwlBoard Logo">
       </picture>
-      <div id="back_button">
-        <a href="./index.html">BACK</a>
-      </div>
       <h2>Help</h2>
         <p>OwlBoard gives you quick and easy access to departure boards for 
          all National Rail stations in the UK.</p>

static/index.html

@@ -10,7 +10,7 @@
     <link rel="stylesheet" type="text/css" href="./styles/style.css"/>
     <link rel="icon" type="image/png" href="./images/logo/logo-sq-256.png"/>
     <link rel="manifest" type="application/json" href="./manifest.json"/>
-    <script src="./js/nav.js"></script>
+    <script src="./js/main.js"></script>
     <title>OwlBoard</title>
   </head>
 
@@ -49,15 +49,15 @@
          apologies for any inconvinience caused to you.</p>
 
     <h2>Quick Links</h2>
-      <button class="actionbutton" onclick="gotoInfoBoard('bathspa')">BTH</button>
+      <button class="actionbutton" onclick="gotoBoard('bth')">BTH</button>
-      <button class="actionbutton" onclick="gotoInfoBoard('brstltm')">BRI</button>
+      <button class="actionbutton" onclick="gotoBoard('bri')">BRI</button>
-      <button class="actionbutton" onclick="gotoInfoBoard('brstpwy')">BPW</button>
+      <button class="actionbutton" onclick="gotoBoard('bpw')">BPW</button>
-      <button class="actionbutton" onclick="gotoInfoBoard('crdfcen')">CDF</button>
+      <button class="actionbutton" onclick="gotoBoard('cdf')">CDF</button>
-      <button class="actionbutton" onclick="gotoInfoBoard('gloster')">GCR</button>
+      <button class="actionbutton" onclick="gotoBoard('gcr')">GCR</button>
-      <button class="actionbutton" onclick="gotoInfoBoard('oldfldp')">OLF</button>
+      <button class="actionbutton" onclick="gotoBoard('olf')">OLF</button>
-      <button class="actionbutton" onclick="gotoInfoBoard('soton')">SOU</button>
+      <button class="actionbutton" onclick="gotoBoard('sou')">SOU</button>
-      <button class="actionbutton" onclick="gotoInfoBoard('wstbryw')">WSB</button>
+      <button class="actionbutton" onclick="gotoBoard('wsb')">WSB</button>
-      <button class="actionbutton" onclick="gotoInfoBoard('wsmare')">WSM</button>
+      <button class="actionbutton" onclick="gotoBoard('wsm')">WSM</button>
 
       <br>
       <br>

static/js/main.js

@@ -1,11 +1,16 @@
-function sidebarOpen() {
+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";
 }
 
-function sidebarClose() {
+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 gotoBoard(station){
+  console.log(`Finding ${station}`)
+  window.location.assign(`board.html?stn=${station}`)
+}