Current script is:
<script data-name="Incremental IO" data-version="v0.1">
var observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
if (!mutation.addedNodes) return
if ((rect = document.querySelector(".closet-rect")) != null) {
incrementalIO(rect)
observer.disconnect()
}
})
})
observer.observe(document.getElementById("qa"), {
childList: true,
subtree: true
})
function incrementalIO(first) {
for (rect of document.querySelectorAll(".closet-rect.is-active")) {
rect.classList.remove("is-active")
}
activate(first)
}
function activate(rect) {
rect.classList.add("is-active")
rect.addEventListener("click", reveal)
}
function reveal() {
this.classList.remove("is-front")
this.classList.add("is-back")
if ((next = this.nextElementSibling) != null) {
activate(next)
}
}
</script>
When I change the .addEventListener to "keyup", I still have to click on the object before it allows the keyup function to work. This defeats the purpose of removing the click to reveal. Is there a way that I can automatically have the object(s) selected for the keyup to work? Ideally, I would like to specify one key to do this, but I'd settle for any at the moment.