diff options
Diffstat (limited to 'src/engine/utils/modal.ts')
-rw-r--r-- | src/engine/utils/modal.ts | 33 |
1 files changed, 18 insertions, 15 deletions
diff --git a/src/engine/utils/modal.ts b/src/engine/utils/modal.ts index e7b36b1..48afae8 100644 --- a/src/engine/utils/modal.ts +++ b/src/engine/utils/modal.ts @@ -2,34 +2,37 @@ import { Miscellaneous } from "../config"; let modalOpen = false; -export const openModal = (content: string, id = Miscellaneous.MODAL_ID) => { +export const openModal = ( + content: string, + id = Miscellaneous.MODAL_ID, + contentId = Miscellaneous.MODAL_CONTENT_ID, +) => { const modal = document.getElementById(id); - if (modal && !modalOpen) { + const modalContent = document.getElementById(contentId); + if (modal && !modalOpen && modalContent) { modal.style.display = "flex"; modal.style.animation = "fadeIn 0.25s"; - modal.innerHTML = `<div class="modal-content">${content}</div>`; - const modalContent = document.querySelector<HTMLElement>(".modal-content"); - if (modalContent) { - modalContent.style.animation = "scaleUp 0.25s"; - } + modalContent.innerHTML = content; + modalContent.style.animation = "scaleUp 0.25s"; modalOpen = true; } }; -export const closeModal = (id = Miscellaneous.MODAL_ID) => { +export const closeModal = ( + id = Miscellaneous.MODAL_ID, + contentId = Miscellaneous.MODAL_CONTENT_ID, +) => { const modal = document.getElementById(id); - if (modal && modalOpen) { - modal.style.animation = "fadeOut 0.25s"; + const modalContent = document.getElementById(contentId); - const modalContent = document.querySelector<HTMLElement>(".modal-content"); - if (modalContent) { - modalContent.style.animation = "scaleDown 0.25s"; - } + if (modal && modalOpen && modalContent) { + modal.style.animation = "fadeOut 0.25s"; + modalContent.style.animation = "scaleDown 0.25s"; setTimeout(() => { - modal.innerHTML = ""; + modalContent.innerHTML = ""; modal.style.display = "none"; modalOpen = false; |