From ffca898a875caa66156b8525d517b87c9b9f5327 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hugo=20H=C3=B6rnquist?= Date: Mon, 26 Oct 2020 18:14:42 +0100 Subject: Cleanup and move input_list to own file. --- static/input_list.js | 77 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 77 insertions(+) create mode 100644 static/input_list.js (limited to 'static/input_list.js') diff --git a/static/input_list.js b/static/input_list.js new file mode 100644 index 00000000..642d9ade --- /dev/null +++ b/static/input_list.js @@ -0,0 +1,77 @@ +/* + TODO document 'input-list'. + + ∀ children('.input-list') => 'unit' ∈ classList(child) + +
+
+
+
+ +*/ + + +function transferListeners(old_unit, new_unit) { + for (let [o, n] of zip(old_unit.querySelectorAll("*"), + new_unit.querySelectorAll("*"))) { + for (const key in o.listeners) { + if (! o.listeners.hasOwnProperty(key)) continue; + for (let proc of o.listeners[key]) { + n.addEventListener(key, proc); + } + } + } +} + + +function advance_final(input_list) { + let old_unit = input_list.unit; + let new_unit = old_unit.cloneNode(true); + new_unit.classList.add('final'); + transferListeners(old_unit, new_unit); + input_list.appendChild(new_unit); +} + + + +function update_inline_list () { + + /* can target self */ + let unit = this.closest('.unit'); + + let lst = this.closest('.input-list'); + + if (unit.classList.contains("final")) { + if (this.value !== '') { + unit.classList.remove('final'); + advance_final(lst); + } + } else { + /* TODO all significant fields empty, instead of just current */ + if (this.value === '') { + let sibling = unit.previousElementSibling || unit.nextElementSibling; + unit.remove(); + if (sibling.tagName !== 'input') + sibling = sibling.querySelector('input'); + sibling.focus(); + } + } +} + +/* run this from window.onload (or similar) */ +function init_input_list() { + + for (let lst of document.getElementsByClassName('input-list')) { + let oldUnit = lst.querySelector('.final.unit') + + for (let el of lst.getElementsByTagName('input')) { + el.addEventListener('input', update_inline_list); + } + + let unit = oldUnit.cloneNode(true); + + transferListeners(oldUnit, unit); + + lst.unit = unit; + } +} -- cgit v1.2.3 From e06b4dd9253fa7affdd95ff24fb13dd2975845aa Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Hugo=20H=C3=B6rnquist?= Date: Mon, 26 Oct 2020 19:06:48 +0100 Subject: Fix listener propagation for "root" element. --- static/input_list.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'static/input_list.js') diff --git a/static/input_list.js b/static/input_list.js index 642d9ade..b15162d6 100644 --- a/static/input_list.js +++ b/static/input_list.js @@ -12,8 +12,8 @@ function transferListeners(old_unit, new_unit) { - for (let [o, n] of zip(old_unit.querySelectorAll("*"), - new_unit.querySelectorAll("*"))) { + for (let [o, n] of zip([old_unit, ...old_unit.querySelectorAll("*")], + [new_unit, ...new_unit.querySelectorAll("*")])) { for (const key in o.listeners) { if (! o.listeners.hasOwnProperty(key)) continue; for (let proc of o.listeners[key]) { @@ -62,12 +62,12 @@ function update_inline_list () { function init_input_list() { for (let lst of document.getElementsByClassName('input-list')) { - let oldUnit = lst.querySelector('.final.unit') for (let el of lst.getElementsByTagName('input')) { el.addEventListener('input', update_inline_list); } + let oldUnit = lst.querySelector('.final.unit') let unit = oldUnit.cloneNode(true); transferListeners(oldUnit, unit); -- cgit v1.2.3