diff --git a/public/i18n/de.json b/public/i18n/de.json index ed3a76b..62d3f5e 100644 --- a/public/i18n/de.json +++ b/public/i18n/de.json @@ -20,6 +20,8 @@ "the-vdrd": "VdRD e.V.", "imprint": "Impressum", "source-code": "Quellcode", + "give-feedback": "Feedback geben", + "feedback": "Feedback", "failed-base-area": "Die Mindestgrundfläche des Käfigs muss {{ MINIMUM_BASE_AREA }}m² (also z.B. 100x50cm) betragen.", "failed-overall-area": "Die Gesamtfläche im Käfig ist zu klein.", "failed-fall-height": "Die mögliche Fallhöhe darf nicht mehr als {{ maximum_fall_height }}cm betragen.", diff --git a/public/i18n/en.json b/public/i18n/en.json index ae06b05..0236e7e 100644 --- a/public/i18n/en.json +++ b/public/i18n/en.json @@ -20,6 +20,8 @@ "the-vdrd": "VdRD r.V.", "imprint": "Imprint", "source-code": "Source Code", + "give-feedback": "Give Feedback", + "feedback": "Feedback", "failed-base-area": "The base area of the cage must not be below {{ MINIMUM_BASE_AREA }}m².", "failed-overall-area": "The overall area in the cage is to small.", "failed-fall-height": "The possible fall height between floors must not be above {{ maximum_fall_height }}cm.", diff --git a/public/index.html b/public/index.html index dac2339..c814997 100644 --- a/public/index.html +++ b/public/index.html @@ -260,12 +260,40 @@ + + + diff --git a/src/feedback.js b/src/feedback.js new file mode 100644 index 0000000..2e4851a --- /dev/null +++ b/src/feedback.js @@ -0,0 +1,42 @@ +document.addEventListener('DOMContentLoaded', () => { + // 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, .delete, .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) => { + if (event.key === "Escape") { + closeAllModals(); + } + }); +}); \ No newline at end of file diff --git a/src/index.js b/src/index.js index 4b8e7a6..ef618df 100644 --- a/src/index.js +++ b/src/index.js @@ -5,6 +5,7 @@ import '@fortawesome/fontawesome-free/js/fontawesome' import '@fortawesome/fontawesome-free/js/solid' import '@fortawesome/fontawesome-free/js/regular' import '@fortawesome/fontawesome-free/js/brands' +import './feedback' import './main.scss'; /////////////////