Compare commits
4 Commits
b3b61258c8
...
587bd31130
Author | SHA1 | Date |
---|---|---|
Fred Boniface | 587bd31130 | |
Fred Boniface | c6b65c8baf | |
Fred Boniface | 6e7248dafb | |
Fred Boniface | daadc1b6bb |
|
@ -9,12 +9,12 @@
|
||||||
* Enable text search for `locationName` on find-code page.
|
* Enable text search for `locationName` on find-code page.
|
||||||
* Recreate raster logos with the new vector file.
|
* Recreate raster logos with the new vector file.
|
||||||
* Responsive text sizes for boards.
|
* Responsive text sizes for boards.
|
||||||
* Change dockerfile to deploy with brotli support for faster laoding.
|
|
||||||
|
|
||||||
### In Progress:
|
### In Progress:
|
||||||
|
|
||||||
### Completed - Testing:
|
### Completed - Testing:
|
||||||
|
|
||||||
|
* Change dockerfile to deploy with brotli support for faster laoding.
|
||||||
* Implement calling list.
|
* Implement calling list.
|
||||||
* Support multiple origins/destinations: NOT INCLUDING ON CALLING LIST
|
* Support multiple origins/destinations: NOT INCLUDING ON CALLING LIST
|
||||||
* Frontend Code Refactor
|
* Frontend Code Refactor
|
||||||
|
|
|
@ -8,6 +8,7 @@
|
||||||
<meta name="author" content="Frederick Boniface">
|
<meta name="author" content="Frederick Boniface">
|
||||||
<meta name="theme-color" content="#155bb7">
|
<meta name="theme-color" content="#155bb7">
|
||||||
<link rel="stylesheet" type="text/css" href="./styles/main.css"/>
|
<link rel="stylesheet" type="text/css" href="./styles/main.css"/>
|
||||||
|
<link rel="stylesheet" type="text/css" href="./styles/help.css"/>
|
||||||
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
|
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
|
||||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||||
<!-- NO SCRIPTS LOADED - NOT REQUIRED AT PRESENT -->
|
<!-- NO SCRIPTS LOADED - NOT REQUIRED AT PRESENT -->
|
||||||
|
@ -25,21 +26,61 @@
|
||||||
<source srcset="/images/logo/logo-full-256.webp" type="image/webp">
|
<source srcset="/images/logo/logo-full-256.webp" type="image/webp">
|
||||||
<img class="titleimg" src="/images/logo/logo-full-256.png" alt="OwlBoard Logo">
|
<img class="titleimg" src="/images/logo/logo-full-256.png" alt="OwlBoard Logo">
|
||||||
</picture>
|
</picture>
|
||||||
<h2>Help</h2>
|
<h2>Help</h2>
|
||||||
<p>OwlBoard gives you quick and easy access to departure boards for
|
<p>OwlBoard gives you quick and easy access to departure boards for
|
||||||
all National Rail stations in the UK.</p>
|
all National Rail stations in the UK.</p>
|
||||||
<p>Just type a CRS or TIPLOC into the textbox on the homepage and tap
|
<p>Just type a CRS, TIPLOC or STANOX into the textbox on the homepage and tap
|
||||||
enter on the screen or your keypad.</p>
|
enter on the screen or your keypad. You can also select a differnt board type,
|
||||||
<p>For example, Portway Park &
|
more details on your choices below.</p>
|
||||||
Ride's CRS is 'PRI', and its TIPLOC is 'PTWYPR'; Portsmouth Harbour's
|
<p>For example, Portway Park &
|
||||||
CRS is 'PMH', and its TIPLOC is 'PHBR'.</p>
|
Ride's CRS is 'PRI', and its TIPLOC is 'PTWYPR'; Portsmouth Harbour's
|
||||||
<p>A CRS is always three letters,
|
CRS is 'PMH', and its TIPLOC is 'PHBR'.</p>
|
||||||
a TIPLOC can be between 4-7 letters.</p>
|
<p>A CRS is always three letters,
|
||||||
<br>
|
a TIPLOC can be between 4-7 letters.</p>
|
||||||
<h3>Don't know the CRS or TIPLOC?</h3>
|
<br>
|
||||||
<p>Sorry, you can't search for them on OwlBoard yet but will be able to
|
<h3>Don't know the CRS or TIPLOC?</h3>
|
||||||
in the future.</p>
|
<p>Sorry, you can't search by name but you can use our <a href="find-code.html">
|
||||||
<h3>Spotted an issue with the site?</h3>
|
Code Lookup</a> page to help.</p>
|
||||||
|
<h3>Board Types</h3>
|
||||||
|
<h4>Basic Board - Default</h4>
|
||||||
|
<p>The basic board shows the next 10 train arrival and departures, as well as
|
||||||
|
bus and ferry departures where available.</p>
|
||||||
|
<p>You can tap on a trains origin or destination to see service details.</p>
|
||||||
|
<br>
|
||||||
|
<h3>Glossary</h3>
|
||||||
|
<p>Some of the terms may be new to you or different from those commonly used.</p>
|
||||||
|
<table id="table">
|
||||||
|
<tr>
|
||||||
|
<th>Term</th>
|
||||||
|
<th>Definition</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>CAN</td>
|
||||||
|
<td>Cancelled</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>CRS</td>
|
||||||
|
<td>Computer Reservation System Code - correctly termed as '3ALPHA'</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>NLC</td>
|
||||||
|
<td>National Location Code - Used for finance & accounting</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>RT</td>
|
||||||
|
<td>Right rime (On time)</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>STANOX</td>
|
||||||
|
<td>Station Number</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>TIPLOC</td>
|
||||||
|
<td>Timing Point Location (Name)</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
<br>
|
||||||
|
<h3>Spotted an issue with the site?</h3>
|
||||||
<p>Let me know by <a href="./report.html">reporting an issue</a>.</p>
|
<p>Let me know by <a href="./report.html">reporting an issue</a>.</p>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
Binary file not shown.
After Width: | Height: | Size: 1.1 KiB |
|
@ -0,0 +1,40 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8"?>
|
||||||
|
<svg version="1.0" viewBox="0 0 187.5 187.5" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
|
||||||
|
<g transform="translate(.54506 1.0901)">
|
||||||
|
<g transform="translate(11.649 12.217)">
|
||||||
|
<rect x="27.357" y="25.341" width="108.4" height="110.2" rx="2.97" ry="2.8871" fill="#fff" stroke="#000" stroke-linejoin="round" stroke-width="3.063"/>
|
||||||
|
<rect x="44.497" y="25.703" width="74.653" height="56.282" rx="2.0454" ry="1.4745" fill="#fff" stroke="#000" stroke-linejoin="round" stroke-width="3.063"/>
|
||||||
|
<rect x="54.873" y="104.02" width="50.282" height="31.224" rx="1.8157" ry="1.2523" fill="#fff" stroke="#000" stroke-linejoin="round" stroke-width="3.063"/>
|
||||||
|
<rect x="54.42" y="104.02" width="38.051" height="31.224" rx="1.8157" ry="1.2523" fill="#fff" stroke="#000" stroke-linejoin="round" stroke-width="3.063"/>
|
||||||
|
<rect x="59.661" y="108.85" width="9.9589" height="20.587"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<metadata>
|
||||||
|
<rdf:RDF>
|
||||||
|
<cc:Work>
|
||||||
|
<dc:format>image/svg+xml</dc:format>
|
||||||
|
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
|
||||||
|
<cc:license rdf:resource="http://creativecommons.org/licenses/publicdomain/"/>
|
||||||
|
<dc:publisher>
|
||||||
|
<cc:Agent rdf:about="http://openclipart.org/">
|
||||||
|
<dc:title>Openclipart</dc:title>
|
||||||
|
</cc:Agent>
|
||||||
|
</dc:publisher>
|
||||||
|
<dc:title>Floppy disk icon</dc:title>
|
||||||
|
<dc:date>2006-12-26T00:00:00</dc:date>
|
||||||
|
<dc:description/>
|
||||||
|
<dc:source>https://openclipart.org/detail/24502/-by--24502</dc:source>
|
||||||
|
<dc:creator>
|
||||||
|
<cc:Agent>
|
||||||
|
<dc:title>Anonymous</dc:title>
|
||||||
|
</cc:Agent>
|
||||||
|
</dc:creator>
|
||||||
|
</cc:Work>
|
||||||
|
<cc:License rdf:about="http://creativecommons.org/licenses/publicdomain/">
|
||||||
|
<cc:permits rdf:resource="http://creativecommons.org/ns#Reproduction"/>
|
||||||
|
<cc:permits rdf:resource="http://creativecommons.org/ns#Distribution"/>
|
||||||
|
<cc:permits rdf:resource="http://creativecommons.org/ns#DerivativeWorks"/>
|
||||||
|
</cc:License>
|
||||||
|
</rdf:RDF>
|
||||||
|
</metadata>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 1.9 KiB |
|
@ -19,7 +19,7 @@ async function storageAvailable(type) { // Currently not used
|
||||||
/* Array Converter
|
/* Array Converter
|
||||||
Converts a string to a single item array */
|
Converts a string to a single item array */
|
||||||
async function makeArray(data) {
|
async function makeArray(data) {
|
||||||
if (typeof data == "string") {
|
if (!Array.isArray(data)) {
|
||||||
var array = [];
|
var array = [];
|
||||||
array.push(data);
|
array.push(data);
|
||||||
return array;
|
return array;
|
||||||
|
|
|
@ -29,10 +29,27 @@ async function setQl(){
|
||||||
}
|
}
|
||||||
localStorage.setItem("qlOpt", JSON.stringify(qlSet))
|
localStorage.setItem("qlOpt", JSON.stringify(qlSet))
|
||||||
log(`settings.setQl: User settings saved`, "INFO")
|
log(`settings.setQl: User settings saved`, "INFO")
|
||||||
hideLoading();
|
await hideLoading();
|
||||||
|
await showDone();
|
||||||
|
await delay(600);
|
||||||
|
hideDone();
|
||||||
}
|
}
|
||||||
|
|
||||||
async function clearQl(){
|
async function clearQl(){
|
||||||
|
showLoading();
|
||||||
localStorage.removeItem("qlOpt")
|
localStorage.removeItem("qlOpt")
|
||||||
|
log(`settings.setQl: User settings reset to default`, "INFO")
|
||||||
getQl()
|
getQl()
|
||||||
|
await hideLoading();
|
||||||
|
await showDone();
|
||||||
|
await delay(600);
|
||||||
|
hideDone();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function showDone() {
|
||||||
|
document.getElementById("done").style = "opacity: 1";
|
||||||
|
}
|
||||||
|
|
||||||
|
async function hideDone() {
|
||||||
|
document.getElementById("done").style = "opacity: 0";
|
||||||
}
|
}
|
|
@ -23,6 +23,15 @@
|
||||||
<p>Loading</p>
|
<p>Loading</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div id="done">
|
||||||
|
<!-- Insert white tick SVG Here -->
|
||||||
|
<picture id="save-icon">
|
||||||
|
<source srcset="./images/nav/save.svg" type="image/svg+xml">
|
||||||
|
<img src="./images/nav/save-59.png" alt="">
|
||||||
|
</picture>
|
||||||
|
<p>Saved</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div id="top_button" class="hide_micro">
|
<div id="top_button" class="hide_micro">
|
||||||
<button aria-label="Back" class="sidebar_control" onclick="history.back()">⇦</button>
|
<button aria-label="Back" class="sidebar_control" onclick="history.back()">⇦</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -0,0 +1,13 @@
|
||||||
|
/* Glossary */
|
||||||
|
table, th, td {
|
||||||
|
border: 1px solid;
|
||||||
|
border-color: lightgrey;
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
|
||||||
|
#table {
|
||||||
|
color: lightgrey;
|
||||||
|
width: 80%;
|
||||||
|
max-width: 700px;
|
||||||
|
margin: auto;
|
||||||
|
}
|
|
@ -294,6 +294,7 @@ label {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
transition: 0.5s;
|
transition: 0.5s;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Footer Styles */
|
/* Footer Styles */
|
||||||
footer {
|
footer {
|
||||||
background-color: var(--accent-color);
|
background-color: var(--accent-color);
|
||||||
|
|
|
@ -2,3 +2,25 @@
|
||||||
max-width: 100px;
|
max-width: 100px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#done {
|
||||||
|
opacity: 0;
|
||||||
|
position: fixed;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
margin: auto;
|
||||||
|
background-color: var(--overlay-color);
|
||||||
|
border-radius: 45px;
|
||||||
|
padding: 20px;
|
||||||
|
padding-bottom: 1px;
|
||||||
|
min-width: 90px;
|
||||||
|
max-width: 90px;
|
||||||
|
transition: opacity 0.25s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#done p {
|
||||||
|
padding-top: 0px;
|
||||||
|
font-weight: bolder;
|
||||||
|
overflow-wrap: normal;
|
||||||
|
}
|
Reference in New Issue