Compare commits
6 Commits
3e66cdad8d
...
5a8f3f0d85
Author | SHA1 | Date |
---|---|---|
Fred Boniface | 5a8f3f0d85 | |
Fred Boniface | 5e9f9e13bc | |
Fred Boniface | 018ddf8c47 | |
Fred Boniface | 7ea8f153cd | |
Fred Boniface | 0958bc92f5 | |
Fred Boniface | 67cc929158 |
14
UpNext.md
14
UpNext.md
|
@ -13,19 +13,11 @@
|
|||
- Also include other details from the API such as:
|
||||
- Platform number
|
||||
- Operator
|
||||
* Frontend code refactoring:
|
||||
- Refactor into files:
|
||||
- lib.main.js
|
||||
- lib.board.js
|
||||
- simple-board.js
|
||||
- index.js
|
||||
- settings.js
|
||||
- find-code.js
|
||||
- service-worker.js
|
||||
- If only one callingPoint, a string is returned instead of an array.
|
||||
|
||||
### In Progress:
|
||||
|
||||
* Frontend code refactoring: --- Pre-Refactor /static/js folder size: 22132B
|
||||
* Frontend code refactoring: --- Pre-Refactor /static/js folder size: 22132B *Check Compressed Size Before Next Build*
|
||||
- Refactor into files:
|
||||
- lib.main.js
|
||||
- lib.board.js
|
||||
|
@ -33,7 +25,7 @@
|
|||
- index.js
|
||||
- settings.js
|
||||
- find-code.js
|
||||
- service-worker.js
|
||||
- service-worker.js *in / not /js*
|
||||
|
||||
### Completed - Testing:
|
||||
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
<link rel="stylesheet" type="text/css" href="./styles/boards.css"/>
|
||||
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
|
||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||
<script src="./js/main.js" defer></script>
|
||||
<script src="./js/lib.main.js" defer></script>
|
||||
<script src="./js/boards.js" defer></script>
|
||||
<script src="./js/public-board.js" defer></script>
|
||||
</head>
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
|
||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||
<title>OwlBoard - Code Lookup</title>
|
||||
<script src="./js/main.js" defer></script>
|
||||
<script src="./js/lib.main.js" defer></script>
|
||||
<script src="./js/find-code.js" defer></script>
|
||||
</head>
|
||||
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
<link rel="stylesheet" type="text/css" href="./styles/main.css"/>
|
||||
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
|
||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||
<!-- NO SCRIPTS LOADED - NOT REQUIRED AT PRESENT -->
|
||||
<title>OwlBoard</title>
|
||||
</head>
|
||||
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
<link rel="stylesheet" type="text/css" href="./styles/main.css"/>
|
||||
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
|
||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||
<script src="./js/main.js" defer></script>
|
||||
<script src="./js/lib.main.js" defer></script>
|
||||
<script src="./js/index.js" defer></script>
|
||||
<title>OwlBoard</title>
|
||||
</head>
|
||||
|
|
|
@ -9,6 +9,7 @@
|
|||
<link rel="stylesheet" type="text/css" href="./styles/main.css"/>
|
||||
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
|
||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||
<!-- NO SCRIPTS LOADED - NOT REQUIRED AT PRESENT -->
|
||||
<title>OwlBoard - Report</title>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
@ -1,20 +1,9 @@
|
|||
// Fetch a known query parameter from the pages URL
|
||||
async function getQuery(param) {
|
||||
var params = new URLSearchParams(window.location.search)
|
||||
var query = params.get(param)
|
||||
if (query) {
|
||||
return query
|
||||
} else {
|
||||
return 'false'
|
||||
}
|
||||
}
|
||||
|
||||
// Set page headers
|
||||
async function setHeaders(title,time) {
|
||||
var prefix = `OwlBoard - `
|
||||
document.title = `${prefix}${title}`
|
||||
document.getElementById("stn_name").innerHTML = title
|
||||
document.getElementById("fetch_time").innerHTML = time.toLocaleTimeString()
|
||||
document.getElementById("stn_name").textContent = title
|
||||
document.getElementById("fetch_time").textContent = time.toLocaleTimeString()
|
||||
}
|
||||
|
||||
// Determine what should display in 'platform' column
|
||||
|
@ -24,7 +13,7 @@ async function parsePlatform(svc){
|
|||
} else {
|
||||
var platform = "-";
|
||||
}
|
||||
if (svc.platformChanged) {
|
||||
if (svc.platformChanged) { // Not present in public API, ready for staff version.
|
||||
var changed = "changed";
|
||||
} else {
|
||||
var changed = "";
|
||||
|
@ -56,7 +45,7 @@ async function parseTime(string){
|
|||
var change = "";
|
||||
break;
|
||||
case "No report":
|
||||
var output = "?";
|
||||
var output = "-";
|
||||
var change = "";
|
||||
break;
|
||||
default:
|
||||
|
@ -66,7 +55,7 @@ async function parseTime(string){
|
|||
return {data: output, changed: change};
|
||||
}
|
||||
|
||||
// Sometimes the origin or destination names are undefined, need to catch that
|
||||
// Convert multiple Origin/Destinations to single string
|
||||
async function parseName(location) {
|
||||
if (Array.isArray(location)) {
|
||||
var name = `${location[0]['locationName']} & ${location[1]['locationName']}`
|
||||
|
@ -77,7 +66,7 @@ async function parseName(location) {
|
|||
}
|
||||
}
|
||||
|
||||
// Build calling list:
|
||||
// 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) {
|
||||
|
@ -141,7 +130,7 @@ async function buildCallLists(data) {
|
|||
return;
|
||||
}
|
||||
|
||||
// Display calling list:
|
||||
// Display calling list: - The calling list should be built on demand.
|
||||
async function showCalls(id) {
|
||||
document.getElementById(id).style = "display: block;";
|
||||
return;
|
||||
|
@ -155,18 +144,18 @@ async function hideCalls(id) {
|
|||
// 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
|
||||
var msg = array[i];
|
||||
console.log(`Alert: ${msg}`);
|
||||
document.getElementById("alerts_msg").insertAdjacentHTML("beforeend", `<p>${msg}</p>`);
|
||||
messages += `<p>${array[i]}</p>`;
|
||||
}
|
||||
document.getElementById("alerts_msg").insertAdjacentHTML("beforeend", messages);
|
||||
if (counter == 1) {
|
||||
document.getElementById("alert_bar_note").innerHTML = `There is ${counter} active alert`
|
||||
document.getElementById("alert_bar_note").textContent = `There is ${counter} active alert`
|
||||
} else if (counter > 1) {
|
||||
document.getElementById("alert_bar_note").innerHTML = `There are ${counter} active alerts`
|
||||
document.getElementById("alert_bar_note").textContent = `There are ${counter} active alerts`
|
||||
|
||||
}
|
||||
document.getElementById("alerts").style = "display:block"
|
||||
|
@ -186,6 +175,22 @@ async function deflateAlerts() {
|
|||
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>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
clearLoading();
|
||||
hideLoading();
|
||||
|
||||
async function fetchEntry(){ // This can be condensed
|
||||
showLoading();
|
||||
|
@ -15,10 +15,7 @@ async function fetchEntry(){ // This can be condensed
|
|||
tiploc: tiploc.value,
|
||||
stanox: stanox.value
|
||||
}
|
||||
|
||||
console.log(`Read values: ${JSON.stringify(values)}`)
|
||||
|
||||
parseData(values)
|
||||
parseData(values)
|
||||
}
|
||||
|
||||
async function parseData(values){
|
||||
|
@ -35,40 +32,54 @@ async function parseData(values){
|
|||
setLoadingDesc(`Searching\n${values.stanox.toUpperCase()}`)
|
||||
var data = await getData("stanox", values.stanox)
|
||||
} else if (values.name != ""){
|
||||
setLoadingDesc(`Searching\n${values.name.capitalize()}`)
|
||||
setLoadingDesc(`Searching\n${values.name}`)
|
||||
var data = await getData("name", values.name)
|
||||
} else {
|
||||
errorNoData()
|
||||
hideLoading()
|
||||
log("find-code.parseData: No data entered", "WARN")
|
||||
await clearForm();
|
||||
document.getElementById("name").value = "No data entered"
|
||||
hideLoading();
|
||||
return;
|
||||
}
|
||||
|
||||
displayData(data);
|
||||
}
|
||||
|
||||
async function getData(type, value){
|
||||
console.log(`Looking for: ${type} ${value}`)
|
||||
log(`find-code.getData: Looking for: ${type} '${value}'`, "INFO")
|
||||
try {
|
||||
var url = `${window.location.origin}/api/v1/find/${type}/${value}`;
|
||||
var resp = await fetch(url);
|
||||
console.log(`Response: ${resp.json}`)
|
||||
return await resp.json()
|
||||
} catch (err) {
|
||||
errorFetch(err)
|
||||
log(`find-code.getData: Error getting data: ${err}`, "WARN")
|
||||
return "";
|
||||
}
|
||||
}
|
||||
|
||||
async function displayData(data){
|
||||
hideLoading();
|
||||
if (data.status === "failed" || data == ""){
|
||||
errorNotFound()
|
||||
log(`find-code.displayData: Unable to find data`, "WARN")
|
||||
clearForm();
|
||||
document.getElementById("name").value = "Not Found";
|
||||
} else {
|
||||
log(`find-code.displayData: Inserting data`, "INFO")
|
||||
try {
|
||||
document.getElementById("name").value = data['0']['NLCDESC']
|
||||
} catch (err) {}
|
||||
try {
|
||||
document.getElementById("3alpha").value = data['0']['3ALPHA']
|
||||
} catch (err) {}
|
||||
try {
|
||||
document.getElementById("nlc").value = data['0']['NLC']
|
||||
} catch (err) {}
|
||||
try {
|
||||
document.getElementById("tiploc").value = data['0']['TIPLOC']
|
||||
} catch (err) {}
|
||||
try {
|
||||
document.getElementById("stanox").value = data['0']['STANOX']
|
||||
} catch (err) {}
|
||||
}
|
||||
document.getElementById("name").value = data['0']['NLCDESC']
|
||||
document.getElementById("3alpha").value = data['0']['3ALPHA']
|
||||
document.getElementById("nlc").value = data['0']['NLC']
|
||||
document.getElementById("tiploc").value = data['0']['TIPLOC']
|
||||
document.getElementById("stanox").value = data['0']['STANOX']
|
||||
// document.getElementById("stanme").value = data['0']['STANME'] // NOT PRESENT IN CORPUS
|
||||
}
|
||||
|
||||
async function clearForm(){
|
||||
|
@ -78,27 +89,4 @@ async function clearForm(){
|
|||
document.getElementById("tiploc").value = ""
|
||||
document.getElementById("stanox").value = ""
|
||||
hideLoading();
|
||||
}
|
||||
|
||||
async function showLoading(){
|
||||
document.getElementById("loading").style = "display: block;";
|
||||
}
|
||||
|
||||
async function hideLoading(){
|
||||
document.getElementById("loading").style = "display: none;";
|
||||
}
|
||||
|
||||
async function errorNoData(){
|
||||
console.log("No data entered")
|
||||
window.alert("You haven't entered any data")
|
||||
}
|
||||
|
||||
async function errorFetch(err){
|
||||
console.log("Error fetching data")
|
||||
console.log(err)
|
||||
}
|
||||
|
||||
async function errorNotFound(){
|
||||
console.log("Location not found")
|
||||
window.alert("No location was found. Check and try again.")
|
||||
}
|
|
@ -1,38 +1,21 @@
|
|||
// Init:
|
||||
setQls();
|
||||
clearLoading();
|
||||
pageInit();
|
||||
|
||||
async function sidebarOpen() {
|
||||
document.getElementById("sidebar").style.width = "50%";
|
||||
document.getElementById("sidebar_open_short").style.display = "none";
|
||||
document.getElementById("sidebar_close_short").style.display = "block";
|
||||
}
|
||||
|
||||
async function sidebarClose() {
|
||||
document.getElementById("sidebar").style.width = "0%"
|
||||
document.getElementById("sidebar_open_short").style.display = "block";
|
||||
document.getElementById("sidebar_close_short").style.display = "none";
|
||||
async function pageInit() {
|
||||
await loadQuickLinks();
|
||||
hideLoading(); // From lib.main
|
||||
}
|
||||
|
||||
async function gotoBoard(station){
|
||||
window.location.assign(`${window.location.origin}/board.html?stn=${station}`)
|
||||
window.location.assign(`${window.location.origin}/board.html?stn=${station}`);
|
||||
}
|
||||
|
||||
async function setQls(){
|
||||
var qlOpt = JSON.parse(localStorage.getItem("qlOpt"))
|
||||
var qlDef = ["bri","lwh","srd","mtp","rda","cfn","sml","shh","pri","avn","sar","svb"]
|
||||
if (qlOpt) {
|
||||
for(var i = 0; i < qlOpt.length; i++) {
|
||||
console.log(`Button: ${qlOpt[i]}`)
|
||||
var btn = `<button class="actionbutton" onclick="gotoBoard('${qlOpt[i]}')">${qlOpt[i].toUpperCase()}</button>`
|
||||
console.log(btn);
|
||||
document.getElementById("quick_links").insertAdjacentHTML("beforeend", btn) // Append btn
|
||||
}
|
||||
} else {
|
||||
for(var i = 0; i < qlDef.length; i++) {
|
||||
console.log(`Button: ${qlDef[i]}`)
|
||||
var btn = `<button class="actionbutton" onclick="gotoBoard('${qlDef[i]}')">${qlDef[i].toUpperCase()}</button>`
|
||||
document.getElementById("quick_links").insertAdjacentHTML("beforeend", btn) // Append btn
|
||||
async function loadQuickLinks(){
|
||||
var data = await getQuickLinks(); // From lib.main
|
||||
var buttons = "";
|
||||
for(var i = 0; i < data.length; i++) {
|
||||
buttons += `
|
||||
<button class="actionbutton" onclick="gotoBoard('${data[i]}')">${data[i].toUpperCase()}</button>`
|
||||
}
|
||||
}
|
||||
document.getElementById("quick_links").insertAdjacentHTML("beforeend", buttons)
|
||||
}
|
|
@ -1,20 +1,22 @@
|
|||
/* Feature Detectors */
|
||||
|
||||
/* Valid values for ${type}: localstorage, sessionstorage */
|
||||
async function storageAvailable(type) {
|
||||
async function storageAvailable(type) { // Currently not used
|
||||
try {
|
||||
var storage = window[type],
|
||||
x = '__storage_test__';
|
||||
storage.setItem(x, x);
|
||||
let storage = window[type];
|
||||
let x = '__storage_test__';
|
||||
storage.setItem(x, "test");
|
||||
storage.getItem(x);
|
||||
log(`lib.main.storageAvailable: ${type} is available`, "INFO")
|
||||
return true;
|
||||
} catch (err) {
|
||||
log(`lib.main.storageAvailable: ${type} is not available`, "ERR")
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Delays */
|
||||
/* Timeouts */
|
||||
/* Usage: '' */
|
||||
const delay = ms => new Promise(res => setTimeout(res, ms));
|
||||
|
||||
|
@ -41,6 +43,19 @@ async function log(msg, type) {
|
|||
};
|
||||
};
|
||||
|
||||
/* Menu Control */
|
||||
async function sidebarOpen() {
|
||||
document.getElementById("sidebar").style.width = "50%";
|
||||
document.getElementById("sidebar_open_short").style.display = "none";
|
||||
document.getElementById("sidebar_close_short").style.display = "block";
|
||||
}
|
||||
|
||||
async function sidebarClose() {
|
||||
document.getElementById("sidebar").style.width = "0%"
|
||||
document.getElementById("sidebar_open_short").style.display = "block";
|
||||
document.getElementById("sidebar_close_short").style.display = "none";
|
||||
}
|
||||
|
||||
/* Loading Box Control */
|
||||
async function hideLoading() {
|
||||
document.getElementById("loading").style = "display: none;";
|
||||
|
@ -48,7 +63,7 @@ async function hideLoading() {
|
|||
|
||||
/* DEPRECIATED: Alias for hideLoading() - Marked for removal*/
|
||||
async function clearLoading() {
|
||||
log("Depreciated function called - clearLoading()", "WARN")
|
||||
log("Depreciated function called - clearLoading() - Alias to hideLoading()", "WARN")
|
||||
await hideLoading();
|
||||
}
|
||||
|
||||
|
@ -58,4 +73,27 @@ async function showLoading() {
|
|||
|
||||
async function setLoadingDesc(desc) {
|
||||
document.getElementById("loading_desc").textContent = `${desc}`;
|
||||
}
|
||||
|
||||
/* Fetch User Settings */
|
||||
async function getQuickLinks() {
|
||||
try {
|
||||
var data = JSON.parse(localStorage.getItem("qlOpt"));
|
||||
} catch (err) {
|
||||
var data =
|
||||
["bri","lwh","srd","mtp","rda","cfn",
|
||||
"sml","shh","pri","avn","sar","svb"];
|
||||
}
|
||||
return data;
|
||||
}
|
||||
|
||||
/* Fetch a known query parameter from the pages URL */
|
||||
async function getQuery(param) {
|
||||
var params = new URLSearchParams(window.location.search)
|
||||
var query = params.get(param)
|
||||
if (query) {
|
||||
return query
|
||||
} else {
|
||||
return 'false'
|
||||
}
|
||||
}
|
|
@ -1,21 +0,0 @@
|
|||
// Loading Box
|
||||
async function clearLoading() {
|
||||
document.getElementById("loading").style = "display: none;";
|
||||
}
|
||||
|
||||
async function showLoading() {
|
||||
document.getElementById("loading").style = "display: block;";
|
||||
}
|
||||
|
||||
async function setLoadingDesc(desc) {
|
||||
document.getElementById("loading_desc").textContent = `${desc}`;
|
||||
}
|
||||
|
||||
// Enable delays
|
||||
const delay = ms => new Promise(res => setTimeout(res, ms));
|
||||
|
||||
// Log Helper
|
||||
function log(msg) {
|
||||
var time = new Date().toISOString();
|
||||
console.log(`${time} - ${msg}`)
|
||||
}
|
|
@ -29,8 +29,8 @@ async function init() {
|
|||
async function publicLdb(stn) {
|
||||
var url = `${window.location.origin}/api/v1/ldb/${stn}`;
|
||||
var resp = await fetch(url);
|
||||
return await resp.json();}
|
||||
|
||||
return await resp.json();
|
||||
}
|
||||
|
||||
async function parseLdb(data) {
|
||||
if (data.ERROR == "NOT_FOUND") { // Station not found
|
||||
|
|
|
@ -1,31 +1,15 @@
|
|||
// Init:
|
||||
const ql = ["ql0","ql1","ql2","ql3","ql4","ql5","ql6","ql7","ql8","ql9","ql10","ql11"]
|
||||
checkStorageSupport();
|
||||
storageAvailable("localStorage");
|
||||
getQl();
|
||||
clearLoading();
|
||||
|
||||
async function checkStorageSupport(){
|
||||
if (window.localStorage){
|
||||
localStorage.setItem("support-check","8441");
|
||||
if (localStorage.getItem("support-check")=="8441"){
|
||||
console.log("Local Storage supported.")
|
||||
localStorage.removeItem("support-check")
|
||||
} else if (localStorage.getItem("support-check" != "8441")){
|
||||
console.log("Error fetching test value.")
|
||||
}
|
||||
} else {
|
||||
console.log("Local Storage is not supported")
|
||||
window.alert("Settings cannot be saved on your device, try updating your browser.")
|
||||
}
|
||||
}
|
||||
hideLoading();
|
||||
|
||||
async function getQl(){
|
||||
var qlOpt = JSON.parse(localStorage.getItem("qlOpt"))
|
||||
var qlOpt = await getQuickLinks()
|
||||
if (qlOpt){
|
||||
var i = 0
|
||||
while (i < 12) {
|
||||
if (qlOpt[i] != 'undefined') {
|
||||
console.log(`Setting box ql${i} to ${qlOpt[i]}`)
|
||||
document.getElementById(`ql${i}`).value = qlOpt[i]
|
||||
i +=1
|
||||
}
|
||||
|
@ -43,9 +27,9 @@ async function setQl(){
|
|||
}
|
||||
qlSet.sort()
|
||||
}
|
||||
console.log(qlSet)
|
||||
localStorage.setItem("qlOpt", JSON.stringify(qlSet))
|
||||
clearLoading();
|
||||
log(`settings.setQl: User settings saved`, "INFO")
|
||||
hideLoading();
|
||||
}
|
||||
|
||||
async function clearQl(){
|
||||
|
|
|
@ -12,7 +12,7 @@
|
|||
<link rel="icon" type="image/svg+xml" href="./images/icon.svg"/>
|
||||
<link rel="manifest" type="application/json" href="./manifest.json"/>
|
||||
<title>OwlBoard - Settings</title>
|
||||
<script src="./js/main.js" defer></script>
|
||||
<script src="./js/lib.main.js" defer></script>
|
||||
<script src="./js/settings.js" defer></script>
|
||||
</head>
|
||||
|
||||
|
@ -50,7 +50,7 @@
|
|||
<input type="text" maxlength="3" id="ql10" name="ql10" autocomplete="off" class="small-lookup-box">
|
||||
<input type="text" maxlength="3" id="ql11" name="ql11" autocomplete="off" class="small-lookup-box"><br>
|
||||
<button onclick="setQl()" class="lookup-button">Apply</button>
|
||||
<button onclick="clearQl()" class="lookup-button">Reset</button>
|
||||
<button onclick="clearQl()" class="lookup-button">Defaults</button>
|
||||
|
||||
</body>
|
||||
</html>
|
Reference in New Issue