Implementation of:

- Authenticated PIS
  - Report Issue
  - About Page

src/routes/pis/+page.svelte

@@ -2,29 +2,41 @@
     import Header from '$lib/navigation/header.svelte'
     import Nav from '$lib/navigation/nav.svelte'
     import Island from '$lib/islands/island.svelte';
+	import Loading from '$lib/navigation/loading.svelte';
+    import { uuid } from '$lib/stores/uuid';
     
     const title = "PIS Finder"
     const variables = {title: "Results"}
     let entryPIS = "";
     let entryStartCRS = "";
     let entryEndCRS = "";
-    let data = [{operator: "gw", code: 4332, stops: ["bri","fit","bpw","yae","cdu","cnm","asc","wos","wof","mvl","gmv"]},
-                {operator: "xc", code: 3432, stops: ["bri","bpw","cnm","wos","wof","mvl","gmv"]}];
+    let data = [];
     let error = false;
     let errMsg = "Unknown Error"
+    let isLoading = false
 
     async function findByStartEnd() {
+        isLoading = true
         const url = `https://owlboard.info/api/v2/pis/byStartEnd/${entryStartCRS}/${entryEndCRS}`
-        fetchData(url);
+        await fetchData(url);
+        isLoading = false
     }
 
     async function findByPis() {
+        isLoading = true
         const url = `https://owlboard.info/api/v2/pis/byCode/${entryPIS}`
-        fetchData(url);
+        await fetchData(url);
+        isLoading = false;
     }
 
     async function fetchData(url) {
-        const res = await fetch(url); // Enable Auth
+        const options = {
+            method: "GET",
+            headers: {
+                "uuid": $uuid
+            }
+        }
+        const res = await fetch(url, options); // Enable Auth
         if (res.status == 401) {
             errMsg = "You must be logged in to the staff version"
             error = true
@@ -53,7 +65,11 @@
 </script>
  
 <Header {title} />
- 
+
+{#if isLoading}
+  <Loading/>
+{/if}
+
 {#if error}
   <Island {variables}>
     <p class="error">{errMsg}</p>
@@ -68,15 +84,16 @@
             </tr>
         {#each data as item}
           <tr>
-            <td class="toc">{item.operator.toUpperCase()}</td>
+            <td class="toc toc-data">{item.operator || "-"}</td>
             <td class="code">{item.code}</td>
-            <td class="stops stops-data">{item.stops.join(", ").toUpperCase() + "  "}</td>
+            <td class="stops stops-data">{item.stops.join("  ")}</td>
           </tr>
         {/each}
         </table>
     </Island>
 {:else}
   <p>To search by headcode use the Train Finder on the homepage</p>
+  <p>This feature is only supported for GWR West & Sleeper services</p>
   <p class="label">Find By Start/End CRS:</p>
   <form on:submit={findByStartEnd}>
     <input type="text" maxlength="3" autocomplete="off" placeholder="Start" bind:value={entryStartCRS}>
@@ -140,9 +157,13 @@
     .code {
         width: 20%;
     }
+    .toc-data {
+        text-transform: uppercase;
+    }
     .stops-data {
         text-align: left;
         font-family: firamono, monospace;
+        text-transform: uppercase;
     }
     .error {
         color: white;