kai.infodb/train.js

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()
})