kai.infotren/items.js

var currentIndex = 0

function nav(offset) {
	var items = document.querySelectorAll('.items:not(.disabled)')

	currentIndex += offset
	if (currentIndex < 0) {
		currentIndex += items.length
	}
	if (currentIndex >= items.length) {
		currentIndex -= items.length
	}
	items[currentIndex].focus()
	items[currentIndex].addEventListener('keydown', handleKeyDown)
}

function handleKeyDown(e) {
	switch (e.key) {
		case 'ArrowUp':
			e.preventDefault()
			e.stopPropagation()
			nav(-1)
			break
		case 'ArrowDown':
			e.preventDefault()
			e.stopPropagation()
			nav(1)
			break
	}
}

window.addEventListener('load', function (e) {
	// Select first item
	var items = document.querySelectorAll('.items:not(.disabled)')
	if (items.length > 0) {
		items[0].focus()
		items[0].addEventListener('keydown', handleKeyDown)
	}

	document.body.addEventListener('keydown', handleKeyDown)
})