This repository has been archived on 2023-07-11. You can view files and clone it, but cannot push or open issues or pull requests.
web/js/pis.js
2023-04-28 12:53:49 +01:00

60 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/${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>`
div.insertAdjacentHTML("beforeend", tableHtml)
const data = JSON.parse(json)
let results = 0
for(var i = 0; i < data.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">${data[i][code]}</td>
<td class="stops">${data[i][stops]}</td></tr>`
results++
}
tableData += "</table>"
document.getElementById('result-table').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('crs-box').style = 'display:block'
}