|
|
|
var knownTrains = []
|
|
|
|
|
|
|
|
function goToTrip(tripId) {
|
|
|
|
var url = new URL(window.location.href)
|
|
|
|
url.pathname = 'view-train.html'
|
|
|
|
url.searchParams.set('tripId', tripId)
|
|
|
|
url.searchParams.set('date', new Date().toISOString())
|
|
|
|
window.location.href = url.toString()
|
|
|
|
}
|
|
|
|
|
|
|
|
var focusedElement = null
|
|
|
|
|
|
|
|
var _rebuildDebounce = null
|
|
|
|
var _rebuildRequested = false
|
|
|
|
function rebuildSuggestions() {
|
|
|
|
if (_rebuildDebounce !== null) {
|
|
|
|
_rebuildRequested = true
|
|
|
|
return
|
|
|
|
}
|
|
|
|
|
|
|
|
_rebuildRequested = false
|
|
|
|
_rebuildDebounce = 123
|
|
|
|
|
|
|
|
var suggestionsArea = document.getElementById('suggestionsArea')
|
|
|
|
while (suggestionsArea.childNodes.length > 0) {
|
|
|
|
suggestionsArea.childNodes[0].remove()
|
|
|
|
}
|
|
|
|
|
|
|
|
var suggestions = knownTrains.filter(function (suggestion) {
|
|
|
|
return suggestion.line.name
|
|
|
|
})
|
|
|
|
|
|
|
|
// Trim the amount of results displayed
|
|
|
|
if (suggestions.length > 100) {
|
|
|
|
suggestions.splice(100)
|
|
|
|
}
|
|
|
|
|
|
|
|
suggestions.forEach(function (suggestion, index) {
|
|
|
|
var suggestionLi = document.createElement('li')
|
|
|
|
suggestionsArea.appendChild(suggestionLi)
|
|
|
|
|
|
|
|
setTimeout(function () {
|
|
|
|
suggestionLi.classList.add('items')
|
|
|
|
suggestionLi.tabIndex = index + 1
|
|
|
|
suggestionLi.style.padding = '2px 0'
|
|
|
|
|
|
|
|
function onAction(e) {
|
|
|
|
goToTrip(suggestion.id)
|
|
|
|
}
|
|
|
|
suggestionLi.addEventListener('click', onAction)
|
|
|
|
suggestionLi.addEventListener('keypress', function (e) {
|
|
|
|
if (e.key == 'Enter') {
|
|
|
|
onAction(e)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
suggestionLi.addEventListener('focus', function (e) {
|
|
|
|
focusedElement = suggestionLi
|
|
|
|
})
|
|
|
|
|
|
|
|
var trainNameP = document.createElement('p')
|
|
|
|
suggestionLi.appendChild(trainNameP)
|
|
|
|
trainNameP.textContent = `${suggestion.line.name} (${suggestion.line.fahrtNr})`
|
|
|
|
trainNameP.classList.add('pri', 'trainName')
|
|
|
|
|
|
|
|
var trainRouteP = document.createElement('p')
|
|
|
|
suggestionLi.appendChild(trainRouteP)
|
|
|
|
|
|
|
|
trainRouteP.textContent = `${suggestion.origin.name} → ${suggestion.destination.name}`
|
|
|
|
trainRouteP.classList.add('thi')
|
|
|
|
|
|
|
|
var trainCompanyP = document.createElement('p')
|
|
|
|
suggestionLi.appendChild(trainCompanyP)
|
|
|
|
|
|
|
|
trainCompanyP.textContent = suggestion.line.operator.name
|
|
|
|
trainCompanyP.classList.add('thi')
|
|
|
|
}, 0)
|
|
|
|
})
|
|
|
|
|
|
|
|
setTimeout(function () {
|
|
|
|
_rebuildDebounce = null
|
|
|
|
if (_rebuildRequested) {
|
|
|
|
rebuildSuggestions()
|
|
|
|
}
|
|
|
|
}, 500)
|
|
|
|
}
|
|
|
|
|
|
|
|
var fetchAbortController = new AbortController()
|
|
|
|
function reloadSuggestions() {
|
|
|
|
var trainNumberInput = document.getElementById('trainNumber')
|
|
|
|
var trainNumber = trainNumberInput.value.trim()
|
|
|
|
|
|
|
|
var tripsUrl = new URL('https://v6.db.transport.rest/trips')
|
|
|
|
tripsUrl.searchParams.set('query', trainNumber)
|
|
|
|
tripsUrl.searchParams.set('onlyCurrentlyRunning', 'true')
|
|
|
|
|
|
|
|
fetchAbortController.abort()
|
|
|
|
fetchAbortController = new AbortController()
|
|
|
|
fetch(tripsUrl.toString(), { signal: fetchAbortController.signal })
|
|
|
|
.then(function (response) {
|
|
|
|
return response.json()
|
|
|
|
})
|
|
|
|
.then(function (data) {
|
|
|
|
if (data.trips) {
|
|
|
|
knownTrains = data.trips
|
|
|
|
knownTrains.sort(function (s1, s2) {
|
|
|
|
var diff1 = Math.abs(Date.now() - new Date(s1.plannedDeparture).getTime())
|
|
|
|
var diff2 = Math.abs(Date.now() - new Date(s2.plannedDeparture).getTime())
|
|
|
|
return diff1 - diff2
|
|
|
|
})
|
|
|
|
rebuildSuggestions()
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
function lsk() {
|
|
|
|
document.getElementById('trainNumber').focus()
|
|
|
|
}
|
|
|
|
|
|
|
|
function csk() {
|
|
|
|
if (focusedElement == null) {
|
|
|
|
return
|
|
|
|
}
|
|
|
|
|
|
|
|
if (focusedElement.id === 'trainNumber') {
|
|
|
|
goToTrip(document.activeElement.value.trim())
|
|
|
|
}
|
|
|
|
else {
|
|
|
|
focusedElement.click()
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
window.addEventListener('load', function (e) {
|
|
|
|
var trainNumber = document.getElementById('trainNumber')
|
|
|
|
trainNumber.addEventListener('input', function (e) {
|
|
|
|
reloadSuggestions()
|
|
|
|
})
|
|
|
|
trainNumber.addEventListener('focus', function (e) {
|
|
|
|
focusedElement = trainNumber
|
|
|
|
document.getElementsByClassName('lsk')[0].textContent = ''
|
|
|
|
document.getElementsByClassName('csk')[0].textContent = 'Search'
|
|
|
|
})
|
|
|
|
trainNumber.addEventListener('blur', function (e) {
|
|
|
|
document.getElementsByClassName('lsk')[0].textContent = 'Search'
|
|
|
|
document.getElementsByClassName('csk')[0].textContent = 'Select'
|
|
|
|
})
|
|
|
|
trainNumber.addEventListener('keypress', function (e) {
|
|
|
|
if (e.key == 'Enter') {
|
|
|
|
goToTrip(trainNumber.value.trim())
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
|
|
|
document.querySelectorAll('.lsk').forEach(function (lskElem) {
|
|
|
|
lskElem.addEventListener('click', function (e) {
|
|
|
|
lsk()
|
|
|
|
})
|
|
|
|
})
|
|
|
|
document.querySelectorAll('.csk').forEach(function (cskElem) {
|
|
|
|
cskElem.addEventListener('click', function (e) {
|
|
|
|
csk()
|
|
|
|
})
|
|
|
|
})
|
|
|
|
document.body.addEventListener('keydown', function (e) {
|
|
|
|
if (e.key == 'SoftLeft') {
|
|
|
|
lsk()
|
|
|
|
}
|
|
|
|
else if (e.key == 'Enter') {
|
|
|
|
csk()
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
|
|
|
reloadSuggestions()
|
|
|
|
})
|