web/js/pis.js

hideLoading()
versionDisplay()
showHideAuthNotice()

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, auth = true)
  if (json == false) {
    await displayNoData()
  } else if (json == 401) {
    await displayUnauthorised()
  } 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>Code</th>
        <th>Stations</th>
        </tr>`
  let results = 0
  for(var i = 0; i < json.length; i++) {  // Hopefully can style output with CSS
    tableData += `<tr><td class="pis-code">${json[i]['code']}</td>
            <td class="station">${json[i]['stops'].join(', ')}</td></tr>`
    results++
  }
  tableData += '</table>'
  div.insertAdjacentHTML('beforeend', tableData)
  document.getElementById('result-count').textContent = results.toString()
}

async function displayNoData() {
  const msg = '<p id="result-table">No results found</p>'
  document.getElementById('result-box').insertAdjacentHTML('beforeend', msg)
}

async function displayUnauthorised() {
  const msg = '<p id="result-table">Unauthorised - please ensure you are logged into the <a href="./settings.html">rail staff version</a></p>'
  document.getElementById('result-box').insertAdjacentHTML('beforeend', msg)
}

async function reset() {
  try {
    document.getElementById('origin').value = ''
    document.getElementById('destination').value = ''
    document.getElementById('result-box').style = 'display:none'
    document.getElementById('result-table').remove()
    document.getElementById('crs-box').style = 'display:block'
    document.getElementById('result-count').textContent = 0
  } catch(e) {
    log('Nothing to reset')
  }
}