Remove duplicate code

This commit is contained in:
Joachim 2022-01-01 18:17:11 +01:00
parent 3c1552d435
commit cc05e30605

View file

@ -41,6 +41,7 @@ let BookWyrm = new (class {
document document
.querySelectorAll("[data-duplicate]") .querySelectorAll("[data-duplicate]")
.forEach((node) => node.addEventListener("click", this.duplicateInput.bind(this))); .forEach((node) => node.addEventListener("click", this.duplicateInput.bind(this)));
document document
.querySelectorAll("details.dropdown") .querySelectorAll("details.dropdown")
.forEach((node) => .forEach((node) =>
@ -405,7 +406,7 @@ let BookWyrm = new (class {
} }
/** /**
* Handle the modal component. * Handle the modal component with a button trigger.
* *
* @param {Event} event - Event fired by an element * @param {Event} event - Event fired by an element
* with the `data-modal-open` attribute * with the `data-modal-open` attribute
@ -416,6 +417,7 @@ let BookWyrm = new (class {
* for information about using the modal. * for information about using the modal.
*/ */
handleModalButton(event) { handleModalButton(event) {
const { handleFocusTrap } = this
const modalButton = event.currentTarget; const modalButton = event.currentTarget;
const targetModalId = modalButton.dataset.modalOpen; const targetModalId = modalButton.dataset.modalOpen;
const htmlElement = document.querySelector("html"); const htmlElement = document.querySelector("html");
@ -457,38 +459,6 @@ let BookWyrm = new (class {
modalButton.focus(); modalButton.focus();
} }
function handleFocusTrap(event) {
if (event.key !== "Tab") {
return;
}
const focusableEls = event.currentTarget.querySelectorAll(
[
"a[href]:not([disabled])",
"button:not([disabled])",
"textarea:not([disabled])",
'input:not([type="hidden"]):not([disabled])',
"select:not([disabled])",
"details:not([disabled])",
'[tabindex]:not([tabindex="-1"]):not([disabled])',
].join(",")
);
const firstFocusableEl = focusableEls[0];
const lastFocusableEl = focusableEls[focusableEls.length - 1];
if (event.shiftKey) {
/* Shift + tab */ if (document.activeElement === firstFocusableEl) {
lastFocusableEl.focus();
event.preventDefault();
}
} /* Tab */ else {
if (document.activeElement === lastFocusableEl) {
firstFocusableEl.focus();
event.preventDefault();
}
}
}
// Open modal // Open modal
handleModalOpen(modal); handleModalOpen(modal);
} }