From 73b96155fcd54b958fe8c676db028fd4fc4fabe4 Mon Sep 17 00:00:00 2001 From: stilbruch Date: Wed, 6 Apr 2022 15:54:13 -0500 Subject: Add confirmation modal for deleting a workout --- app/static/js/bulma.js | 42 ++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 42 insertions(+) create mode 100644 app/static/js/bulma.js (limited to 'app/static') diff --git a/app/static/js/bulma.js b/app/static/js/bulma.js new file mode 100644 index 0000000..49b9b93 --- /dev/null +++ b/app/static/js/bulma.js @@ -0,0 +1,42 @@ +// Functions to open and close a modal +function openModal($el) { + $el.classList.add('is-active'); +} + +function closeModal($el) { + $el.classList.remove('is-active'); +} + +function closeAllModals() { + (document.querySelectorAll('.modal') || []).forEach(($modal) => { + closeModal($modal); + }); +} + +// Add a click event on buttons to open a specific modal +(document.querySelectorAll('.js-modal-trigger') || []).forEach(($trigger) => { + const modal = $trigger.dataset.target; + const $target = document.getElementById(modal); + + $trigger.addEventListener('click', () => { + openModal($target); + }); +}); + +// Add a click event on various child elements to close the parent modal +(document.querySelectorAll('.modal-background, .modal-close, .modal-card-head .delete, .modal-card-foot .button') || []).forEach(($close) => { + const $target = $close.closest('.modal'); + + $close.addEventListener('click', () => { + closeModal($target); + }); +}); + +// Add a keyboard event to close all modals +document.addEventListener('keydown', (event) => { + const e = event || window.event; + + if (e.keyCode === 27) { // Escape key + closeAllModals(); + } +}); -- cgit v1.2.3