Frontend:Partial refactor of lib.board & simple-board.

Signed-off-by: Fred Boniface <fred@fjla.uk>
This commit is contained in:
Fred Boniface 2023-01-24 21:24:53 +00:00
parent 62dcc5cd02
commit f9b1dd5861
3 changed files with 114 additions and 78 deletions

View File

@ -1,3 +1,5 @@
const e = require("express");
/* Fetch Functions */ /* Fetch Functions */
async function publicLdb(stn) { async function publicLdb(stn) {
var url = `${window.location.origin}/api/v1/ldb/${stn}`; var url = `${window.location.origin}/api/v1/ldb/${stn}`;
@ -11,6 +13,7 @@ async function setHeaders(title,time) {
document.title = `${prefix}${title}` document.title = `${prefix}${title}`
document.getElementById("stn_name").textContent = title document.getElementById("stn_name").textContent = title
document.getElementById("fetch_time").textContent = time.toLocaleTimeString() document.getElementById("fetch_time").textContent = time.toLocaleTimeString()
sessionStorage.setItem("board_location", title);
} }
/* Display No Trains Message */ /* Display No Trains Message */
@ -62,6 +65,10 @@ async function parseTime(string){
var output = "-"; var output = "-";
var change = ""; var change = "";
break; break;
case "undefined":
var output = false;
var change = "";
break;
default: default:
var output = string; var output = string;
var change = "changed"; var change = "changed";
@ -80,81 +87,6 @@ async function parseName(location) {
} }
} }
// Build calling list: -- This is a string if only one callingPoint is present, needs adapting to work with that
async function buildCallLists(data) {
try { /* Check if previous calling points exist */
if (data.previousCallingPoints.callingPointList.callingPoint) {
var preCallPoint = data.previousCallingPoints.callingPointList.callingPoint;
}
} catch (err) { /* Log if ERR */
log(`Error reading previous calling points: ${err}`, "INFO")
}
try { /* Check if subsequent calling points exist */
if (data.subsequentCallingPoints.callingPointList.callingPoint) {
var postCallPoint = data.subsequentCallingPoints.callingPointList.callingPoint;
}
} catch (err) { /* Log if ERR */
log(`Error reading future calling points: ${err}`, "INFO")
}
var procPre = "";
var procPost = "";
try {
if (preCallPoint) {
for(var i = 0; i < preCallPoint.length; i++) {
var proc = await buildCalls(preCallPoint[i]);
procPre = `${procPre}\n${proc}`
}
}
} catch (err) {
console.log(`Error reading previous stops. ${err}`)
}
try {
if (postCallPoint) {
for (var i = 0; i < postCallPoint.length; i++) {
var proc = await buildCalls(postCallPoint[i]);
procPost = `${procPost}\n${proc}`
}
}
} catch (err) {
console.log(`Error reading next stops. ${err}`)
}
var div = `
<div class="call-data" id="${data.serviceID}">
<p class="close-data" onclick="hideCalls('${data.serviceID}')">X</p>
<table class="calling-at">
<caption>Calling at:</caption>
<tr>
<th class="detail-name-head">Location</th>
<th class="time">Schedule</th>
<th class="time">Exp.</th>
</tr>
${procPost}
</table>
<table class="called-at">
<caption>Previous stops:</caption>
<tr>
<th class="detail-name-head">Location</th>
<th class="time">Schedule</th>
<th class="time">Actual</th>
</tr>
${procPre}
</table>
</div>`
document.body.insertAdjacentHTML("beforeend", div)
return;
}
// Display calling list: - The calling list should be built on demand.
async function showCalls(id) {
document.getElementById(id).style = "display: block;";
return;
}
async function hideCalls(id) {
document.getElementById(id).style = "display: none;";
return;
}
// Display Alert Messages // Display Alert Messages
async function displayAlerts(array) { async function displayAlerts(array) {
var counter = 0 var counter = 0
@ -191,9 +123,103 @@ async function deflateAlerts() {
document.getElementById("alerts_bar").setAttribute("onclick", "inflateAlerts()") document.getElementById("alerts_bar").setAttribute("onclick", "inflateAlerts()")
} }
/*//// SERVICE DETAIL LISTS ////*/
// Build calling list: -- This outputs calling point data to sessionStorage in the format: key{pre: [{PREVIOUS_Stops}], post: [{POST_STOPS}]}
async function buildCallLists(svc) {
var sSvcId = svc.serviceID;
var oSvcData = {
plat: svc.platform,
sta: svc.sta,
eta: svc.eta,
std: svc.std,
etd: svc.etd
};
try {
if (typeof svc.previousCallingPoints.callingPointList.callingPoint != 'undefined') {
let array = await makeArray(svc.previousCallingPoints.callingPointList.callingPoint);
oSvcData.pre = array;
}
} catch (err) { /* Log if ERR */
log(`Error reading previous calling points: ${err}`, "INFO")
}
try {
if (typeof svc.subsequentCallingPoints.callingPointList.callingPoint != 'undefined') {
let array = await makeArray(svc.subsequentCallingPoints.callingPointList.callingPoint);
oSvcData.post = array;
}
} catch (err) { /* Log if ERR */
log(`Error reading future calling points: ${err}`, "INFO")
}
sessionStorage.setItem(sSvcId, JSON.stringify(oSvcData))
}
/* Display calling list: - Read data from sessionStorage and write to DOM. */
async function showCalls(id) {
log(`Showing details for service ${id}`, "INFO")
var svcDetail = await JSON.parse(sessionStorage.getItem(id));
var pre = "";
var post = "";
if (typeof svcDetail.pre != 'undefined') {
for(var preCall = 0; preCall < svcDetail.pre.length; preCall++) {
pre += await singleCall(svcDetail.pre[preCall]);
}
}
if (typeof svcDetail.post != 'undefined') {
for(var postCall = 0; postCall < svcDetail.post.length; postCall++) {
post += await singleCall(svcDetail.post[postCall]);
}
}
/* Run retreived data through parsers */
var thisStd = await parseTime(svcDetail.std);
var thisEtd = await parseTime(svcDetail.etd);
var thisSta = await parseTime(svcDetail.sta);
var thisEta = await parseTime(svcDetail.eta);
var thisPlat = await parsePlatform(svcDetail.plat);
/* Prepare data for this station */
if (thisStd.data != "undefined") {
var sTime = thisStd.data
var eTime = thisEtd.data
var change = thisEtd.changed
} else {
var sTime = thisSta.data
var eTime = thisEta.data
var change = thisEta.changed
};
let here = `<tr>
<td class="detail-name detail-table-content">${sessionStorage.getItem("board_location")}</td>
<td class="detail-table-content">${sTime}</td>
<td class="detail-table-content ${change}">${eTime}</td>
</tr> `
/* Prepare then insert DOM Data */
let dom = ` <div id="${id}" class="call-data">
<p class="close-data" onclick="hideCalls('${id}')">X</p>
<table class="called-at">
<tr>
<th class="detail-name-head">Location</th>
<th class="time">Schedule</th>
<th class="time">Act/Est</th>
</tr>
${pre}
${here}
${post}
</table>
</div>`
document.body.insertAdjacentHTML("beforeend", dom);
document.getElementById(id).style = "display: block;";
return;
}
async function hideCalls(id) {
let element = document.getElementById(id)
element.style = "display: none;";
element.remove();
return;
}
/* Builds the train data information in to a table row */ /* Builds the train data information in to a table row */
async function buildCalls(data) { async function singleCall(data) {
if (typeof data.et != "undefined") { if (typeof data.et != "undefined") {
var time = await parseTime(data.et) var time = await parseTime(data.et)
} else if (typeof data.at != "undefined") { } else if (typeof data.at != "undefined") {

View File

@ -16,6 +16,16 @@ async function storageAvailable(type) { // Currently not used
} }
} }
/* Array Converter
Converts a string to a single item array */
async function makeArray(data) {
if (typeof data == "string") {
var array = [];
array.push(data);
return array;
}
return data;
}
/* Timeouts */ /* Timeouts */
/* Usage: '' */ /* Usage: '' */

View File

@ -208,7 +208,7 @@ caption{
top: 50px; top: 50px;
left: 0; left: 0;
margin: 2%; margin: 2%;
padding-top: 4px; padding-top: 30px;
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
padding-bottom: 10px; padding-bottom: 10px;
@ -219,7 +219,7 @@ caption{
.close-data { .close-data {
position: absolute; position: absolute;
right: 15px; right: 19px;
top: -8px; top: -8px;
font-weight: 900; font-weight: 900;
} }