diff --git a/src/agenda_culturel/static/js/modal.js b/src/agenda_culturel/static/js/modal.js index 7122530..0182a5d 100644 --- a/src/agenda_culturel/static/js/modal.js +++ b/src/agenda_culturel/static/js/modal.js @@ -23,26 +23,46 @@ const isModalOpen = (modal) => { }; // Open modal -const openModal = (modal) => { +const openModal = (modal, back=true) => { if (isScrollbarVisible()) { document.documentElement.style.setProperty("--scrollbar-width", `${getScrollbarWidth()}px`); } modal.setAttribute("open", true); - console.log("visible, " + modal); + if (back) { + window.history.pushState({ isPopup: true }, 'modal'); + window.location.hash = modal.querySelector('header a.close').getAttribute('href'); + } setTimeout(function() { visibleModal = modal; }, 500); }; -// Close modal -const closeModal = (modal) => { - if (escapeOk) { +const hideModal = (modal) => { + if (modal != null) { visibleModal = null; document.documentElement.style.removeProperty("--scrollbar-width"); modal.removeAttribute("open"); } }; +// Close modal +const closeModal = (modal) => { + if (escapeOk) { + hideModal(modal); + window.history.back(); + } +}; + + +window.addEventListener('popstate', event => { + if (event.state?.isPopup) { + if (escapeOk) { + hideModal(visibleModal); + } + } +}); + + // Close with a click outside document.addEventListener("click", (event) => { if (visibleModal != null) { @@ -59,6 +79,7 @@ document.addEventListener("keydown", (event) => { } }); + // Get scrollbar width const getScrollbarWidth = () => { // Creating invisible container @@ -84,4 +105,13 @@ const getScrollbarWidth = () => { // Is scrollbar visible const isScrollbarVisible = () => { return document.body.scrollHeight > screen.height; -}; \ No newline at end of file +}; + +document.addEventListener("DOMContentLoaded", function(e) { + if (window.location.hash != "") { + const modal = document.getElementById(window.location.hash.substring(1, window.location.hash.length)); + if (modal != null) + openModal(modal, false); + } + +}); \ No newline at end of file diff --git a/src/agenda_culturel/static/style.scss b/src/agenda_culturel/static/style.scss index ae1702d..3f83a62 100644 --- a/src/agenda_culturel/static/style.scss +++ b/src/agenda_culturel/static/style.scss @@ -45,6 +45,7 @@ $enable-responsive-typography: true; } + body>footer { text-align: center; font-size: 90%;