OwlBoard/owlboard-svelte
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Componentisation of LDB

Browse Source
This commit is contained in:
Fred Boniface 2023-06-16 22:55:18 +01:00
parent 8535492298
commit ed3dd38769
2 changed files with 71 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

60
src/lib/ldb/public-ldb.svelte Normal file
View File

@ -0,0 +1,60 @@
<script>
export let station = "";
import {onMount} from 'svelte'
let requestedStation = "";
$: requestedStation = station;
let jsonData = {};
/**
* @type {any[]}
*/
let services = [];
$: {
if (jsonData && jsonData.GetStationBoardResult && jsonData.GetStationBoardResult.trainServices && jsonData.GetStationBoardResult.trainServices.service) {
services = [...jsonData.GetStationBoardResult.trainServices.service];
} else {
services = ["No train services available"];
}
}
onMount(async () => {
const data = await fetch(`https://owlboard.info/api/v1/ldb/${station}`);
jsonData = await data.json();
})
</script>
<p>{requestedStation.toUpperCase()}</p>
<p>
{#each services as service}
<span>{service.origin?.location?.locationName || 'Unknown'}</span>
{/each}
</p>
<table>
<tr>
<th>From</th>
<th>To</th>
<th>Plat.</th>
<th>Sch Arr.</th>
<th>Exp Arr.</th>
<th>Sch Dep.</th>
<th>Exp Dep.</th>
</tr>
{#each services as service}
<tr>
<td>{service.origin?.location?.locationName || ''}</td>
<td>{service.destination?.location?.locationName || ''}</td>
<td>{service.platform || ''}</td>
</tr>
{/each}
</table>
<style>
table {
width: 100%;
margin: auto;
}
</style>

39
src/routes/ldb/+page.svelte
View File

@ -1,44 +1,25 @@
<script>
import Header from '$lib/navigation/header.svelte'
import Nav from '$lib/navigation/nav.svelte'
import Header from '$lib/navigation/header.svelte'
import Nav from '$lib/navigation/nav.svelte'
import PublicLdb from '$lib/ldb/public-ldb.svelte';
import {onMount} from 'svelte'
import {onMount} from 'svelte'
const title = "Public Board"
async function getHeadcode() {
const title = "Public Board"
async function getHeadcode() {
return new URLSearchParams(window.location.search).get('station');
}
let jsonData = {}; // Extract train data from the object to pass to #each
let services = [];
$: {
if (jsonData && jsonData.GetStationBoardResult && jsonData.GetStationBoardResult.trainServices && jsonData.GetStationBoardResult.trainServices.service) {
services = [...jsonData.GetStationBoardResult.trainServices.service];
} else {
services = ["No train services available"];
}
}
let station = ""
onMount(async () => {
const station = await getHeadcode();
document.getElementById('station').textContent = station;
const data = await fetch(`https://owlboard.info/api/v1/ldb/${station}`);
jsonData = await data.json();
station = await getHeadcode() || "";
})
</script>
<Header {title} />
<p>Station: <span id="station"></span></p>
<p>
{#each services as service}
<span>{service.origin?.location?.locationName || 'Unknown'}</span>
{/each}
</p>
<p>{JSON.stringify(jsonData)}</p>
<!-- If 'uuid' exists in store then load StaffLdb else load PublicLdb -->
<PublicLdb {station} />
<Nav />