Allow opening multiple new/edit forms

Closes #30
This commit is contained in:
2024-12-21 17:52:45 +01:00
parent e5cf3dc0ae
commit d726e92445
14 changed files with 95 additions and 116 deletions

View File

@@ -15,20 +15,6 @@ Turbo.StreamElement.prototype.enableElement = function(element) {
element.removeAttribute("tabindex")
}
Turbo.StreamElement.prototype.removePreviousForm = function(form) {
const id = form.id
const row = document.getElementById(id + "_cached")
form.remove()
if (row) {
row.id = id
row.removeAttribute("style")
}
if (form.hasAttribute("data-link-id")) {
const link = document.getElementById(form.getAttribute("data-link-id"))
this.enableElement(link)
}
}
Turbo.StreamActions.disable = function() {
this.targetElements.forEach((e) => {
@@ -42,48 +28,19 @@ Turbo.StreamActions.enable = function() {
this.targetElements.forEach((e) => { this.enableElement(e) })
}
Turbo.StreamActions.blur = function() {
blur()
}
Turbo.StreamActions.focus = function() {
// NOTE: call blur() before setting focus?
this.targetElements[0].focus({focusVisible: true})
}
Turbo.StreamActions.prepend_form = function() {
this.targetElements.forEach((e) => {
[...e.getElementsByClassName("form")].forEach((f) => {
this.removePreviousForm(f)
})
e.prepend(this.templateContent)
})
}
Turbo.StreamActions.after_form = function() {
this.targetElements.forEach((e) => {
[...e.parentElement?.getElementsByClassName("form")].forEach((f) => {
this.removePreviousForm(f)
})
e.parentElement?.insertBefore(this.templateContent, e.nextSibling)
})
}
Turbo.StreamActions.replace_form = function() {
this.targetElements.forEach((e) => {
const id = e.id;
[...e.parentElement?.getElementsByClassName("form")].forEach((f) => {
this.removePreviousForm(f)
})
e = document.getElementById(id)
e.style.display = "none"
e.id = e.id + "_cached"
e.parentElement?.insertBefore(this.templateContent, e.nextSibling)
})
Turbo.StreamActions.hide = function() {
this.targetElements.forEach((e) => { e.style.display = "none" })
}
Turbo.StreamActions.close_form = function() {
this.targetElements.forEach((e) => {
this.removePreviousForm(e.closest(".form"))
document.getElementById(e.getAttribute("data-form")).remove()
if (e.hasAttribute("data-link")) {
this.enableElement(document.getElementById(e.getAttribute("data-link")))
}
if (e.hasAttribute("data-hidden-row")) {
document.getElementById(e.getAttribute("data-hidden-row")).removeAttribute("style")
}
e.remove()
})
}