diff --git a/apps/passport-server/resources/one-click-page/index.html b/apps/passport-server/resources/one-click-page/index.html index 2561a81800..678c0bcecd 100644 --- a/apps/passport-server/resources/one-click-page/index.html +++ b/apps/passport-server/resources/one-click-page/index.html @@ -7,7 +7,7 @@ -
+
- {{eventName}} + WELCOME TO {{eventName}}
{{eventLocation}} · @@ -476,39 +502,27 @@ {{/isMoreThanOne}}
- - - {{#tickets}} -
- -
- {{attendeeName}} -
- {{attendeeEmail}} - · - {{ticketName}} + + + {{#tickets}} +
+ +
+ {{attendeeName}} +
+ {{attendeeEmail}} + · + {{ticketName}} +
-
{{#showAddons}}
{{/tickets}}
@@ -640,6 +657,7 @@ const path = window.location.pathname; const oneClickMatch = path.match(/\/one-click-preview.*/); const newPath = oneClickMatch ? oneClickMatch[0] : ""; + const clientPath = joinPaths("{{{zupassUrl}}}", "#", newPath); // Once loaded we want to set the one click redirect link to local storage @@ -668,16 +686,19 @@ // Format the time string without spans return `${days}d:${hours}h:${minutes}m:${seconds}s`; } - + function redirectToZupass() { + window.location.replace(clientPath); + } + + function onFrogcryptoClick() { const maybeDate = Date.parse("{{startDate}}"); if (isNaN(maybeDate) || maybeDate < Date.now()) { - window.location.replace(clientPath); + redirectToZupass() } else { timeLeftText.innerText = timeToStartDate(); - overlay.classList.remove("modal__overlay--disabled"); - timeModal.classList.remove("modal__container--hide"); + openModal(timeModal); interval = setInterval(function () { timeLeftText.innerText = timeToStartDate(); @@ -685,8 +706,6 @@ } } - const clientPath = joinPaths("{{{zupassUrl}}}", "#", newPath); - for(const addonModal of addonsModals){ addonModal.onclick = function (e) { e.stopPropagation(); @@ -699,28 +718,27 @@ yesBtn.onclick = function () { - overlay.classList.add("modal__overlay--disabled"); + closeModal(timeModal); for(const addonModal of addonsModals){ - addonModal.classList.add("modal__container--hide"); + closeModal(addonModal); } - timeModal.classList.add("modal__container--hide"); clearInterval(interval); } overlay.onclick = function () { - overlay.classList.add("modal__overlay--disabled"); + closeModal(timeModal); for(const addonModal of addonsModals){ - addonModal.classList.add("modal__container--hide"); + closeModal(addonModal); } - timeModal.classList.add("modal__container--hide"); clearInterval(interval); } for(const addonsBtn of addonsBtns){ const id = addonsBtn.id.split("_")[2]; const addonsModal = document.getElementById("modal_addons_"+id); + let swiper; // Declare swiper variable outside the function + addonsBtn.onclick = function () { - overlay.classList.remove("modal__overlay--disabled"); - addonsModal.classList.remove("modal__container--hide"); + openModal(addonsModal); // Select the specific navigation buttons and index text within the modal const swiperContainer = addonsModal.querySelector(".swiper-container"); @@ -730,7 +748,7 @@ const closeBtn = addonsModal.querySelector("#close"); // Initialize a new Swiper instance for the specific modal - const swiper = new Swiper(swiperContainer, { + swiper = new Swiper(swiperContainer, { spaceBetween: 12, navigation: { prevEl: prevButton, @@ -746,13 +764,29 @@ // Close button functionality for the specific modal closeBtn.onclick = function () { - overlay.classList.add("modal__overlay--disabled"); - addonsModal.classList.add("modal__container--hide"); + closeModal(addonsModal); + swiper.slideTo(0); // Reset swiper to the first slide }; } } + function toggleBodyScroll(enable) { + document.body.style.overflow = enable ? 'auto' : 'hidden'; + } + // When opening a modal + function openModal(modal) { + overlay.classList.remove("modal__overlay--disabled"); + modal.classList.remove("modal__container--hide"); + toggleBodyScroll(false); // Disable scrolling + } + + // When closing a modal + function closeModal(modal) { + overlay.classList.add("modal__overlay--disabled"); + modal.classList.add("modal__container--hide"); + toggleBodyScroll(true); // Enable scrolling + }