Compare commits
3 Commits
302b749834
...
3148e4b8e9
Author | SHA1 | Date |
---|---|---|
Fred Boniface | 3148e4b8e9 | |
Fred Boniface | eece49a2e3 | |
Fred Boniface | d8e37f1b6d |
|
@ -3,10 +3,5 @@
|
||||||
* Backend - Add Indexes:
|
* Backend - Add Indexes:
|
||||||
- "stations": 3ALPHA, STANOX, TIPLOC
|
- "stations": 3ALPHA, STANOX, TIPLOC
|
||||||
- "corpus": 3ALPHA, NLC, NLCDESC(TEXT)
|
- "corpus": 3ALPHA, NLC, NLCDESC(TEXT)
|
||||||
* Frontend - Implement paginated NRCC Notices as they take up lots of space.
|
* Backend - The list of services should always be an array [] as per the NRCC MEssages.
|
||||||
- Carousel: https://www.section.io/engineering-education/how-to-make-an-image-carousel-for-your-website/
|
* Frontend - Implement error pages
|
||||||
* Frontend - If Ferry Services Present - Load at bottom of screen.
|
|
||||||
* Frontend - Decide what to do with Bus Services.
|
|
||||||
* Frontend - Implement error pages - will need to look at including these on the proxy container too?
|
|
||||||
- https://expressjs.com/en/guide/error-handling.html
|
|
||||||
* Building - Implement build process in dockerfile that minifies and then compresses the static source.
|
|
|
@ -22,6 +22,10 @@ async function get(body, id){
|
||||||
var crs = obj[0]['3ALPHA'];
|
var crs = obj[0]['3ALPHA'];
|
||||||
log.out(`ldbService.get: Determined CRS for lookup to be: ${crs}`);
|
log.out(`ldbService.get: Determined CRS for lookup to be: ${crs}`);
|
||||||
var data = await arrDepBoard(crs);
|
var data = await arrDepBoard(crs);
|
||||||
|
if (data.GetStationBoardResult.nrccMessages) {
|
||||||
|
var msg = await util.cleanMessages(data.GetStationBoardResult.nrccMessages);
|
||||||
|
data.GetStationBoardResult.nrccMessages.message = msg;
|
||||||
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
log.out(`ldbService.get: Error, Unable to find CRS: ${err}`)
|
log.out(`ldbService.get: Error, Unable to find CRS: ${err}`)
|
||||||
var data = {ERROR:'NOT_FOUND',description:'The entered station was not found. Please check and try again.'};
|
var data = {ERROR:'NOT_FOUND',description:'The entered station was not found. Please check and try again.'};
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
const log = require('../utils/log.utils'); // Log Helper
|
const log = require('../utils/log.utils'); // Log Helper
|
||||||
const db = require('../services/dbAccess.services') // DB Access
|
const db = require('../services/dbAccess.services') // DB Access
|
||||||
|
const san = require('../utils/sanitizer.utils') // Sanitiser
|
||||||
|
|
||||||
async function checkCrs(input){
|
async function checkCrs(input){
|
||||||
var INPUT = input.toUpperCase()
|
var INPUT = input.toUpperCase()
|
||||||
|
@ -10,6 +11,19 @@ async function checkCrs(input){
|
||||||
return result
|
return result
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = {
|
async function cleanMessages(input){
|
||||||
checkCrs
|
var out = []
|
||||||
|
if (typeof input.message == "string") {
|
||||||
|
out.push(await san.cleanNrcc(input.message))
|
||||||
|
} else if (typeof input.message == "object") {
|
||||||
|
for(var i = 0; i < input.message.length; i++) {
|
||||||
|
out.push(await san.cleanNrcc(input.message[i]))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return out;
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
checkCrs,
|
||||||
|
cleanMessages
|
||||||
}
|
}
|
|
@ -32,7 +32,14 @@ function cleanApiEndpointNum(input) {
|
||||||
return output
|
return output
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function cleanNrcc(input) {
|
||||||
|
var rmNewline = input.replace(/[\n\r]/g, ""); // Remove newlines
|
||||||
|
var rmPara = rmNewline.replace(/<\/?p[^>]*>/g, ""); // Remove <p> & </p>
|
||||||
|
return rmPara;
|
||||||
|
}
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
cleanApiEndpointTxt,
|
cleanApiEndpointTxt,
|
||||||
cleanApiEndpointNum
|
cleanApiEndpointNum,
|
||||||
|
cleanNrcc
|
||||||
}
|
}
|
|
@ -34,12 +34,14 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="nrcc_notices">
|
<div id="alerts">
|
||||||
<p>
|
<div id="alerts_bar">
|
||||||
Example NRCC Message Here... ... ...
|
<img id="alert_icon" src="./images/nav/alert_icon.svg" alt="">
|
||||||
NRCC Messages can sometimes be long, and sometimes
|
<p id="alert_bar_note">There are <span id="alert_number">no</span> active alerts</p>
|
||||||
short so this must be accounted for.
|
<button id="alert_expand_arrow" onclick="inflateAlerts()">⋁</button>
|
||||||
</p>
|
<div id="alerts_msg">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="output">
|
<div id="output">
|
||||||
|
@ -58,6 +60,17 @@
|
||||||
|
|
||||||
<div id="ferry" class="hide-when-loading">
|
<div id="ferry" class="hide-when-loading">
|
||||||
<p>Ferry Services</p>
|
<p>Ferry Services</p>
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<th class="name">Origin</th>
|
||||||
|
<th class="name">Dest.</th>
|
||||||
|
<th class="plat"></th>
|
||||||
|
<th class="time">Sch Arr.</th>
|
||||||
|
<th class="time">Exp Arr.</th>
|
||||||
|
<th class="time">Sch Dep.</th>
|
||||||
|
<th class="time">Exp Dep.</th>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div id="error_notice" class="main-notice hide-when-loading">
|
<div id="error_notice" class="main-notice hide-when-loading">
|
||||||
|
|
|
@ -0,0 +1,10 @@
|
||||||
|
<?xml version="1.0"?>
|
||||||
|
<svg xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://web.resource.org/cc/" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:svg="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" enable-background="new 0 0 448 433" viewBox="0 0 448 433">
|
||||||
|
<radialGradient id="XMLID_1_" gradientUnits="userSpaceOnUse" cy="393.79" cx="216.7" r="296.7">
|
||||||
|
<stop stop-color="#F4D708" offset="0"/>
|
||||||
|
<stop stop-color="#FCB400" offset="1"/>
|
||||||
|
</radialGradient>
|
||||||
|
<path d="m8.551 390.5l184.85-368.8s26.409-31.504 52.815 0c26.41 31.501 180.19 370.65 180.19 370.65s3.105 18.534-27.961 18.534-361.94 0-361.94 0-23.299 0-27.959-20.38z" fill="url(#XMLID_1_)"/>
|
||||||
|
<path stroke="#E2A713" stroke-width="5" d="m8.551 390.5l184.85-368.8s26.409-31.504 52.815 0c26.41 31.501 180.19 370.65 180.19 370.65s3.105 18.534-27.961 18.534-361.94 0-361.94 0-23.299 0-27.959-20.38z" fill="none"/>
|
||||||
|
<path d="m212.5 292.63c-13.168-79.969-19.75-123.12-19.75-129.45 0-7.703 2.551-13.926 7.66-18.676 5.105-4.746 10.871-7.121 17.293-7.121 6.949 0 12.82 2.535 17.609 7.598s7.188 11.023 7.188 17.883c0 6.543-6.668 49.801-20 129.77h-10zm27 38.17c0 6.098-2.156 11.301-6.469 15.613-4.313 4.309-9.461 6.465-15.453 6.465-6.098 0-11.301-2.156-15.613-6.465-4.313-4.313-6.465-9.516-6.465-15.613 0-5.992 2.152-11.141 6.465-15.453s9.516-6.469 15.613-6.469c5.992 0 11.141 2.156 15.453 6.469s6.48 9.45 6.48 15.44z"/>
|
||||||
|
<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>Warning Notification</dc:title><dc:date>2007-02-08T17:08:47</dc:date><dc:description>Beveled yellow caution sign</dc:description><dc:source>http://openclipart.org/detail/3130/warning-notification-by-eastshores</dc:source><dc:creator><cc:Agent><dc:title>eastshores</dc:title></cc:Agent></dc:creator><dc:subject><rdf:Bag><rdf:li>alert</rdf:li><rdf:li>caution</rdf:li><rdf:li>clip art</rdf:li><rdf:li>clipart</rdf:li><rdf:li>icon</rdf:li><rdf:li>image</rdf:li><rdf:li>media</rdf:li><rdf:li>public domain</rdf:li><rdf:li>svg</rdf:li><rdf:li>warning</rdf:li></rdf:Bag></dc:subject></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: 2.7 KiB |
|
@ -55,6 +55,10 @@ async function parseTime(string){
|
||||||
var output = "-";
|
var output = "-";
|
||||||
var change = "";
|
var change = "";
|
||||||
break;
|
break;
|
||||||
|
case "No report":
|
||||||
|
var output = "?";
|
||||||
|
var change = "";
|
||||||
|
break;
|
||||||
default:
|
default:
|
||||||
var output = string;
|
var output = string;
|
||||||
var change = "changed";
|
var change = "changed";
|
||||||
|
@ -66,3 +70,32 @@ async function parseTime(string){
|
||||||
async function parseName() {
|
async function parseName() {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Display Alert Messages
|
||||||
|
async function displayAlerts(array) {
|
||||||
|
var counter = 0
|
||||||
|
for(var i = 0; i < array.length; i++) {
|
||||||
|
// Increment counter
|
||||||
|
counter += 1;
|
||||||
|
// Reset Vars
|
||||||
|
var msg = array[i];
|
||||||
|
console.log(`Alert: ${msg}`);
|
||||||
|
document.getElementById("alerts_msg").insertAdjacentHTML("beforeend", `<p>${msg}</p>`);
|
||||||
|
}
|
||||||
|
document.getElementById("alert_number").innerHTML = `${counter}`
|
||||||
|
document.getElementById("alerts").style = "display:block"
|
||||||
|
document.getElementById("alerts_bar").style = "display:block"
|
||||||
|
document.getElementById("output").style = "margin-top:95px" // Adjust margin of train table div.
|
||||||
|
}
|
||||||
|
|
||||||
|
async function inflateAlerts() {
|
||||||
|
document.getElementById("alerts_msg").style = "display:block;";
|
||||||
|
document.getElementById("alert_expand_arrow").style = "transform: rotate(180deg);";
|
||||||
|
document.getElementById("alert_expand_arrow").setAttribute("onclick", "deflateAlerts()")
|
||||||
|
}
|
||||||
|
|
||||||
|
async function deflateAlerts() {
|
||||||
|
document.getElementById("alerts_msg").style = "display.none;";
|
||||||
|
document.getElementById("alert_expand_arrow").style = "transform: rotate(0deg);";
|
||||||
|
document.getElementById("alert_expand_arrow").setAttribute("onclick", "inflateAlerts()")
|
||||||
|
}
|
|
@ -61,7 +61,7 @@ async function buildPage(data) {
|
||||||
setHeaders(stationName, generateTime);
|
setHeaders(stationName, generateTime);
|
||||||
// Check for notices and if true pass to function
|
// Check for notices and if true pass to function
|
||||||
if (data.GetStationBoardResult.nrccMessages) {
|
if (data.GetStationBoardResult.nrccMessages) {
|
||||||
displayNotices(data.GetStationBoardResult.nrccMessages.message)
|
displayAlerts(data.GetStationBoardResult.nrccMessages.message);
|
||||||
}
|
}
|
||||||
if (typeof data.GetStationBoardResult.trainServices == 'undefined') {
|
if (typeof data.GetStationBoardResult.trainServices == 'undefined') {
|
||||||
displayNoTrains()
|
displayNoTrains()
|
||||||
|
@ -73,14 +73,6 @@ async function buildPage(data) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function displayNotices(notices) {
|
|
||||||
// Input: data.GetStationBoardResult.nrccMessages.messages
|
|
||||||
// Processing: For each message, create a <p> inside #notices.
|
|
||||||
// If there is more than one notice, scroll between them.
|
|
||||||
// Output: Only to DOM.
|
|
||||||
//document.getElementById("notices").innerHTML = notices;
|
|
||||||
}
|
|
||||||
|
|
||||||
async function displayNoTrains() {
|
async function displayNoTrains() {
|
||||||
document.getElementById('no_services').style = "display: block;";
|
document.getElementById('no_services').style = "display: block;";
|
||||||
clearLoading();
|
clearLoading();
|
||||||
|
|
|
@ -1,3 +1,8 @@
|
||||||
|
/* Hide when loading */
|
||||||
|
.hide-when-loading {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
/* Main Notices: */
|
/* Main Notices: */
|
||||||
.main-notice {
|
.main-notice {
|
||||||
display: none;
|
display: none;
|
||||||
|
@ -64,36 +69,76 @@
|
||||||
margin: 3px;
|
margin: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#footer {
|
/* NRCC Notices */
|
||||||
|
#alerts{
|
||||||
|
display: none;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
width: 100%;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#alerts_bar{
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
margin-top:50px;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
background-color: var(--overlay-color);
|
background-color: darkorange;
|
||||||
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
#footer img {
|
#alert_icon{
|
||||||
height: 35px;
|
position: absolute;
|
||||||
|
left: 10px;
|
||||||
|
margin-top: 5px;
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.hide-when-loading {
|
#alert_bar_note {
|
||||||
display: none;
|
position: relative;
|
||||||
}
|
text-align: center;
|
||||||
|
|
||||||
/* NRCC Notices */
|
|
||||||
#nrcc_notices {
|
|
||||||
margin-top: 60px;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
#nrcc_notices p {
|
|
||||||
width: 95%;
|
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
margin-top: 8px;
|
||||||
|
font-weight: 900;
|
||||||
|
}
|
||||||
|
|
||||||
|
#alert_expand_arrow {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
padding: 10px;
|
||||||
|
padding-right: 15px;
|
||||||
|
padding-left: 15px;
|
||||||
|
background: none;
|
||||||
|
border: none;
|
||||||
|
font-weight: 900;
|
||||||
|
color: white;
|
||||||
|
transition: transform 0.25s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
#alerts_msg{
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 40px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: orange;
|
||||||
|
}
|
||||||
|
|
||||||
|
#alerts_msg p {
|
||||||
|
width: 90%;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
font-weight: 900;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Content */
|
/* Content */
|
||||||
#output {
|
#output {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
margin-top: 65px;
|
||||||
}
|
}
|
||||||
|
|
||||||
table {
|
table {
|
||||||
|
@ -137,6 +182,20 @@ table {
|
||||||
animation: pulse 1.5s linear infinite;
|
animation: pulse 1.5s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Footer: */
|
||||||
|
#footer {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
background-color: var(--overlay-color);
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer img {
|
||||||
|
height: 35px;
|
||||||
|
}
|
||||||
|
|
||||||
/* Animations */
|
/* Animations */
|
||||||
@keyframes pulse {
|
@keyframes pulse {
|
||||||
50% {
|
50% {
|
||||||
|
|
|
@ -82,6 +82,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
/* MAIN */
|
/* MAIN */
|
||||||
|
html{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
body {
|
body {
|
||||||
background-color: var(--main-bg-color);
|
background-color: var(--main-bg-color);
|
||||||
color: var(--main-text-color);
|
color: var(--main-text-color);
|
||||||
|
|
Reference in New Issue