Compare commits
No commits in common. "7debbe48605079594315a7d0b5be673b27b1015e" and "6c2b0e62713d65b0f85c3a3f2adc6c1d3373317d" have entirely different histories.
7debbe4860
...
6c2b0e6271
|
@ -3,16 +3,13 @@
|
|||
## Frontend:
|
||||
|
||||
* Implement error pages.
|
||||
* Still need SVG Fallback option for alert icon on board.html
|
||||
* Alerts box should not be clickable, bar should be.
|
||||
* Issue page: Submit using API.
|
||||
* Support multiple service origins/destinations:
|
||||
- Where there are multiples an array is returned for trainServices.service
|
||||
* Enable text search for `locationName` on find-code page.
|
||||
|
||||
### Completed - Testing:
|
||||
|
||||
* Implement calling list.
|
||||
* Still need SVG Fallback for alert icon.
|
||||
* Support multiple origins/destinations: NOT INCLUDING ON CALLING LIST
|
||||
|
||||
|
||||
## Backend:
|
||||
|
||||
|
|
|
@ -36,10 +36,7 @@
|
|||
|
||||
<div id="alerts" onclick="">
|
||||
<div id="alerts_bar" onclick="inflateAlerts()">
|
||||
<picture>
|
||||
<source srcset="./images/nav/alert_icon.svg" type="image/svg+xml">
|
||||
<img id="alert_icon" src="./images/nav/alert_icon.svg" alt="">
|
||||
</picture>
|
||||
<img id="alert_icon" src="./images/nav/alert_icon.svg" alt="">
|
||||
<p id="alert_bar_note"></p>
|
||||
<button id="alert_expand_arrow">⋁</button>
|
||||
<div id="alerts_msg" onclick="NULL">
|
||||
|
@ -116,7 +113,7 @@
|
|||
</picture>
|
||||
<picture id="home_icon">
|
||||
<source srcset="./images/nav/home_icon.svg" type="image/svg+xml">
|
||||
<img src="./images/nav/home_icon-40.png" alt="Home">
|
||||
<img src="./images/nav/home_icon-40.png" type="image/png" alt="Home">
|
||||
</picture>
|
||||
</a>
|
||||
</div>
|
||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 2.1 KiB |
|
@ -55,7 +55,7 @@
|
|||
|
||||
<div class="text-description">
|
||||
<p>This is a development release and is under testing.</p>
|
||||
<p>Data may be stale.</p>
|
||||
<p>Departure boards do not yet work and data may be stale.</p>
|
||||
<p>Customise your quick links on the `Settings` page.</p>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -67,88 +67,7 @@ async function parseTime(string){
|
|||
}
|
||||
|
||||
// Sometimes the origin or destination names are undefined, need to catch that
|
||||
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:
|
||||
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:
|
||||
async function showCalls(id) {
|
||||
document.getElementById(id).style = "display: block;";
|
||||
return;
|
||||
}
|
||||
|
||||
async function hideCalls(id) {
|
||||
document.getElementById(id).style = "display: none;";
|
||||
async function parseName() {
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -184,22 +103,4 @@ 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()")
|
||||
}
|
||||
|
||||
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>`
|
||||
}
|
|
@ -94,12 +94,10 @@ async function displayTrains(data) {
|
|||
for(var i = 0; i < data.GetStationBoardResult.trainServices.service.length; i++) {
|
||||
// Reset Vars
|
||||
var svc = data.GetStationBoardResult.trainServices.service[i];
|
||||
displayService(svc);
|
||||
buildCallLists(svc);
|
||||
await displayService(svc);
|
||||
}
|
||||
|
||||
clearLoading();
|
||||
document.getElementById("output").style = "display:block;";
|
||||
log(`Insertion complete`)
|
||||
}
|
||||
|
||||
|
@ -114,7 +112,6 @@ 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])
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -133,8 +130,8 @@ async function displayService(svc) {
|
|||
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="name name-item">${svc.origin.location.locationName}</td>
|
||||
<td class="name name-item">${svc.destination.location.locationName}</td>
|
||||
<td class="plat ${plt.changed}">${plt.num}</td>
|
||||
<td class="time">${sta.data}</td>
|
||||
<td class="time ${eta.changed}">${eta.data}</td>
|
||||
|
@ -144,11 +141,6 @@ async function displayService(svc) {
|
|||
</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>`
|
||||
|
@ -174,8 +166,8 @@ async function displayFerryService(svc) {
|
|||
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="name name-item">${svc.origin.location.locationName}</td>
|
||||
<td class="name name-item">${svc.destination.location.locationName}</td>
|
||||
<td class="plat}">${plt}</td>
|
||||
<td class="time">${sta.data}</td>
|
||||
<td class="time ${eta.changed}">${eta.data}</td>
|
||||
|
@ -211,8 +203,8 @@ async function displayBusService(svc) {
|
|||
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="name name-item">${svc.origin.location.locationName}</td>
|
||||
<td class="name name-item">${svc.destination.location.locationName}</td>
|
||||
<td class="plat}">${plt}</td>
|
||||
<td class="time">${sta.data}</td>
|
||||
<td class="time ${eta.changed}">${eta.data}</td>
|
||||
|
@ -222,11 +214,6 @@ async function displayBusService(svc) {
|
|||
</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>`
|
||||
|
|
|
@ -137,7 +137,6 @@
|
|||
|
||||
/* Content */
|
||||
#output {
|
||||
display: none;
|
||||
width: 100%;
|
||||
margin-top: 65px;
|
||||
}
|
||||
|
@ -164,30 +163,20 @@ caption{
|
|||
text-align: left;
|
||||
}
|
||||
|
||||
.detail-name-head {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.detail-name{
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.name-item {
|
||||
color: var(--board-name-color);
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.plat{
|
||||
width: 4%;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.time{
|
||||
width: 11.5%;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.msg{
|
||||
width: 95%;
|
||||
font-size: 10px;
|
||||
|
@ -197,37 +186,6 @@ caption{
|
|||
color: var(--note-text-color);
|
||||
}
|
||||
|
||||
|
||||
.call-data {
|
||||
display: none;
|
||||
border-radius: 20px;
|
||||
width: 93%;
|
||||
max-height: 75%;
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
top: 50px;
|
||||
left: 0;
|
||||
margin: 2%;
|
||||
padding-top: 4px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 25px;
|
||||
background-color: var(--overlay-color);
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
.close-data {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: -8px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.detail-table-content {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.changed{
|
||||
animation: pulse-change 1.5s linear infinite;
|
||||
}
|
||||
|
|
Reference in New Issue