138 lines
4.8 KiB
JavaScript
138 lines
4.8 KiB
JavaScript
import './reserve.scss';
|
|
import * as Sentry from "@sentry/browser";
|
|
import {UtmEvent,UtmAccount} from "./tools/UtmEvent.js";
|
|
import * as Turbo from "@hotwired/turbo"
|
|
|
|
// --- INITIALISATION SENTRY ---
|
|
Sentry.init({
|
|
dsn: "https://803814be6540031b1c37bf92ba9c0f79@sentry.esy-web.dev/24",
|
|
tunnel: "/sentry-tunnel",
|
|
integrations: [Sentry.browserTracingIntegration()],
|
|
tracesSampleRate: 1.0,
|
|
});
|
|
|
|
const initAutoRedirect = () => {
|
|
const container = document.getElementById('payment-check-container');
|
|
if (container && container.dataset.autoRedirect) {
|
|
const url = container.dataset.autoRedirect;
|
|
|
|
// On attend 5 secondes avant de rediriger via Turbo
|
|
setTimeout(() => {
|
|
// On vérifie que l'utilisateur est toujours sur la page de check
|
|
if (document.getElementById('payment-check-container')) {
|
|
Turbo.visit(url);
|
|
}
|
|
}, 10000);
|
|
}
|
|
}
|
|
// --- LOGIQUE DU LOADER TURBO ---
|
|
const initLoader = () => {
|
|
let loaderEl = document.getElementById('turbo-loader');
|
|
|
|
if (!loaderEl) {
|
|
loaderEl = document.createElement('div');
|
|
loaderEl.id = 'turbo-loader';
|
|
loaderEl.className = 'fixed inset-0 z-[9999] flex items-center justify-center bg-white transition-opacity duration-300 opacity-0 pointer-events-none';
|
|
loaderEl.innerHTML = `
|
|
<div class="relative flex items-center justify-center">
|
|
<div class="absolute w-24 h-24 border-4 border-blue-600 border-t-transparent rounded-full animate-spin"></div>
|
|
<img src="/provider/images/favicon.png" class="w-12 h-12 relative z-10 animate-pulse" alt="Logo">
|
|
</div>
|
|
`;
|
|
document.body.appendChild(loaderEl);
|
|
}
|
|
|
|
const showLoader = () => {
|
|
loaderEl.classList.remove('opacity-0', 'pointer-events-none');
|
|
loaderEl.classList.add('opacity-100');
|
|
};
|
|
|
|
const hideLoader = () => {
|
|
setTimeout(() => {
|
|
loaderEl.classList.remove('opacity-100');
|
|
loaderEl.classList.add('opacity-0', 'pointer-events-none');
|
|
}, 300);
|
|
};
|
|
|
|
// --- ÉVÉNEMENTS TURBO (SANS BOUCLE INFINIE) ---
|
|
document.addEventListener("turbo:click", showLoader);
|
|
document.addEventListener("turbo:submit-start", showLoader);
|
|
document.addEventListener("turbo:load", hideLoader);
|
|
document.addEventListener("turbo:render", hideLoader);
|
|
};
|
|
|
|
// --- LOGIQUE DU MENU MOBILE ---
|
|
const initMobileMenu = () => {
|
|
const btn = document.getElementById('menu-button');
|
|
const menu = document.getElementById('mobile-menu');
|
|
if (btn && menu) {
|
|
btn.onclick = () => {
|
|
const isExpanded = btn.getAttribute('aria-expanded') === 'true';
|
|
btn.setAttribute('aria-expanded', !isExpanded);
|
|
menu.classList.toggle('hidden');
|
|
};
|
|
}
|
|
};
|
|
|
|
// --- LOGIQUE FILTRE CATALOGUE ---
|
|
const initCatalogueSearch = () => {
|
|
const filters = document.querySelectorAll('.filter-btn');
|
|
const products = document.querySelectorAll('.product-item');
|
|
const emptyMsg = document.getElementById('empty-msg');
|
|
|
|
if (!filters.length) return;
|
|
|
|
filters.forEach(btn => {
|
|
btn.onclick = () => {
|
|
const category = btn.getAttribute('data-filter').toLowerCase();
|
|
let count = 0;
|
|
|
|
// UI boutons
|
|
filters.forEach(f => {
|
|
f.classList.remove('bg-slate-900', 'text-white');
|
|
f.classList.add('bg-white', 'text-slate-500');
|
|
});
|
|
btn.classList.add('bg-slate-900', 'text-white');
|
|
btn.classList.remove('bg-white', 'text-slate-500');
|
|
|
|
// Filtrage
|
|
products.forEach(item => {
|
|
const itemCat = item.getAttribute('data-category').toLowerCase();
|
|
if (category === 'all' || itemCat.includes(category)) {
|
|
item.style.display = 'block';
|
|
count++;
|
|
} else {
|
|
item.style.display = 'none';
|
|
}
|
|
});
|
|
|
|
if (emptyMsg) {
|
|
count === 0 ? emptyMsg.classList.remove('hidden') : emptyMsg.classList.add('hidden');
|
|
}
|
|
};
|
|
});
|
|
};
|
|
|
|
// --- INITIALISATION ---
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
initLoader();
|
|
initMobileMenu();
|
|
initCatalogueSearch();
|
|
initAutoRedirect();
|
|
customElements.define('utm-event',UtmEvent)
|
|
customElements.define('utm-account',UtmAccount)
|
|
|
|
});
|
|
|
|
document.addEventListener('turbo:load', () => {
|
|
initMobileMenu();
|
|
initCatalogueSearch();
|
|
initAutoRedirect();
|
|
});
|
|
|
|
// Nettoyage avant cache pour éviter les bugs au retour arrière
|
|
document.addEventListener("turbo:before-cache", () => {
|
|
document.querySelectorAll('.product-item').forEach(i => i.style.display = 'block');
|
|
if (document.getElementById('empty-msg')) document.getElementById('empty-msg').classList.add('hidden');
|
|
});
|