Begin front-end board work

This commit is contained in:
Fred Boniface 2022-12-19 23:52:27 +00:00
parent f0a6b66cad
commit e1adaa0524
19 changed files with 69 additions and 1 deletions

View File

@ -1,5 +1,11 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"/>
<meta name="description" content="OwlBoard - Live train departures for traincrew."/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="application-name" content="OwlBoard">
<meta name="author" content="Frederick Boniface">
<meta name="theme-color" content="#155bb7">
<title id="pgTitle">OwlBoard - Loading</title> <title id="pgTitle">OwlBoard - Loading</title>
<script src="./js/ldb.js"></script> <script src="./js/ldb.js"></script>
<link rel="stylesheet" type="text/css" href="./styles/style.css"/> <link rel="stylesheet" type="text/css" href="./styles/style.css"/>
@ -9,6 +15,11 @@
</head> </head>
<body> <body>
<div id="content"> <div id="content">
<div id="header">
<h1 id="station_name">SVRNBCH</h1>
<p id="fetch_date" class="header-right">19/12/2022</p>
<p id="fetch_time" class="header-right">23:45:01</p>
</div>
<div id="loading"> <div id="loading">
<div class="spinner"> <div class="spinner">
@ -19,6 +30,12 @@
<div id="output"> <div id="output">
</div> </div>
<div id="footer">
<picture>
<source srcset="./images/nre/nre-powered_200w.webp" type="image/webp">
<img id="nre_logo" src="./images/nre/nre-powered_200w.webp" alt="Powered by National Rail Enquiries">
</picture>
</div>
</div> </div>
</body> </body>
</html> </html>

Binary file not shown.

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 73 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 146 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.2 KiB

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 19 KiB

View File

@ -0,0 +1,12 @@
async function getStation(search){
var params = new URLSearchParams(search);
var stn = params.get('stn')
console.log(`Searching for ${stn}`)
return stn;
}
async function getStaff(search){
var params = new URLSearchParams(search);
var sv = params.get('sv')
return sv;
}

View File

@ -24,7 +24,9 @@
} }
#loading { #loading {
position: absolute; position: absolute;
top: 45%; top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin: auto; margin: auto;
background-color: var(--overlay-color); background-color: var(--overlay-color);
border-radius: 45px; border-radius: 45px;
@ -34,4 +36,41 @@
} }
#loading p { #loading p {
padding-top: 50px; padding-top: 50px;
font-weight: bolder;
}
/* Content: */
#header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 50px;
background-color: var(--overlay-color);
}
#station_name {
position: absolute;
left: 10px;
top: -15px;
text-transform: uppercase;
}
.header-right {
text-align: right;
padding-right: 5px;
margin: 4px;
}
#footer {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 40px;
background-color: var(--overlay-color);
}
#footer img {
height: 35px;
} }