59 lines
2.2 KiB
JavaScript
59 lines
2.2 KiB
JavaScript
hideLoading()
|
|
|
|
async function findByOrigDest() {
|
|
showLoading()
|
|
const formData = await fetchOrigDest()
|
|
log(`findByOrigDest: Searching for PIS Code for ${JSON.stringify(formData)}`)
|
|
const endpoint = `pis/origdest/${formData.origin}/${formData.destination}`
|
|
const json = await getApi(endpoint)
|
|
if (json == false) {
|
|
await noData()
|
|
} else {
|
|
await insertData(json)
|
|
}
|
|
document.getElementById('crs-box').style = 'display:none'
|
|
document.getElementById('result-box').style = 'display:block'
|
|
hideLoading()
|
|
}
|
|
|
|
async function fetchOrigDest() {
|
|
var orig = document.getElementById("origin").value
|
|
var dest = document.getElementById("destination").value
|
|
return {origin: orig, destination: dest}
|
|
}
|
|
|
|
async function insertData(json) {
|
|
// Receives the JSON Respose ([{},{}]) containing one or more possible
|
|
// PIS codes. Display the code and the stops with a method of scrolling between them.
|
|
// Maybe as a table or a carousel?
|
|
const div = document.getElementById('result-box')
|
|
let tableData = `<table id="result-table">
|
|
<tr>
|
|
<th class="code">Code</th>
|
|
<th class="stops">Stations</th>
|
|
</tr>`
|
|
let results = 0
|
|
for(var i = 0; i < json.length; i++) { // Break into separate function. Need to
|
|
// iterate over stops and print them in the
|
|
// format: `AVN, PRI, SHH... etc.`
|
|
tableData += `<tr><td class="code">${json[i]['code']}</td>
|
|
<td class="stops">${json[i]['stops']}</td></tr>`
|
|
results++
|
|
}
|
|
tableData += "</table>"
|
|
div.insertAdjacentHTML("beforeend", tableData)
|
|
document.getElementById('result-count').textContent = results
|
|
}
|
|
|
|
async function noData() {
|
|
const msg = '<p>No results found</p>'
|
|
document.getElementById('result-box').insertAdjacentHTML("beforeend", msg)
|
|
}
|
|
|
|
async function reset() {
|
|
document.getElementById('origin').value = ""
|
|
document.getElementById('destination').value = ""
|
|
document.getElementById('result-box').style = 'display:none'
|
|
document.getElementById('result-box').innerHTML = ''
|
|
document.getElementById('crs-box').style = 'display:block'
|
|
} |