Componentisation of LDB
This commit is contained in:
parent
8535492298
commit
ed3dd38769
60
src/lib/ldb/public-ldb.svelte
Normal file
60
src/lib/ldb/public-ldb.svelte
Normal 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>
|
@ -1,44 +1,25 @@
|
|||||||
<script>
|
<script>
|
||||||
import Header from '$lib/navigation/header.svelte'
|
import Header from '$lib/navigation/header.svelte'
|
||||||
import Nav from '$lib/navigation/nav.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');
|
return new URLSearchParams(window.location.search).get('station');
|
||||||
}
|
}
|
||||||
|
|
||||||
let jsonData = {}; // Extract train data from the object to pass to #each
|
let station = ""
|
||||||
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 () => {
|
onMount(async () => {
|
||||||
const station = await getHeadcode();
|
station = await getHeadcode() || "";
|
||||||
document.getElementById('station').textContent = station;
|
|
||||||
const data = await fetch(`https://owlboard.info/api/v1/ldb/${station}`);
|
|
||||||
jsonData = await data.json();
|
|
||||||
})
|
})
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<Header {title} />
|
<Header {title} />
|
||||||
|
|
||||||
<p>Station: <span id="station"></span></p>
|
<!-- If 'uuid' exists in store then load StaffLdb else load PublicLdb -->
|
||||||
<p>
|
<PublicLdb {station} />
|
||||||
{#each services as service}
|
|
||||||
<span>{service.origin?.location?.locationName || 'Unknown'}</span>
|
|
||||||
{/each}
|
|
||||||
</p>
|
|
||||||
<p>{JSON.stringify(jsonData)}</p>
|
|
||||||
|
|
||||||
|
|
||||||
<Nav />
|
<Nav />
|
Loading…
Reference in New Issue
Block a user