kai.infodb/station.js

var knownStations = []

function goToStation(stationId) {
	var url = new URL(window.location.href)
	url.pathname = 'view-station.html'
	url.searchParams.set('stationId', stationId)
	url.searchParams.set('date', new Date().toISOString())
	window.location.href = url.toString()
}

function searchNormalize(str) {
	return str
		.toLowerCase()
		.replaceAll('ă', 'a')
		.replaceAll('â', 'a')
		.replaceAll('î', 'i')
		.replaceAll('ș', 's')
		.replaceAll('ț', 't')
} 

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 = knownStations.slice()

	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) {
				goToStation(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 stationNameP = document.createElement('p')
			suggestionLi.appendChild(stationNameP)

			stationNameP.textContent = suggestion.name
			stationNameP.classList.add('pri', 'stationName')

			// var trainCompanyP = document.createElement('p')
			// suggestionLi.appendChild(trainCompanyP)

			// trainCompanyP.textContent = suggestion.company
			// trainCompanyP.classList.add('thi')
		}, 0)
	})

	setTimeout(function () {
		_rebuildDebounce = null
		if (_rebuildRequested) {
			rebuildSuggestions()
		}
	}, 500)
}

var fetchAbortController = new AbortController()
function reloadSuggestions() {
	var stationNameInput = document.getElementById('stationName')
	var stationName = searchNormalize(stationNameInput.value.trim())

	var locationsUrl = new URL('https://v6.db.transport.rest/locations')
	locationsUrl.searchParams.set('query', stationName)
	locationsUrl.searchParams.set('limit', '25')
	locationsUrl.searchParams.set('fuzzy', 'true')
	locationsUrl.searchParams.set('stops', 'true')

	fetchAbortController.abort()
	fetchAbortController = new AbortController()
	fetch(locationsUrl.toString(), { signal: fetchAbortController.signal })
		.then(function (response) {
			return response.json()
		})
		.then(function (data) {
			if (data) {
				knownStations = Object.values(data)
				rebuildSuggestions()
			}
		})
}

function lsk() {
	document.getElementById('stationName').focus()
}

function csk() {
	if (focusedElement == null) {
		return
	}

	if (focusedElement.id === 'stationName') {
		goToTrain(document.activeElement.value.trim())
	}
	else {
		focusedElement.click()
	}
}

window.addEventListener('load', function (e) {
	var stationName = document.getElementById('stationName')
	stationName.addEventListener('input', function (e) {
		reloadSuggestions()
	})
	stationName.addEventListener('focus', function (e) {
		focusedElement = stationName
		document.getElementsByClassName('lsk')[0].textContent = ''
		document.getElementsByClassName('csk')[0].textContent = 'Search'
	})
	stationName.addEventListener('blur', function (e) {
		document.getElementsByClassName('lsk')[0].textContent = 'Search'
		document.getElementsByClassName('csk')[0].textContent = 'Select'
	})
	stationName.addEventListener('keypress', function (e) {
		if (e.key == 'Enter') {
			goToStation(stationName.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()
})