From 64bc5b979dbbe1d98d6e84392f9448dd19f25dbd Mon Sep 17 00:00:00 2001
From: Fred Boniface <fjla@fredboniface.co.uk>
Date: Tue, 17 Mar 2026 20:04:38 +0000
Subject: [PATCH] Add initial logic for 'boards'

---
 src/app.html                       |  2 +-
 src/lib/locations-object.svelte.ts | 16 +++++++++++--
 src/routes/+error.svelte           |  6 +++--
 src/routes/+layout.svelte          | 12 +++++-----
 src/routes/+layout.ts              |  1 +
 src/routes/board/+page.svelte      | 15 ++++++++++++
 src/routes/board/+page.ts          | 37 ++++++++++++++++++++++++++++++
 static/api/tiplocs                 |  1 +
 8 files changed, 79 insertions(+), 11 deletions(-)
 create mode 100644 src/routes/board/+page.svelte
 create mode 100644 src/routes/board/+page.ts

diff --git a/src/app.html b/src/app.html
index 7c40556..c7e23ff 100644
--- a/src/app.html
+++ b/src/app.html
@@ -4,7 +4,7 @@
 		<meta charset="utf-8" />
 		<meta name="viewport" content="width=device-width, initial-scale=1" />
 		<link rel="manifest" href="/manifest.webmanifest" />
-		<meta name="title" content="OwlBoard | Your fasted route to live and reference data" />
+		<meta name="title" content="OwlBoard | Your fastest route to live and reference data" />
 		<meta
 			name="description"
 			content="Live station departures, Live train tracking, PIS Codes & more"
diff --git a/src/lib/locations-object.svelte.ts b/src/lib/locations-object.svelte.ts
index 61d8046..8166fda 100644
--- a/src/lib/locations-object.svelte.ts
+++ b/src/lib/locations-object.svelte.ts
@@ -9,11 +9,11 @@ class LocationStore {
     data = $state<LocationRecord[]>([]);
     loaded = $state(false);
 
-    async init() {
+    async init(fetcher = fetch) {
         if (this.loaded) return;
 
         try {
-            const res = await fetch('/api/tiplocs');
+            const res = await fetcher('/api/tiplocs');
             this.data = await res.json();
             this.loaded = true;
         } catch (err) {
@@ -21,6 +21,18 @@ class LocationStore {
         }
     }
 
+    find(id: string | null): LocationRecord | undefined {
+        if (!id) return undefined;
+
+        const query = id.toUpperCase().trim();
+
+        console.log(query);
+
+        return this.data.find((loc) => {
+            return loc.t === query || loc.c === query;
+        });
+    }
+
 }
 
 export const LOCATIONS = new LocationStore();
\ No newline at end of file
diff --git a/src/routes/+error.svelte b/src/routes/+error.svelte
index 779f0e5..5feeae3 100644
--- a/src/routes/+error.svelte
+++ b/src/routes/+error.svelte
@@ -59,12 +59,14 @@
 		color: var(--color-title);
 		max-width: 300px;
 		margin-top: 5px;
-		margin-bottom: 30px;
+		margin-bottom: 20px;
 	}
 
 	.debug-info {
 		background: rgba(255, 255, 255, 0.05);
-		padding: 5px 12px;
+		padding: 5px 15px;
+		margin-top: 0;
+		margin-bottom: 20px;
 		border-radius: 4px;
 		font-size: 0.8rem;
 		opacity: 0.6;
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 6a81584..e59e8e1 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -13,7 +13,7 @@
 
 	import { IconHome, IconDialpad, IconSettings, IconHelp, IconDots } from '@tabler/icons-svelte';
 
-	onMount(() => LOCATIONS.init());
+	onMount(() => LOCATIONS.init(fetch));
 
 	let { children } = $props();
 
@@ -23,9 +23,9 @@
 
 	const navItems = [
 		{ label: 'Home', path: '/', icon: IconHome },
-		{ label: 'PIS', path: '/pis', icon: IconDialpad },
-		{ label: 'Options', path: '/preferences', icon: IconSettings },
-		{ label: 'About', path: '/about', icon: IconHelp }
+		{ label: 'PIS', path: '/pis/', icon: IconDialpad },
+		{ label: 'Options', path: '/preferences/', icon: IconSettings },
+		{ label: 'About', path: '/about/', icon: IconHelp }
 	];
 
 	let navWidth = $state(0);
@@ -83,7 +83,7 @@
 <nav bind:clientWidth={navWidth}>
 	<!-- Dynamic Nav Elements Here! -->
 	{#each visibleItems as item}
-		{@const isActive = activePath === item.path}
+		{@const isActive = activePath.replace(/\/$/, '') === item.path.replace(/\/$/, '')}
 		<a
 			href={item.path}
 			class="nav-item"
@@ -115,7 +115,7 @@
 			></div>
 			<div class="menu-popover" transition:slide={{ axis: 'y', duration: 250 }}>
 				{#each hiddenItems as item}
-					{@const isActive = activePath === item.path}
+					{@const isActive = activePath.replace(/\/$/, '') === item.path.replace(/\/$/, '')}
 					<a
 						href={item.path}
 						class="menu-popover-item"
diff --git a/src/routes/+layout.ts b/src/routes/+layout.ts
index e285259..bc83efd 100644
--- a/src/routes/+layout.ts
+++ b/src/routes/+layout.ts
@@ -1,3 +1,4 @@
 export const prerender = true;
 export const trailingSlash = 'always';
 export const csr = true;
+export const ssr = false;
diff --git a/src/routes/board/+page.svelte b/src/routes/board/+page.svelte
new file mode 100644
index 0000000..f05609e
--- /dev/null
+++ b/src/routes/board/+page.svelte
@@ -0,0 +1,15 @@
+<section>
+    Live board are not yet implemented on the server
+</section>
+
+<style>
+    section {
+        font-family: 'URW Gothic', sans-serif;
+        text-align: center;
+        font-size: 2rem;
+        width: 90%;
+        margin: auto;
+        padding-top: 25px;
+        max-width: 500px;
+    }
+</style>
\ No newline at end of file
diff --git a/src/routes/board/+page.ts b/src/routes/board/+page.ts
new file mode 100644
index 0000000..aeb2e25
--- /dev/null
+++ b/src/routes/board/+page.ts
@@ -0,0 +1,37 @@
+import { LOCATIONS } from '$lib/locations-object.svelte';
+import type { PageLoad } from './$types';
+import { error } from '@sveltejs/kit';
+
+export const load: PageLoad = async ({ url }) => {
+    const locId = url.searchParams.get('loc');
+
+    if (!LOCATIONS.loaded) {
+        await LOCATIONS.init(fetch);
+    }
+
+    let title: string = "";
+
+    if (!locId) {
+        error(400, {
+            message: 'Location not provided',
+            owlCode: 'NO_LOCATION_IN_PATH',
+        });
+    }
+
+    if (locId) {
+        const location = LOCATIONS.find(locId);
+
+        if (location) {
+            title = location.n || location.t;
+        } else {
+            error(404, {
+                message: `Location (${locId}) not found`,
+                owlCode: 'INVALID_LOCATION_CODE',
+            });
+        }
+    }
+	return {
+		title,
+        location,
+	};
+};
\ No newline at end of file
diff --git a/static/api/tiplocs b/static/api/tiplocs
index 09704ae..d1db816 100644
--- a/static/api/tiplocs
+++ b/static/api/tiplocs
@@ -99,5 +99,6 @@
   {"n":"Luton Airport Sidings","t":"LUTSID","c":"","s":"luton airport sidings lutsid"},
   {"n":"Stevenage Hitchin Junction","t":"STHJC","c":"","s":"stevenage hitchin junction sthjc"},
   {"n":"Chelmsford New Hall Junction","t":"CHNJCT","c":"","s":"chelmsford new hall junction chnjct"},
+  {"n":"","t":"BPWY532","c":"","s":"bpwy532"},
   {"n":"Ipswich Derby Road Depot","t":"IPDRDP","c":"","s":"ipswich derby road depot ipdrdp"}
 ]
\ No newline at end of file