This commit is contained in:
Fred Boniface 2023-07-07 11:29:33 +01:00
parent 7dc24646b9
commit c0997e92d4
25 changed files with 117 additions and 443 deletions

View File

@ -4,7 +4,7 @@
"semi": true, "semi": true,
"singleQuote": true, "singleQuote": true,
"trailingComma": "none", "trailingComma": "none",
"printWidth": 80, "printWidth": 180,
"plugins": ["prettier-plugin-svelte"], "plugins": ["prettier-plugin-svelte"],
"pluginSearchDirs": ["."], "pluginSearchDirs": ["."],
"overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }] "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }]

View File

@ -1,32 +1,26 @@
/* FONTS */ /* FONTS */
@font-face { @font-face {
font-family: 'firamono'; font-family: 'firamono';
src: url('/font/firamono/firamono-regular.woff2') format('woff2'), src: url('/font/firamono/firamono-regular.woff2') format('woff2'), url('/font/firamono/firamono-regular.woff') format('woff'),
url('/font/firamono/firamono-regular.woff') format('woff'),
url('/font/firamono/firamono-regular.ttf') format('truetype'); url('/font/firamono/firamono-regular.ttf') format('truetype');
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: 'firamono'; font-family: 'firamono';
src: url('/font/firamono/firamono-500.woff2') format('woff2'), src: url('/font/firamono/firamono-500.woff2') format('woff2'), url('/font/firamono/firamono-500.woff') format('woff'), url('/font/firamono/firamono-500.ttf') format('truetype');
url('/font/firamono/firamono-500.woff') format('woff'),
url('/font/firamono/firamono-500.ttf') format('truetype');
font-weight: 500; font-weight: 500;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: 'urwgothic'; font-family: 'urwgothic';
src: url('/font/urwgothic/urwgothic.woff2') format('woff2'), src: url('/font/urwgothic/urwgothic.woff2') format('woff2'), url('/font/urwgothic/urwgothic.woff') format('woff'), url('/font/urwgothic/urwgothic.ttf') format('truetype');
url('/font/urwgothic/urwgothic.woff') format('woff'),
url('/font/urwgothic/urwgothic.ttf') format('truetype');
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
} }
@font-face { @font-face {
font-family: 'urwgothic'; font-family: 'urwgothic';
src: url('/font/urwgothic/urwgothicDemi.woff2') format('woff2'), src: url('/font/urwgothic/urwgothicDemi.woff2') format('woff2'), url('/font/urwgothic/urwgothicDemi.woff') format('woff'),
url('/font/urwgothic/urwgothicDemi.woff') format('woff'),
url('/font/urwgothic/urwgothicDemi.ttf') format('truetype'); url('/font/urwgothic/urwgothicDemi.ttf') format('truetype');
font-weight: 900; font-weight: 900;
font-style: normal; font-style: normal;
@ -58,10 +52,7 @@ html {
body { body {
background-color: var(--main-bg-color); background-color: var(--main-bg-color);
background-image: radial-gradient( background-image: radial-gradient(var(--second-bg-color), var(--main-bg-color));
var(--second-bg-color),
var(--main-bg-color)
);
color: var(--second-text-color); color: var(--second-text-color);
font-family: urwgothic, sans-serif; font-family: urwgothic, sans-serif;
text-align: center; text-align: center;

View File

@ -10,14 +10,7 @@
<Island {variables}> <Island {variables}>
<form action={variables.action}> <form action={variables.action}>
<input <input class="form-input" type="text" id="input-headcode" name={variables.queryName} placeholder={variables.placeholder} autocomplete="off" />
class="form-input"
type="text"
id="input-headcode"
name={variables.queryName}
placeholder={variables.placeholder}
autocomplete="off"
/>
<br /> <br />
<button type="submit">Submit</button> <button type="submit">Submit</button>
</form> </form>
@ -32,8 +25,7 @@
border-radius: 50px; border-radius: 50px;
border: none; border: none;
text-align: center; text-align: center;
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
text-transform: uppercase; text-transform: uppercase;
font-size: 15px; font-size: 15px;
} }
@ -44,8 +36,7 @@
border: none; border: none;
border-radius: 20px; border-radius: 20px;
padding: 5px; padding: 5px;
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
background-color: var(--main-bg-color); background-color: var(--main-bg-color);

View File

@ -9,8 +9,7 @@
<style> <style>
span { span {
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-weight: 600; font-weight: 600;
font-size: 20px; font-size: 20px;
color: var(--main-text-color); color: var(--main-text-color);

View File

@ -11,8 +11,7 @@
<style> <style>
span { span {
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
color: var(--main-text-color); color: var(--main-text-color);
font-weight: 600; font-weight: 600;
font-size: 20px; font-size: 20px;

View File

@ -43,8 +43,7 @@
border: none; border: none;
border-radius: 20px; border-radius: 20px;
padding: 5px; padding: 5px;
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
text-decoration: none; text-decoration: none;

View File

@ -92,8 +92,7 @@
border: none; border: none;
border-radius: 20px; border-radius: 20px;
padding: 5px; padding: 5px;
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
text-decoration: none; text-decoration: none;
@ -107,8 +106,7 @@
border: none; border: none;
border-radius: 20px; border-radius: 20px;
padding: 5px; padding: 5px;
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
background-color: var(--main-bg-color); background-color: var(--main-bg-color);

View File

@ -11,17 +11,7 @@
} }
function numberAsWord(number) { function numberAsWord(number) {
const words = [ const words = ['zero', 'one', 'two', 'three', 'four', 'five', 'six', 'seven', 'eight'];
'zero',
'one',
'two',
'three',
'four',
'five',
'six',
'seven',
'eight'
];
let word = words[number]; let word = words[number];
if (word) { if (word) {
return word; return word;
@ -45,11 +35,7 @@
<p id="arrow" class:displayAlerts>V</p> <p id="arrow" class:displayAlerts>V</p>
</div> </div>
{#if displayAlerts} {#if displayAlerts}
<div <div id="alerts" in:fly={{ y: -200, duration: 500 }} out:fly={{ y: -200, duration: 800 }}>
id="alerts"
in:fly={{ y: -200, duration: 500 }}
out:fly={{ y: -200, duration: 800 }}
>
{#each uniqueAlerts as msg} {#each uniqueAlerts as msg}
<p class="alert">{@html msg}</p> <p class="alert">{@html msg}</p>
{/each} {/each}

View File

@ -54,9 +54,7 @@
isLoading = true; // Set loading state isLoading = true; // Set loading state
try { try {
console.log(`Requested Station: ${requestedStation}`); console.log(`Requested Station: ${requestedStation}`);
const data = await fetch( const data = await fetch(`https://owlboard.info/api/v1/ldb/${requestedStation}`);
`https://owlboard.info/api/v1/ldb/${requestedStation}`
);
jsonData = await data.json(); jsonData = await data.json();
} catch (error) { } catch (error) {
console.error('Error fetching data:', error); console.error('Error fetching data:', error);
@ -168,41 +166,25 @@
</tr> </tr>
{#each services as service} {#each services as service}
<tr> <tr>
<td <td class="origdest from" on:click={loadService(service.serviceID)} on:keypress={loadService(service.serviceID)}>
class="origdest from"
on:click={loadService(service.serviceID)}
on:keypress={loadService(service.serviceID)}
>
{#if Array.isArray(service.origin?.location)} {#if Array.isArray(service.origin?.location)}
{service.origin.location[0]['locationName'] + {service.origin.location[0]['locationName'] + ' & ' + service.origin.location[1]['locationName']}
' & ' +
service.origin.location[1]['locationName']}
{:else} {:else}
{service.origin?.location?.locationName || ''} {service.origin?.location?.locationName || ''}
{/if} {/if}
</td> </td>
<td <td class="origdest to" on:click={loadService(service.serviceID)} on:keypress={loadService(service.serviceID)}>
class="origdest to"
on:click={loadService(service.serviceID)}
on:keypress={loadService(service.serviceID)}
>
{#if Array.isArray(service.destination?.location)} {#if Array.isArray(service.destination?.location)}
{service.destination.location[0]['locationName'] + {service.destination.location[0]['locationName'] + ' & ' + service.destination.location[0]['locationName']}
' & ' +
service.destination.location[0]['locationName']}
{:else} {:else}
{service.destination?.location?.locationName || ''} {service.destination?.location?.locationName || ''}
{/if} {/if}
</td> </td>
<td class="plat">{service.platform || '-'}</td> <td class="plat">{service.platform || '-'}</td>
<td class="time">{parseTime(service.sta).data}</td> <td class="time">{parseTime(service.sta).data}</td>
<td class="time {parseTime(service.eta).changed}" <td class="time {parseTime(service.eta).changed}">{parseTime(service.eta).data}</td>
>{parseTime(service.eta).data}</td
>
<td class="time">{parseTime(service.std).data}</td> <td class="time">{parseTime(service.std).data}</td>
<td class="time {parseTime(service.etd).changed}" <td class="time {parseTime(service.etd).changed}">{parseTime(service.etd).data}</td>
>{parseTime(service.etd).data}</td
>
</tr> </tr>
<tr <tr
@ -228,11 +210,7 @@
{/if} {/if}
{#if busServices.length} {#if busServices.length}
<br /> <br />
<img <img class="transport-mode" src="/images/transport-modes/bus.svg" alt="Bus services" /><br />
class="transport-mode"
src="/images/transport-modes/bus.svg"
alt="Bus services"
/><br />
<span class="table-head-text">Bus Services</span> <span class="table-head-text">Bus Services</span>
<table class="ldbTable"> <table class="ldbTable">
<tr> <tr>
@ -245,26 +223,14 @@
</tr> </tr>
{#each busServices as service} {#each busServices as service}
<tr> <tr>
<td <td class="origdest from" on:click={loadBusService(service.serviceID)} on:keypress={loadBusService(service.serviceID)}>{service.origin?.location?.locationName || ''}</td>
class="origdest from" <td class="origdest to" on:click={loadBusService(service.serviceID)} on:keypress={loadBusService(service.serviceID)}
on:click={loadBusService(service.serviceID)}
on:keypress={loadBusService(service.serviceID)}
>{service.origin?.location?.locationName || ''}</td
>
<td
class="origdest to"
on:click={loadBusService(service.serviceID)}
on:keypress={loadBusService(service.serviceID)}
>{service.destination?.location?.locationName || ''}</td >{service.destination?.location?.locationName || ''}</td
> >
<td class="time">{parseTime(service.sta).data}</td> <td class="time">{parseTime(service.sta).data}</td>
<td class="time {parseTime(service.eta).changed}" <td class="time {parseTime(service.eta).changed}">{parseTime(service.eta).data}</td>
>{parseTime(service.eta).data}</td
>
<td class="time">{parseTime(service.std).data}</td> <td class="time">{parseTime(service.std).data}</td>
<td class="time {parseTime(service.etd).changed}" <td class="time {parseTime(service.etd).changed}">{parseTime(service.etd).data}</td>
>{parseTime(service.etd).data}</td
>
</tr> </tr>
<tr <tr
@ -285,11 +251,7 @@
{/if} {/if}
{#if ferryServices.length} {#if ferryServices.length}
<br /> <br />
<img <img class="transport-mode" src="/images/transport-modes/ferry.svg" alt="Bus services" /><br />
class="transport-mode"
src="/images/transport-modes/ferry.svg"
alt="Bus services"
/><br />
<span class="table-head-text">Ferry Services</span> <span class="table-head-text">Ferry Services</span>
<table class="ldbTable"> <table class="ldbTable">
<tr> <tr>
@ -302,20 +264,12 @@
</tr> </tr>
{#each ferryServices as service} {#each ferryServices as service}
<tr> <tr>
<td class="origdest from" <td class="origdest from">{service.origin?.location?.locationName || ''}</td>
>{service.origin?.location?.locationName || ''}</td <td class="origdest to">{service.destination?.location?.locationName || ''}</td>
>
<td class="origdest to"
>{service.destination?.location?.locationName || ''}</td
>
<td class="time">{parseTime(service.sta).data}</td> <td class="time">{parseTime(service.sta).data}</td>
<td class="time {parseTime(service.eta).changed}" <td class="time {parseTime(service.eta).changed}">{parseTime(service.eta).data}</td>
>{parseTime(service.eta).data}</td
>
<td class="time">{parseTime(service.std).data}</td> <td class="time">{parseTime(service.std).data}</td>
<td class="time {parseTime(service.etd).changed}" <td class="time {parseTime(service.etd).changed}">{parseTime(service.etd).data}</td>
>{parseTime(service.etd).data}</td
>
</tr> </tr>
<tr <tr
@ -352,35 +306,17 @@
<tr> <tr>
<td>{prevPoint.locationName}</td> <td>{prevPoint.locationName}</td>
<td>{prevPoint.st}</td> <td>{prevPoint.st}</td>
<td <td class="time {parseTime(prevPoint.at || prevPoint.et).changed}">{parseTime(prevPoint.at || prevPoint.et).data}</td>
class="time {parseTime(prevPoint.at || prevPoint.et).changed}"
>{parseTime(prevPoint.at || prevPoint.et).data}</td
>
</tr> </tr>
{/each} {/each}
{:else} {:else}
<tr> <tr>
<td>{serviceDetail.previousCallingPoints.callingPointList.callingPoint.locationName}</td>
<td>{serviceDetail.previousCallingPoints.callingPointList.callingPoint.st}</td>
<td <td
>{serviceDetail.previousCallingPoints.callingPointList class="time {parseTime(serviceDetail.previousCallingPoints.callingPointList.callingPoint.at || serviceDetail.previousCallingPoints.callingPointList.callingPoint.et)
.callingPoint.locationName}</td .changed}"
> >{parseTime(serviceDetail.previousCallingPoints.callingPointList.callingPoint.at || serviceDetail.previousCallingPoints.callingPointList.callingPoint.et).data}</td
<td
>{serviceDetail.previousCallingPoints.callingPointList
.callingPoint.st}</td
>
<td
class="time {parseTime(
serviceDetail.previousCallingPoints.callingPointList
.callingPoint.at ||
serviceDetail.previousCallingPoints.callingPointList
.callingPoint.et
).changed}"
>{parseTime(
serviceDetail.previousCallingPoints.callingPointList
.callingPoint.at ||
serviceDetail.previousCallingPoints.callingPointList
.callingPoint.et
).data}</td
> >
</tr> </tr>
{/if} {/if}
@ -388,11 +324,7 @@
<tr class="thisStop"> <tr class="thisStop">
<td>{title}</td> <td>{title}</td>
<td>{serviceDetail.std || serviceDetail.sta}</td> <td>{serviceDetail.std || serviceDetail.sta}</td>
<td <td class="time {parseTime(serviceDetail.etd || serviceDetail.eta).changed}">{parseTime(serviceDetail.etd || serviceDetail.eta).data}</td>
class="time {parseTime(serviceDetail.etd || serviceDetail.eta)
.changed}"
>{parseTime(serviceDetail.etd || serviceDetail.eta).data}</td
>
</tr> </tr>
{#if serviceDetail?.subsequentCallingPoints?.callingPointList?.callingPoint} {#if serviceDetail?.subsequentCallingPoints?.callingPointList?.callingPoint}
{#if Array.isArray(serviceDetail?.subsequentCallingPoints?.callingPointList?.callingPoint)} {#if Array.isArray(serviceDetail?.subsequentCallingPoints?.callingPointList?.callingPoint)}
@ -400,30 +332,15 @@
<tr> <tr>
<td>{nextPoint.locationName}</td> <td>{nextPoint.locationName}</td>
<td>{nextPoint.st}</td> <td>{nextPoint.st}</td>
<td class="time {parseTime(nextPoint.et).changed}" <td class="time {parseTime(nextPoint.et).changed}">{parseTime(nextPoint.et).data}</td>
>{parseTime(nextPoint.et).data}</td
>
</tr> </tr>
{/each} {/each}
{:else} {:else}
<tr class="detailRow"> <tr class="detailRow">
<td <td>{serviceDetail.subsequentCallingPoints.callingPointList.callingPoint.locationName}</td>
>{serviceDetail.subsequentCallingPoints.callingPointList <td>{serviceDetail.subsequentCallingPoints.callingPointList.callingPoint.st}</td>
.callingPoint.locationName}</td <td class="time {parseTime(serviceDetail.subsequentCallingPoints.callingPointList.callingPoint.et).changed}"
> >{parseTime(serviceDetail.subsequentCallingPoints.callingPointList.callingPoint.et).data}</td
<td
>{serviceDetail.subsequentCallingPoints.callingPointList
.callingPoint.st}</td
>
<td
class="time {parseTime(
serviceDetail.subsequentCallingPoints.callingPointList
.callingPoint.et
).changed}"
>{parseTime(
serviceDetail.subsequentCallingPoints.callingPointList
.callingPoint.et
).data}</td
> >
</tr> </tr>
{/if} {/if}

View File

@ -209,9 +209,7 @@
let processedMessages = []; let processedMessages = [];
for (const message of arrMessages) { for (const message of arrMessages) {
const msgText = message.xhtmlMessage; const msgText = message.xhtmlMessage;
processedMessages.push( processedMessages.push(msgText.replace(/[\n\r]/g, '').replace(/<\/?p[^>]*>/g, ''));
msgText.replace(/[\n\r]/g, '').replace(/<\/?p[^>]*>/g, '')
);
} }
return processedMessages; return processedMessages;
} }
@ -228,11 +226,7 @@
<AlertBar {alerts} /> <AlertBar {alerts} />
{/if} {/if}
<table> <table>
<tr <tr><td colspan="8" id="timestamp">Updated: {dataAge.toLocaleTimeString()} - Staff Boards under development</td></tr>
><td colspan="8" id="timestamp"
>Updated: {dataAge.toLocaleTimeString()} - Staff Boards under development</td
></tr
>
<tr> <tr>
<th class="id">ID</th> <th class="id">ID</th>
<th class="from">From</th> <th class="from">From</th>
@ -254,36 +248,15 @@
where 'length' is not provided but 'formation' is. --> where 'length' is not provided but 'formation' is. -->
<tr> <tr>
<td class="id id-data data">{service.trainid}</td> <td class="id id-data data">{service.trainid}</td>
<td <td class="from from-data data {serviceStats.isCancelled && 'can-dat'}">{serviceStats.from}</td>
class="from from-data data {serviceStats.isCancelled && 'can-dat'}" <td class="to to-data data {serviceStats.isCancelled && 'can-dat'}">{serviceStats.to}</td>
>{serviceStats.from}</td <td class="plat plat-data data {serviceStats.isCancelled && 'can-dat'} {serviceStats.platformHidden && 'hidden'}">{serviceStats.platform.number || '-'}</td>
> <td class="time time-data data {serviceStats.isCancelled && 'can-dat'}">{serviceStats.schArr}</td>
<td class="to to-data data {serviceStats.isCancelled && 'can-dat'}" <td class="time time-data data {serviceStats.isArrDelayed && 'late'} {serviceStats.isEarlyArr && 'early'} {serviceStats.isLateArr && 'late'}"
>{serviceStats.to}</td
>
<td
class="plat plat-data data {serviceStats.isCancelled &&
'can-dat'} {serviceStats.platformHidden && 'hidden'}"
>{serviceStats.platform.number || '-'}</td
>
<td
class="time time-data data {serviceStats.isCancelled && 'can-dat'}"
>{serviceStats.schArr}</td
>
<td
class="time time-data data {serviceStats.isArrDelayed &&
'late'} {serviceStats.isEarlyArr &&
'early'} {serviceStats.isLateArr && 'late'}"
>{serviceStats.isArrDelayed ? 'LATE' : serviceStats.expArr}</td >{serviceStats.isArrDelayed ? 'LATE' : serviceStats.expArr}</td
> >
<td <td class="time time-data data {serviceStats.isCancelled && 'can-dat'}">{serviceStats.schDep}</td>
class="time time-data data {serviceStats.isCancelled && 'can-dat'}" <td class="time time-data data {serviceStats.isDepDelayed && 'late'} {serviceStats.isEarlyDep && 'early'} {serviceStats.isLateDep && 'late'}"
>{serviceStats.schDep}</td
>
<td
class="time time-data data {serviceStats.isDepDelayed &&
'late'} {serviceStats.isEarlyDep &&
'early'} {serviceStats.isLateDep && 'late'}"
>{serviceStats.isDepDelayed ? 'LATE' : serviceStats.expDep}</td >{serviceStats.isDepDelayed ? 'LATE' : serviceStats.expDep}</td
> >
</tr> </tr>

View File

@ -2,11 +2,7 @@
import { fade } from 'svelte/transition'; import { fade } from 'svelte/transition';
</script> </script>
<div <div id="container" in:fade={{ delay: 150, duration: 250 }} out:fade={{ duration: 250 }}>
id="container"
in:fade={{ delay: 150, duration: 250 }}
out:fade={{ duration: 250 }}
>
<div class="spinner" /> <div class="spinner" />
<p>Loading...</p> <p>Loading...</p>
</div> </div>

View File

@ -11,11 +11,7 @@
<footer> <footer>
{#each links as item} {#each links as item}
<a <a class="footerLink" href={item.path} class:active={$page.url.pathname == item.path}>
class="footerLink"
href={item.path}
class:active={$page.url.pathname == item.path}
>
<img src={item.svgPath} alt={item.title} /> <img src={item.svgPath} alt={item.title} />
<br /> <br />
<span>{item.title}</span> <span>{item.title}</span>
@ -26,11 +22,7 @@
<picture> <picture>
<source srcset="/images/nre/nre-powered_200w.jxl" type="image/jxl" /> <source srcset="/images/nre/nre-powered_200w.jxl" type="image/jxl" />
<source srcset="/images/nre/nre-powered_200w.webp" type="image/webp" /> <source srcset="/images/nre/nre-powered_200w.webp" type="image/webp" />
<img <img id="nre-logo" src="/images/nre/nre-powered_200w.png" alt="Data sourced from National Rail and others" />
id="nre-logo"
src="/images/nre/nre-powered_200w.png"
alt="Data sourced from National Rail and others"
/>
</picture> </picture>
</a> </a>
</div> </div>
@ -76,11 +68,7 @@
@media only screen and (min-width: 475px) { @media only screen and (min-width: 475px) {
.data-source { .data-source {
background: rgb(255, 255, 255); background: rgb(255, 255, 255);
background: linear-gradient( background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 40%);
90deg,
rgba(255, 255, 255, 0) 0%,
rgba(255, 255, 255, 1) 40%
);
} }
#nre-logo { #nre-logo {
position: absolute; position: absolute;

View File

@ -28,8 +28,7 @@
'<h3>PIS Finder</h3>' + '<h3>PIS Finder</h3>' +
"<p>Don't worry, the PIS finder hasn't gone away. It has even been moved to the new navigation bar for faster access</p>" + "<p>Don't worry, the PIS finder hasn't gone away. It has even been moved to the new navigation bar for faster access</p>" +
"<p>If there isn't a PIS code available for a given headcode, you can use this tool to search by start and end stations, enabling you to utilise a different code and skipping stops as needed.</p>", "<p>If there isn't a PIS code available for a given headcode, you can use this tool to search by start and end stations, enabling you to utilise a different code and skipping stops as needed.</p>",
'<h3>Everything Else</h3>' + '<h3>Everything Else</h3>' + "<p>Everything else has moved to the 'More' menu, where you'll find the Reference Code lookup and software details."
"<p>Everything else has moved to the 'More' menu, where you'll find the Reference Code lookup and software details."
]; ];
</script> </script>

View File

@ -8,9 +8,7 @@ function fromLocalStorage(storageKey, fallback) {
if (browser) { if (browser) {
const storedValue = localStorage.getItem(storageKey); const storedValue = localStorage.getItem(storageKey);
if (storedValue !== 'undefined' && storedValue !== null) { if (storedValue !== 'undefined' && storedValue !== null) {
return typeof fallback === 'object' return typeof fallback === 'object' ? JSON.parse(storedValue) : storedValue;
? JSON.parse(storedValue)
: storedValue;
} }
} }
return fallback; return fallback;
@ -19,8 +17,7 @@ function fromLocalStorage(storageKey, fallback) {
function toLocalStorage(store, storageKey) { function toLocalStorage(store, storageKey) {
if (browser) { if (browser) {
store.subscribe((value) => { store.subscribe((value) => {
let storageValue = let storageValue = typeof value === 'object' ? JSON.stringify(value) : value;
typeof value === 'object' ? JSON.stringify(value) : value;
localStorage.setItem(storageKey, storageValue); localStorage.setItem(storageKey, storageValue);
}); });

View File

@ -13,11 +13,8 @@
<div class="container"> <div class="container">
<div class="container-header" on:click={expand} on:keypress={expand}> <div class="container-header" on:click={expand} on:keypress={expand}>
<span class="header" <span class="header"
>{service.operator || 'GW'}: {service.stops[0]['publicDeparture'] || >{service.operator || 'GW'}: {service.stops[0]['publicDeparture'] || service.stops[0]['wttDeparture']}
service.stops[0]['wttDeparture']} {service.stops[0]['tiploc']} to {service.stops[service['stops'].length - 1]['tiploc']}</span
{service.stops[0]['tiploc']} to {service.stops[
service['stops'].length - 1
]['tiploc']}</span
> >
<span id="container-arrow" class:isExpanded>V</span> <span id="container-arrow" class:isExpanded>V</span>
</div> </div>
@ -27,19 +24,15 @@
<p class="pis">PIS: {service.pis}</p> <p class="pis">PIS: {service.pis}</p>
{/if} {/if}
<p class="svc-detail"> <p class="svc-detail">
Planned Type: {parseInt(service.planSpeed) || 68}mph {service.powerType || Planned Type: {parseInt(service.planSpeed) || 68}mph {service.powerType || 'Bus'}
'Bus'}
</p> </p>
<p class="svc-detail"> <p class="svc-detail">
Days Run: {service.daysRun.join(', ').toUpperCase()} Days Run: {service.daysRun.join(', ').toUpperCase()}
</p> </p>
<p class="svc-detail validity"> <p class="svc-detail validity">
Valid From: {new Date(service.scheduleStartDate).toLocaleDateString( Valid From: {new Date(service.scheduleStartDate).toLocaleDateString('en-GB', {
'en-GB',
{
timeZone: 'UTC' timeZone: 'UTC'
} })} - {new Date(service.scheduleEndDate).toLocaleDateString('en-GB', {
)} - {new Date(service.scheduleEndDate).toLocaleDateString('en-GB', {
timeZone: 'UTC' timeZone: 'UTC'
})} })}
</p> </p>

View File

@ -11,10 +11,7 @@
{#if $page.status === 404} {#if $page.status === 404}
<p>This is not the page you're looking for.</p> <p>This is not the page you're looking for.</p>
<p> <p>The page you are looking for doesn't exist, use the tabs below to find another page.</p>
The page you are looking for doesn't exist, use the tabs below to find
another page.
</p>
{:else if $page.status === 500} {:else if $page.status === 500}
<p> <p>
Something went wrong loading the app.<br /> Something went wrong loading the app.<br />
@ -22,10 +19,7 @@
</p> </p>
<p>If the problem persists, you can report an issue from the 'More' menu.</p> <p>If the problem persists, you can report an issue from the 'More' menu.</p>
{:else} {:else}
<p> <p>Not sure what went wrong, please try again later or report an issue from the 'More' menu.</p>
Not sure what went wrong, please try again later or report an issue from the
'More' menu.
</p>
{/if} {/if}
<Nav /> <Nav />

View File

@ -6,10 +6,7 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="application-name" content="OwlBoard" /> <meta name="application-name" content="OwlBoard" />
<meta name="author" content="Frederick Boniface" /> <meta name="author" content="Frederick Boniface" />
<meta <meta name="description" content="Live train data, PIS Codes & reference data. Built by railway staff, for railway staff." />
name="description"
content="Live train data, PIS Codes & reference data. Built by railway staff, for railway staff."
/>
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<meta name="theme-color" content="#00b7b7" /> <meta name="theme-color" content="#00b7b7" />
<link rel="icon" href="/images/icon.svg" type="image/svg+xml" /> <link rel="icon" href="/images/icon.svg" type="image/svg+xml" />

View File

@ -10,13 +10,8 @@
<LargeLogo /> <LargeLogo />
<p class="neg">&copy; 2022-2023 Frederick Boniface</p> <p class="neg">&copy; 2022-2023 Frederick Boniface</p>
<p>OwlBoard was created by train-crew for train-crew</p> <p>OwlBoard was created by train-crew for train-crew</p>
<p> <p>I created OwlBoard in 2022 to freely give fast and easy access to the information that we need every day.</p>
I created OwlBoard in 2022 to freely give fast and easy access to the <p>Data sourced from: National Rail Enquiries, OwlBoard Project and Network Rail.</p>
information that we need every day.
</p>
<p>
Data sourced from: National Rail Enquiries, OwlBoard Project and Network Rail.
</p>
<p> <p>
OwlBoard components are available under various Open Source licenses, see the OwlBoard components are available under various Open Source licenses, see the
<a href="https://git.fjla.uk/OwlBoard" target="_blank">code repository</a> <a href="https://git.fjla.uk/OwlBoard" target="_blank">code repository</a>

View File

@ -82,46 +82,15 @@
<form on:submit={submit}> <form on:submit={submit}>
<input type="text" readonly placeholder="Name" bind:value={val.name} /> <input type="text" readonly placeholder="Name" bind:value={val.name} />
<br /> <br />
<input <input type="text" maxlength="3" autocomplete="off" placeholder="CRS/3ALPHA" bind:value={val.crs} />
type="text"
maxlength="3"
autocomplete="off"
placeholder="CRS/3ALPHA"
bind:value={val.crs}
/>
<br /> <br />
<input <input type="text" maxlength="7" autocomplete="off" placeholder="TIPLOC" bind:value={val.tiploc} />
type="text"
maxlength="7"
autocomplete="off"
placeholder="TIPLOC"
bind:value={val.tiploc}
/>
<br /> <br />
<input <input type="text" maxlength="10" autocomplete="off" placeholder="STANOX" bind:value={val.stanox} />
type="text"
maxlength="10"
autocomplete="off"
placeholder="STANOX"
bind:value={val.stanox}
/>
<br /> <br />
<input <input type="number" maxlength="6" min="0" autocomplete="off" placeholder="NLC" bind:value={val.nlc} />
type="number"
maxlength="6"
min="0"
autocomplete="off"
placeholder="NLC"
bind:value={val.nlc}
/>
<br /> <br />
<input <input type="text" readonly autocomplete="off" placeholder="UIC" bind:value={val.uic} />
type="text"
readonly
autocomplete="off"
placeholder="UIC"
bind:value={val.uic}
/>
<br /> <br />
<button type="submit">Submit</button> <button type="submit">Submit</button>
<button type="reset" on:click={reset}>Reset</button> <button type="reset" on:click={reset}>Reset</button>

View File

@ -35,17 +35,9 @@
<Header {title} /> <Header {title} />
<p> <p>OwlBoard stores as little data about you as possible to offer the service.</p>
OwlBoard stores as little data about you as possible to offer the service. <p>Your randomly generated UUID is not displayed, this is stored in your browser and on the OwlBoard server.</p>
</p> <p>The data below is the entirity of the data we hold about you and constitutes a response to a `Subject Access Request` under GDPR legislation.</p>
<p>
Your randomly generated UUID is not displayed, this is stored in your browser
and on the OwlBoard server.
</p>
<p>
The data below is the entirity of the data we hold about you and constitutes a
response to a `Subject Access Request` under GDPR legislation.
</p>
<br /><br /> <br /><br />
{#if isLoading} {#if isLoading}
@ -54,9 +46,7 @@
<p class="api_response">Registration Domain: {data[0]['domain']}</p> <p class="api_response">Registration Domain: {data[0]['domain']}</p>
<p class="api_response">Access Time: {data[0]['atime']}</p> <p class="api_response">Access Time: {data[0]['atime']}</p>
{:else} {:else}
<p class="api_response"> <p class="api_response">You are not registered, we don't have any data stored.</p>
You are not registered, we don't have any data stored.
</p>
{/if} {/if}
<Nav /> <Nav />

View File

@ -7,57 +7,32 @@
<Header {title} /> <Header {title} />
<div> <div>
<p> <p>
OwlBoard stores the minimum amount of data necessary to provide its OwlBoard stores the minimum amount of data necessary to provide its functions for your use. No personal data is stored unless you report an issue. To review the specific data
functions for your use. No personal data is stored unless you report an that we store, please visit <a href="/more/data">My Data</a>.
issue. To review the specific data that we store, please visit <a
href="/more/data">My Data</a
>.
</p>
<p>
OwlBoard does not utilize any cookies. IP addresses and browser fingerprints
are not logged.
</p> </p>
<p>OwlBoard does not utilize any cookies. IP addresses and browser fingerprints are not logged.</p>
<h2>If You Do Not Sign Up</h2> <h2>If You Do Not Sign Up</h2>
<p> <p>
If you choose not to sign up, no personal data will be processed or stored If you choose not to sign up, no personal data will be processed or stored unless you report an issue. Any personal settings are stored locally in your browser and do not leave
unless you report an issue. Any personal settings are stored locally in your your device.
browser and do not leave your device.
</p> </p>
<h2>If You Sign Up</h2> <h2>If You Sign Up</h2>
<p> <p>
If you sign up for the rail staff version of OwlBoard, we do require the If you sign up for the rail staff version of OwlBoard, we do require the storage of some data. However, none of this data can be used to personally identify you. Any personal
storage of some data. However, none of this data can be used to personally settings are stored locally in your browser and do not leave your device.
identify you. Any personal settings are stored locally in your browser and
do not leave your device.
</p> </p>
<p> <p>
During the sign-up process, you will be asked to provide a work email During the sign-up process, you will be asked to provide a work email address, which will be checked to confirm its origin from a railway company. Once confirmed, an email
address, which will be checked to confirm its origin from a railway company. containing a registration link will be sent to you. At this point, the username portion of your email address is discarded. For example, if your email address is
Once confirmed, an email containing a registration link will be sent to you. 'a-user@owlboard.info', only 'owlboard.info' will be stored. This host portion of your email address is stored to filter and display relevant results prominently.
At this point, the username portion of your email address is discarded. For
example, if your email address is 'a-user@owlboard.info', only
'owlboard.info' will be stored. This host portion of your email address is
stored to filter and display relevant results prominently.
</p>
<p>
The email server may store the address and message content as part of its
regular operation, and your consent to this is implied when you sign up.
</p>
<p>
In addition to the host portion of your email address, a randomly generated
UUID is stored for the purpose of authorizing access to the rail staff data.
</p> </p>
<p>The email server may store the address and message content as part of its regular operation, and your consent to this is implied when you sign up.</p>
<p>In addition to the host portion of your email address, a randomly generated UUID is stored for the purpose of authorizing access to the rail staff data.</p>
<h2>Reporting an Issue</h2> <h2>Reporting an Issue</h2>
<p>When you report an issue, certain data is collected, including your browser's User Agent string and the size of the window in which you are viewing the website.</p>
<p> <p>
When you report an issue, certain data is collected, including your Any data submitted when reporting an issue will be publicly viewable alongside the <a href="https://git.fjla.uk/owlboard/backend/issues" target="_blank"
browser's User Agent string and the size of the window in which you are >OwlBoard/backend git repository</a
viewing the website.
</p>
<p>
Any data submitted when reporting an issue will be publicly viewable
alongside the <a
href="https://git.fjla.uk/owlboard/backend/issues"
target="_blank">OwlBoard/backend git repository</a
>. >.
</p> </p>
</div> </div>

View File

@ -64,18 +64,9 @@
</script> </script>
<Header {title} /> <Header {title} />
<p> <p>A reason code is a three digit number that maps to a reason for a delay or cancellation</p>
A reason code is a three digit number that maps to a reason for a delay or
cancellation
</p>
<form on:submit={handleSubmit}> <form on:submit={handleSubmit}>
<input <input type="text" placeholder="Enter Code" autocomplete="off" bind:value={inputValue} on:input={handleInput} />
type="text"
placeholder="Enter Code"
autocomplete="off"
bind:value={inputValue}
on:input={handleInput}
/>
<br /> <br />
@ -105,8 +96,7 @@
border-radius: 50px; border-radius: 50px;
border: none; border: none;
text-align: center; text-align: center;
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
text-transform: uppercase; text-transform: uppercase;
font-size: 15px; font-size: 15px;
} }
@ -118,8 +108,7 @@
border: none; border: none;
border-radius: 20px; border-radius: 20px;
padding: 5px; padding: 5px;
font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', font-family: urwgothic, 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
background-color: var(--overlay-color); background-color: var(--overlay-color);

View File

@ -62,47 +62,23 @@
<li>Display up to 40 services</li> <li>Display up to 40 services</li>
</ul> </ul>
</ul> </ul>
<p> <p>To register, you will need to enter a work email address to receive a confirmation email</p>
To register, you will need to enter a work email address to receive a
confirmation email
</p>
<form on:submit={request}> <form on:submit={request}>
<input <input type="text" autocomplete="email" placeholder="Enter work email" bind:value={inputValue} on:input={handleInput} /><br />
type="text"
autocomplete="email"
placeholder="Enter work email"
bind:value={inputValue}
on:input={handleInput}
/><br />
<label for="checkbox"> <label for="checkbox">
I have read and accept the terms of the <a href="/more/privacy" I have read and accept the terms of the <a href="/more/privacy">Privacy Policy</a><br />
>Privacy Policy</a
><br />
<input id="checkbox" type="checkbox" required /> <input id="checkbox" type="checkbox" required />
</label><br /> </label><br />
<button type="submit">Submit</button> <button type="submit">Submit</button>
</form> </form>
{:else if state == 'sent'} {:else if state == 'sent'}
<p> <p>An email has been sent, click the link in the email to activate your profile.</p>
An email has been sent, click the link in the email to activate your <p>When you click the link, your authorisation key will be automatically be stored in your browser.</p>
profile. <p>If you use multiple browsers, you will only be logged in using the browser you open the link with.</p>
</p>
<p>
When you click the link, your authorisation key will be automatically be
stored in your browser.
</p>
<p>
If you use multiple browsers, you will only be logged in using the browser
you open the link with.
</p>
<p>You will be able to register again using the same email address</p> <p>You will be able to register again using the same email address</p>
{:else if state == 'unauth'} {:else if state == 'unauth'}
<p> <p>The email address you entered does not belong to an authorised business.</p>
The email address you entered does not belong to an authorised business. <p>If you think this is an error, you can report an issue in the 'More' menu.</p>
</p>
<p>
If you think this is an error, you can report an issue in the 'More' menu.
</p>
{:else if state == 'error'} {:else if state == 'error'}
<p>There was an error processing your request.</p> <p>There was an error processing your request.</p>
<p>Check that the email you entered was correct or try again later.</p> <p>Check that the email you entered was correct or try again later.</p>
@ -120,8 +96,7 @@
height: 40px; height: 40px;
width: 80%; width: 80%;
max-width: 375px; max-width: 375px;
font-family: urwgothic, 'Franklin Gothic Medium', 'Arial Narrow', Arial, font-family: urwgothic, 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
sans-serif;
text-align: center; text-align: center;
font-size: 20px; font-size: 20px;
border-radius: 50px; border-radius: 50px;

View File

@ -88,20 +88,11 @@
{#if !preFlight && !isDone} {#if !preFlight && !isDone}
<p> <p>
Any data that you enter here will be visible publicly Any data that you enter here will be visible publicly
<a href="https://git.fjla.uk/OwlBoard/backend/issues" target="_blank" <a href="https://git.fjla.uk/OwlBoard/backend/issues" target="_blank">here</a>
>here</a
>
</p>
<p>
You will be shown all of the collected data before the form is submitted.
</p> </p>
<p>You will be shown all of the collected data before the form is submitted.</p>
<form on:submit={submit}> <form on:submit={submit}>
<select <select class="formInputs" name="type" bind:value={reportType} placeholder="Choose Category">
class="formInputs"
name="type"
bind:value={reportType}
placeholder="Choose Category"
>
<option value="" disabled selected>Choose an Issue Type</option> <option value="" disabled selected>Choose an Issue Type</option>
<option value="bug">Problem</option> <option value="bug">Problem</option>
<option value="enhancement">Feature Request</option> <option value="enhancement">Feature Request</option>
@ -109,18 +100,9 @@
<option value="user-support">Unable to sign up</option> <option value="user-support">Unable to sign up</option>
</select> </select>
<br /> <br />
<input <input class="formInputs" type="text" bind:value={reportSubject} placeholder="Subject" />
class="formInputs"
type="text"
bind:value={reportSubject}
placeholder="Subject"
/>
<br /> <br />
<textarea <textarea class="formInputs" bind:value={reportMsg} placeholder="Enter your message..." />
class="formInputs"
bind:value={reportMsg}
placeholder="Enter your message..."
/>
<br /> <br />
<button type="submit">Submit</button> <button type="submit">Submit</button>
<button type="reset">Reset</button> <button type="reset">Reset</button>

View File

@ -96,33 +96,15 @@
<p>This feature is only supported for GWR West & Sleeper services</p> <p>This feature is only supported for GWR West & Sleeper services</p>
<p class="label">Find By Start/End CRS:</p> <p class="label">Find By Start/End CRS:</p>
<form on:submit={findByStartEnd}> <form on:submit={findByStartEnd}>
<input <input type="text" maxlength="3" autocomplete="off" placeholder="Start" bind:value={entryStartCRS} />
type="text" <input type="text" maxlength="3" autocomplete="off" placeholder="End" bind:value={entryEndCRS} />
maxlength="3"
autocomplete="off"
placeholder="Start"
bind:value={entryStartCRS}
/>
<input
type="text"
maxlength="3"
autocomplete="off"
placeholder="End"
bind:value={entryEndCRS}
/>
<br /> <br />
<button type="submit">Search</button> <button type="submit">Search</button>
</form> </form>
<p class="label">Find By PIS Code:</p> <p class="label">Find By PIS Code:</p>
<form on:submit={findByPis}> <form on:submit={findByPis}>
<input <input type="number" max="9999" autocomplete="off" placeholder="PIS" bind:value={entryPIS} />
type="number"
max="9999"
autocomplete="off"
placeholder="PIS"
bind:value={entryPIS}
/>
<br /> <br />
<button type="submit">Search</button> <button type="submit">Search</button>
</form> </form>