50 lines
1.5 KiB
JavaScript
50 lines
1.5 KiB
JavaScript
async function loadComponent(id, file) {
|
|
const el = document.getElementById(id);
|
|
if (!el) return;
|
|
const res = await fetch(file);
|
|
const html = await res.text();
|
|
el.innerHTML = html;
|
|
}
|
|
|
|
async function initComponents() {
|
|
console.log("init");
|
|
await Promise.all([
|
|
loadComponent("topbar-placeholder", "components/topbar.html"),
|
|
loadComponent("navbar-placeholder", "components/navbar.html"),
|
|
loadComponent("footer-placeholder", "components/footer.html"),
|
|
loadComponent("toast-placeholder", "components/toast.html"),
|
|
]);
|
|
|
|
// ✅ DOM is fully ready now — safe to run these
|
|
setActiveNavLink();
|
|
updateCartCount();
|
|
|
|
// ✅ Tell cart.js it can now render
|
|
document.dispatchEvent(new Event("components:ready"));
|
|
|
|
const menuToggle = document.getElementById("menu-toggle");
|
|
const mobileMenu = document.getElementById("mobile-menu");
|
|
|
|
if (!menuToggle || !mobileMenu) return;
|
|
|
|
menuToggle.addEventListener("click", () => {
|
|
mobileMenu.classList.toggle("active");
|
|
});
|
|
}
|
|
|
|
function setActiveNavLink() {
|
|
const page = window.location.pathname.split("/").pop() || "index.html";
|
|
document.querySelectorAll(".nav-links a").forEach((a) => {
|
|
a.parentElement.classList.toggle("active", a.getAttribute("href") === page);
|
|
});
|
|
}
|
|
|
|
function updateCartCount() {
|
|
const cart = JSON.parse(localStorage.getItem("cart")) || [];
|
|
const total = cart.reduce((s, i) => s + i.quantity, 0);
|
|
const el = document.getElementById("nav-cart-count");
|
|
if (el) el.textContent = total;
|
|
}
|
|
|
|
initComponents();
|