Frontend: Reorganise code between simple-board and lib.board

Signed-off-by: Fred Boniface <fred@fjla.uk>
This commit is contained in:
Fred Boniface 2023-01-24 19:41:22 +00:00
parent ceba276ac0
commit 62dcc5cd02
5 changed files with 441 additions and 452 deletions

View File

@ -13,8 +13,8 @@
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
<link rel="manifest" type="application/json" href="./manifest.json"/>
<script src="./js/lib.main.js" defer></script>
<script src="./js/boards.js" defer></script>
<script src="./js/public-board.js" defer></script>
<script src="./js/lib.board.js" defer></script>
<script src="./js/simple-board.js" defer></script>
</head>
<body>
<div id="loading">

View File

@ -1,210 +0,0 @@
// Set page headers
async function setHeaders(title,time) {
var prefix = `OwlBoard - `
document.title = `${prefix}${title}`
document.getElementById("stn_name").textContent = title
document.getElementById("fetch_time").textContent = time.toLocaleTimeString()
}
// Determine what should display in 'platform' column
async function parsePlatform(svc){
if (svc.platform != undefined) {
var platform = svc.platform;
} else {
var platform = "-";
}
if (svc.platformChanged) { // Not present in public API, ready for staff version.
var changed = "changed";
} else {
var changed = "";
}
return {num: platform, change: changed}
}
// Use different time strings to default to make better on small screens
async function parseTime(string){
switch (string) {
case "Delayed":
var output = "LATE";
var change = "changed";
break;
case "Cancelled":
var output = "CANC";
var change = "cancelled";
break;
case "On time":
var output = "RT";
var change = "";
break;
case "":
var output = "-";
var change = "";
break;
case undefined:
var output = "-";
var change = "";
break;
case "No report":
var output = "-";
var change = "";
break;
default:
var output = string;
var change = "changed";
}
return {data: output, changed: change};
}
// Convert multiple Origin/Destinations to single string
async function parseName(location) {
if (Array.isArray(location)) {
var name = `${location[0]['locationName']} & ${location[1]['locationName']}`
return name;
}
else {
return location.locationName;
}
}
// Build calling list: -- This is a string if only one callingPoint is present, needs adapting to work with that
async function buildCallLists(data) {
try {
if (data.previousCallingPoints.callingPointList.callingPoint) {
var preCallPoint = data.previousCallingPoints.callingPointList.callingPoint;
}
} catch (err) {
console.log(`Data not found error, ${err}`)
}
try {
if (data.subsequentCallingPoints.callingPointList.callingPoint) {
var postCallPoint = data.subsequentCallingPoints.callingPointList.callingPoint;
}
} catch (err) {
console.log(`Data not found error, ${err}`)
}
var procPre = "";
var procPost = "";
try {
if (preCallPoint) {
for(var i = 0; i < preCallPoint.length; i++) {
var proc = await buildPastCalls(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
async function displayAlerts(array) {
var counter = 0
var messages = ""
for(var i = 0; i < array.length; i++) {
// Increment counter
counter += 1;
// Reset Vars
messages += `<p>${array[i]}</p>`;
}
document.getElementById("alerts_msg").insertAdjacentHTML("beforeend", messages);
if (counter == 1) {
document.getElementById("alert_bar_note").textContent = `There is ${counter} active alert`
} else if (counter > 1) {
document.getElementById("alert_bar_note").textContent = `There are ${counter} active alerts`
}
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("alerts_bar").setAttribute("onclick", "deflateAlerts()")
}
async function deflateAlerts() {
document.getElementById("alerts_msg").style = "display.none;";
document.getElementById("alert_expand_arrow").style = "transform: rotate(0deg);";
document.getElementById("alerts_bar").setAttribute("onclick", "inflateAlerts()")
}
/*
Compress buildCalls() and buildPastCalls() into a single function
that can selectively work with either data.et or data.at.
async function buildCalls(data) {
if (typeof data.et != "undefined") {
var time = await parseTime(data.et)
} else if (typeof data.at != "undefined") {
var time = await parseTime(data.at)
}
return `<tr>
<td class="detail-name detail-table-content">${data.locationName}</td>
<td class="detail-table-content">${data.st}</td>
<td class="detail-table-content ${time.changed}">${time.data}</td>
</tr>`
}
*/
async function buildCalls(data) {
var timeEt = await parseTime(data.et)
return `<tr>
<td class="detail-name detail-table-content">${data.locationName}</td>
<td class="detail-table-content">${data.st}</td>
<td class="detail-table-content ${timeEt.changed}">${timeEt.data}</td>
</tr>`
}
async function buildPastCalls(data) {
var timeEt = await parseTime(data.at)
return `<tr>
<td class="detail-name detail-table-content">${data.locationName}</td>
<td class="detail-table-content">${data.st}</td>
<td class="detail-table-content ${timeEt.changed}">${timeEt.data}</td>
</tr>`
}

View File

@ -0,0 +1,207 @@
/* Fetch Functions */
async function publicLdb(stn) {
var url = `${window.location.origin}/api/v1/ldb/${stn}`;
var resp = await fetch(url);
return await resp.json();
}
/* Set page heading */
async function setHeaders(title,time) {
var prefix = `OwlBoard - `
document.title = `${prefix}${title}`
document.getElementById("stn_name").textContent = title
document.getElementById("fetch_time").textContent = time.toLocaleTimeString()
}
/* Display No Trains Message */
async function displayNoTrains() {
document.getElementById('no_services').style = "display: block;";
clearLoading();
}
/* Parse the value of `platform` to account for unknown platforms */
async function parsePlatform(svc){
if (svc.platform != undefined) {
var platform = svc.platform;
} else {
var platform = "-";
}
if (svc.platformChanged) { // Not present in public API, ready for staff version.
var changed = "changed";
} else {
var changed = "";
}
return {num: platform, change: changed}
}
/* Change value of time strings to fit well on small screens */
async function parseTime(string){
switch (string) {
case "Delayed":
var output = "LATE";
var change = "changed";
break;
case "Cancelled":
var output = "CANC";
var change = "cancelled";
break;
case "On time":
var output = "RT";
var change = "";
break;
case "":
var output = "-";
var change = "";
break;
case undefined:
var output = "-";
var change = "";
break;
case "No report":
var output = "-";
var change = "";
break;
default:
var output = string;
var change = "changed";
}
return {data: output, changed: change};
}
/* Convert multiple Origin/Destinations to single string */
async function parseName(location) {
if (Array.isArray(location)) {
var name = `${location[0]['locationName']} & ${location[1]['locationName']}`
return name;
}
else {
return location.locationName;
}
}
// 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
async function displayAlerts(array) {
var counter = 0
var messages = ""
for(var i = 0; i < array.length; i++) {
// Increment counter
counter += 1;
// Reset Vars
messages += `<p>${array[i]}</p>`;
}
document.getElementById("alerts_msg").insertAdjacentHTML("beforeend", messages);
if (counter == 1) {
document.getElementById("alert_bar_note").textContent = `There is ${counter} active alert`
} else if (counter > 1) {
document.getElementById("alert_bar_note").textContent = `There are ${counter} active alerts`
}
document.getElementById("alerts").style = "display:block"
document.getElementById("alerts_bar").style = "display:block"
document.getElementById("output").style = "margin-top:95px" /* The margin for the train table needs to be adjusted if the alert box exists. */
}
/* Show/Hide alerts box */
async function inflateAlerts() {
document.getElementById("alerts_msg").style = "display:block;";
document.getElementById("alert_expand_arrow").style = "transform: rotate(180deg);";
document.getElementById("alerts_bar").setAttribute("onclick", "deflateAlerts()")
}
async function deflateAlerts() {
document.getElementById("alerts_msg").style = "display.none;";
document.getElementById("alert_expand_arrow").style = "transform: rotate(0deg);";
document.getElementById("alerts_bar").setAttribute("onclick", "inflateAlerts()")
}
/* Builds the train data information in to a table row */
async function buildCalls(data) {
if (typeof data.et != "undefined") {
var time = await parseTime(data.et)
} else if (typeof data.at != "undefined") {
var time = await parseTime(data.at)
}
return `<tr>
<td class="detail-name detail-table-content">${data.locationName}</td>
<td class="detail-table-content">${data.st}</td>
<td class="detail-table-content ${time.changed}">${time.data}</td>
</tr>`
}

View File

@ -1,240 +0,0 @@
/* Page Init: */
init()
/* Supporting Functions */
async function init() {
setLoadingDesc(`Loading\nservices`)
var stn = await getQuery("stn");
setLoadingDesc(`Loading\n${stn.toUpperCase()}`)
log(`init: Looking up: ${stn}`);
var sv = await getQuery("sv");
log(`init: Staff Version: ${sv}`);
if (sv === 'true') {
log("init: Staff Version not supported yet.")
log("init: Unable to proceed.")
} else {
try {
var data = await publicLdb(stn)
setLoadingDesc(`${stn.toUpperCase()}\nParsing Data`)
log("init: Fetched LDB Data")
parseLdb(data)
} catch (err) {
var data = null
setLoadingDesc(`Handling\nError`)
log("init: Unable to fetch LDB data")
}
}
}
async function publicLdb(stn) {
var url = `${window.location.origin}/api/v1/ldb/${stn}`;
var resp = await fetch(url);
return await resp.json();
}
async function parseLdb(data) {
if (data.ERROR == "NOT_FOUND") { // Station not found
clearLoading();
document.getElementById("error_notice").style = "display: block;";
document.getElementById("err_not_found").style = "display: block;";
setHeaders("Not Found",new Date())
} else if (data == false) { // No data for station
clearLoading();
document.getElementById("error_notice").style = "display: block;";
document.getElementById("err_no_data").style = "display:block;";
setHeaders("No Data",new Date())
} else if (data == "err") { // Connection Error
clearLoading();
document.getElementById("error_notice").style = "display: block;";
document.getElementById("err_conn").style = "display: block;";
setHeaders("Connection Error",new Date())
await delay(5000);
log(`parseLdb: Waited five seconds, reloading`)
location.reload()
} else {
buildPage(data);
}
}
// Build and Display Functions
async function buildPage(data) {
setLoadingDesc('Loading\nTrains')
var stationName = data.GetStationBoardResult.locationName;
log(`buildPage: Data ready for ${stationName}`);
var generateTime = new Date(await data.GetStationBoardResult.generatedAt);
log(`buildPage: Data prepared at ${generateTime.toLocaleString()}`)
setHeaders(stationName, generateTime);
// Check for notices and if true pass to function
if (data.GetStationBoardResult.nrccMessages) {
setLoadingDesc('Loading\nAlerts')
displayAlerts(data.GetStationBoardResult.nrccMessages.message);
}
if (typeof data.GetStationBoardResult.trainServices == 'undefined') {
displayNoTrains()
} else {
displayTrains(data)
}
if (data.GetStationBoardResult.ferryServices) {
setLoadingDesc('Loading\nFerries')
displayFerry(data.GetStationBoardResult.ferryServices)
}
if (data.GetStationBoardResult.busServices) {
setLoadingDesc('Loading\nBusses')
displayBus(data.GetStationBoardResult.busServices)
}
}
async function displayNoTrains() {
document.getElementById('no_services').style = "display: block;";
clearLoading();
}
async function displayTrains(data) {
log(`Inserting data in DOM`)
for(var i = 0; i < data.GetStationBoardResult.trainServices.service.length; i++) {
// Reset Vars
var svc = data.GetStationBoardResult.trainServices.service[i];
displayService(svc);
buildCallLists(svc);
}
clearLoading();
document.getElementById("output").style = "display:block;";
log(`Insertion complete`)
}
async function displayFerry(ferrySvc) {
log(JSON.stringify(ferrySvc))
for(var i = 0; i < ferrySvc.service.length; i++) {
displayFerryService(ferrySvc.service[i])
}
}
async function displayBus(busSvc) {
log(JSON.stringify(busSvc))
for(var i = 0; i < busSvc.service.length; i++) {
displayBusService(busSvc.service[i])
buildCallLists(busSvc.service[i])
}
}
async function displayService(svc) {
var table = document.getElementById("output");
// Determine Time Message
var sta = await parseTime(svc.sta);
var eta = await parseTime(svc.eta);
var std = await parseTime(svc.std);
var etd = await parseTime(svc.etd);
// Determine Platform Message
//if (svc.platform != undefined){var plt = svc.platform} else {var plt = "-"};
var plt = await parsePlatform(svc);
// Define Table Row
var row = `
<table>
<tr>
<td class="name name-item" onclick="showCalls('${svc.serviceID}')">${await parseName(svc.origin.location)}</td>
<td class="name name-item" onclick="showCalls('${svc.serviceID}')">${await parseName(svc.destination.location)}</td>
<td class="plat ${plt.changed}">${plt.num}</td>
<td class="time">${sta.data}</td>
<td class="time ${eta.changed}">${eta.data}</td>
<td class="time">${std.data}</td>
<td class="time ${etd.changed}">${etd.data}</td>
</tr>
</table>`
// Put Table Row
table.insertAdjacentHTML("beforeend", row)
// Display Operator
if (svc.operator) {
var opRow = `<p class="msg op">A ${svc.operator} service</p>`
table.insertAdjacentHTML("beforeend", opRow);
}
// Parse cancelReason & delayReason
if (svc.cancelReason) {
var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
table.insertAdjacentHTML("beforeend", cancelRow);
}
if (svc.delayReason) {
var delayRow = `<p class="msg">${svc.delayReason}</p>`
table.insertAdjacentHTML("beforeend", delayRow);
}
}
async function displayFerryService(svc) {
var table = document.getElementById("ferry");
log(JSON.stringify(svc))
// Determine Time Message
var sta = await parseTime(svc.sta);
var eta = await parseTime(svc.eta);
var std = await parseTime(svc.std);
var etd = await parseTime(svc.etd);
// Determine Platform Message
var plt = "";
// Define Table Row
var row = `
<table>
<tr>
<td class="name name-item">${await parseName(svc.origin.location)}</td>
<td class="name name-item">${await parseName(svc.destination.location)}</td>
<td class="plat}">${plt}</td>
<td class="time">${sta.data}</td>
<td class="time ${eta.changed}">${eta.data}</td>
<td class="time">${std.data}</td>
<td class="time ${etd.changed}">${etd.data}</td>
</tr>
</table>`
// Put Table Row
table.insertAdjacentHTML("beforeend", row)
// Parse cancelReason & delayReason
if (svc.cancelReason) {
var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
table.insertAdjacentHTML("beforeend", cancelRow);
}
if (svc.delayReason) {
var delayRow = `<p class="msg">${svc.delayReason}</p>`
table.insertAdjacentHTML("beforeend", delayRow);
}
document.getElementById("ferry").style = "display:block"
}
async function displayBusService(svc) {
var table = document.getElementById("bus");
log(JSON.stringify(svc))
// Determine Time Message
var sta = await parseTime(svc.sta);
var eta = await parseTime(svc.eta);
var std = await parseTime(svc.std);
var etd = await parseTime(svc.etd);
// Determine Platform Message
var plt = "";
// Define Table Row
var row = `
<table>
<tr>
<td class="name name-item" onclick="showCalls('${svc.serviceID}')">${svc.origin.location.locationName}</td>
<td class="name name-item" onclick="showCalls('${svc.serviceID}')">${svc.destination.location.locationName}</td>
<td class="plat}">${plt}</td>
<td class="time">${sta.data}</td>
<td class="time ${eta.changed}">${eta.data}</td>
<td class="time">${std.data}</td>
<td class="time ${etd.changed}">${etd.data}</td>
</tr>
</table>`
// Put Table Row
table.insertAdjacentHTML("beforeend", row)
// Display operator
if (svc.operator) {
var opRow = `<p class="msg op">A ${svc.operator} service</p>`
table.insertAdjacentHTML("beforeend", opRow);
}
// Parse cancelReason & delayReason
if (svc.cancelReason) {
var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
table.insertAdjacentHTML("beforeend", cancelRow);
}
if (svc.delayReason) {
var delayRow = `<p class="msg">${svc.delayReason}</p>`
table.insertAdjacentHTML("beforeend", delayRow);
}
document.getElementById("bus").style = "display:block"
}

View File

@ -0,0 +1,232 @@
/* Page Init: */
init()
/* Init function */
async function init() {
setLoadingDesc(`Loading\nservices`)
var stn = await getQuery("stn");
setLoadingDesc(`Loading\n${stn.toUpperCase()}`)
log(`init: Looking up: ${stn}`);
var sv = await getQuery("sv");
log(`init: Staff Version: ${sv}`);
if (sv === 'true') {
log("init: Staff Version not supported yet.")
log("init: Unable to proceed.")
} else {
try {
var data = await publicLdb(stn)
setLoadingDesc(`${stn.toUpperCase()}\nParsing Data`)
log("init: Fetched LDB Data")
parseLdb(data)
} catch (err) {
var data = null
setLoadingDesc(`Handling\nError`)
log("init: Unable to fetch LDB data")
}
}
}
/* Check for any errors in data returned from the Fetch call
If no errors, if there are none, call buildPage(). */
async function parseLdb(data) {
if (data.ERROR == "NOT_FOUND") { // Station not found
clearLoading();
document.getElementById("error_notice").style = "display: block;";
document.getElementById("err_not_found").style = "display: block;";
setHeaders("Not Found",new Date())
} else if (data == false) { // No data for station
clearLoading();
document.getElementById("error_notice").style = "display: block;";
document.getElementById("err_no_data").style = "display:block;";
setHeaders("No Data",new Date())
} else if (data == "err") { // Connection Error
clearLoading();
document.getElementById("error_notice").style = "display: block;";
document.getElementById("err_conn").style = "display: block;";
setHeaders("Connection Error",new Date())
await delay(5000);
log(`parseLdb: Waited five seconds, reloading`)
location.reload()
} else {
buildPage(data);
}
}
// Build and Display Functions
async function buildPage(data) {
setLoadingDesc('Loading\nTrains')
var stationName = data.GetStationBoardResult.locationName;
log(`buildPage: Data ready for ${stationName}`);
var generateTime = new Date(await data.GetStationBoardResult.generatedAt);
log(`buildPage: Data prepared at ${generateTime.toLocaleString()}`)
setHeaders(stationName, generateTime);
// Check for notices and if true pass to function
if (data.GetStationBoardResult.nrccMessages) {
setLoadingDesc('Loading\nAlerts')
displayAlerts(data.GetStationBoardResult.nrccMessages.message);
}
if (typeof data.GetStationBoardResult.trainServices == 'undefined') {
displayNoTrains()
} else {
displayTrains(data)
}
if (data.GetStationBoardResult.ferryServices) {
setLoadingDesc('Loading\nFerries')
displayFerry(data.GetStationBoardResult.ferryServices)
}
if (data.GetStationBoardResult.busServices) {
setLoadingDesc('Loading\nBusses')
displayBus(data.GetStationBoardResult.busServices)
}
}
async function displayTrains(data) {
log(`Inserting data in DOM`)
for(var i = 0; i < data.GetStationBoardResult.trainServices.service.length; i++) {
// Reset Vars
var svc = data.GetStationBoardResult.trainServices.service[i];
displayService(svc);
buildCallLists(svc);
}
clearLoading();
document.getElementById("output").style = "display:block;";
log(`Insertion complete`)
}
async function displayFerry(ferrySvc) {
log(JSON.stringify(ferrySvc))
for(var i = 0; i < ferrySvc.service.length; i++) {
displayFerryService(ferrySvc.service[i])
}
}
async function displayBus(busSvc) {
log(JSON.stringify(busSvc))
for(var i = 0; i < busSvc.service.length; i++) {
displayBusService(busSvc.service[i])
buildCallLists(busSvc.service[i])
}
}
async function displayService(svc) {
var table = document.getElementById("output");
// Determine Time Message
var sta = await parseTime(svc.sta);
var eta = await parseTime(svc.eta);
var std = await parseTime(svc.std);
var etd = await parseTime(svc.etd);
// Determine Platform Message
//if (svc.platform != undefined){var plt = svc.platform} else {var plt = "-"};
var plt = await parsePlatform(svc);
// Define Table Row
var row = `
<table>
<tr>
<td class="name name-item" onclick="showCalls('${svc.serviceID}')">${await parseName(svc.origin.location)}</td>
<td class="name name-item" onclick="showCalls('${svc.serviceID}')">${await parseName(svc.destination.location)}</td>
<td class="plat ${plt.changed}">${plt.num}</td>
<td class="time">${sta.data}</td>
<td class="time ${eta.changed}">${eta.data}</td>
<td class="time">${std.data}</td>
<td class="time ${etd.changed}">${etd.data}</td>
</tr>
</table>`
// Put Table Row
table.insertAdjacentHTML("beforeend", row)
// Display Operator
if (svc.operator) {
var opRow = `<p class="msg op">A ${svc.operator} service</p>`
table.insertAdjacentHTML("beforeend", opRow);
}
// Parse cancelReason & delayReason
if (svc.cancelReason) {
var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
table.insertAdjacentHTML("beforeend", cancelRow);
}
if (svc.delayReason) {
var delayRow = `<p class="msg">${svc.delayReason}</p>`
table.insertAdjacentHTML("beforeend", delayRow);
}
}
async function displayFerryService(svc) {
var table = document.getElementById("ferry");
log(JSON.stringify(svc))
// Determine Time Message
var sta = await parseTime(svc.sta);
var eta = await parseTime(svc.eta);
var std = await parseTime(svc.std);
var etd = await parseTime(svc.etd);
// Determine Platform Message
var plt = "";
// Define Table Row
var row = `
<table>
<tr>
<td class="name name-item">${await parseName(svc.origin.location)}</td>
<td class="name name-item">${await parseName(svc.destination.location)}</td>
<td class="plat}">${plt}</td>
<td class="time">${sta.data}</td>
<td class="time ${eta.changed}">${eta.data}</td>
<td class="time">${std.data}</td>
<td class="time ${etd.changed}">${etd.data}</td>
</tr>
</table>`
// Put Table Row
table.insertAdjacentHTML("beforeend", row)
// Parse cancelReason & delayReason
if (svc.cancelReason) {
var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
table.insertAdjacentHTML("beforeend", cancelRow);
}
if (svc.delayReason) {
var delayRow = `<p class="msg">${svc.delayReason}</p>`
table.insertAdjacentHTML("beforeend", delayRow);
}
document.getElementById("ferry").style = "display:block"
}
async function displayBusService(svc) {
var table = document.getElementById("bus");
log(JSON.stringify(svc))
// Determine Time Message
var sta = await parseTime(svc.sta);
var eta = await parseTime(svc.eta);
var std = await parseTime(svc.std);
var etd = await parseTime(svc.etd);
// Determine Platform Message
var plt = "";
// Define Table Row
var row = `
<table>
<tr>
<td class="name name-item" onclick="showCalls('${svc.serviceID}')">${svc.origin.location.locationName}</td>
<td class="name name-item" onclick="showCalls('${svc.serviceID}')">${svc.destination.location.locationName}</td>
<td class="plat}">${plt}</td>
<td class="time">${sta.data}</td>
<td class="time ${eta.changed}">${eta.data}</td>
<td class="time">${std.data}</td>
<td class="time ${etd.changed}">${etd.data}</td>
</tr>
</table>`
// Put Table Row
table.insertAdjacentHTML("beforeend", row)
// Display operator
if (svc.operator) {
var opRow = `<p class="msg op">A ${svc.operator} service</p>`
table.insertAdjacentHTML("beforeend", opRow);
}
// Parse cancelReason & delayReason
if (svc.cancelReason) {
var cancelRow = `<p class="msg">${svc.cancelReason}</p>`
table.insertAdjacentHTML("beforeend", cancelRow);
}
if (svc.delayReason) {
var delayRow = `<p class="msg">${svc.delayReason}</p>`
table.insertAdjacentHTML("beforeend", delayRow);
}
document.getElementById("bus").style = "display:block"
}