39 lines
1.4 KiB
JavaScript
39 lines
1.4 KiB
JavaScript
import { submitValueDebounced } from './submit_value.js'
|
|
|
|
export default function initAcrosticQuestions() {
|
|
document.querySelectorAll('[data-behaviour="question_acrostic"]').forEach((acrostic) => {
|
|
const submitUrl = acrostic.dataset.submitUrl
|
|
const _submit = submitValueDebounced()
|
|
|
|
const allInputs = Array.from(acrostic.querySelectorAll(".acrostic-input"))
|
|
|
|
function submit() {
|
|
const data = allInputs.map((input) => input.value)
|
|
_submit(submitUrl, {data})
|
|
}
|
|
|
|
allInputs.forEach((input) => {
|
|
const index = Number.parseInt(input.dataset.index)
|
|
const previous = acrostic.querySelector(`.acrostic-input[data-index="${index - 1}"]`)
|
|
const next = acrostic.querySelector(`.acrostic-input[data-index="${index + 1}"]`)
|
|
input.addEventListener('input', (event) => {
|
|
if (event.data) {
|
|
input.value = event.data[0]
|
|
}
|
|
submit()
|
|
if (event.data) {
|
|
if (next) {
|
|
next.focus()
|
|
}
|
|
} else {
|
|
if (previous) {
|
|
previous.focus()
|
|
}
|
|
}
|
|
})
|
|
input.addEventListener('focus', () => {
|
|
input.select()
|
|
})
|
|
})
|
|
})
|
|
}
|