112 lines
3.8 KiB
JavaScript
112 lines
3.8 KiB
JavaScript
// ============================================================
|
|
// AMOR & ROMA — comportamiento compartido (todas las páginas)
|
|
// ============================================================
|
|
(function () {
|
|
"use strict";
|
|
|
|
/* ---------- Función central para cambiar tema ---------- */
|
|
function setTheme(theme) {
|
|
const root = document.documentElement;
|
|
root.setAttribute("data-theme", theme);
|
|
localStorage.setItem("ar-theme", theme);
|
|
}
|
|
|
|
function toggleTheme() {
|
|
const root = document.documentElement;
|
|
const current = root.getAttribute("data-theme");
|
|
const next = current === "dark" ? "light" : "dark";
|
|
setTheme(next);
|
|
}
|
|
|
|
function getPreferredTheme() {
|
|
const stored = localStorage.getItem("ar-theme");
|
|
if (stored) return stored;
|
|
return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
|
|
}
|
|
|
|
/* ---------- Inicializar tema ---------- */
|
|
setTheme(getPreferredTheme());
|
|
|
|
/* ---------- Inicializar toggle (se puede llamar varias veces) ---------- */
|
|
function initThemeToggle() {
|
|
document.querySelectorAll("[data-theme-toggle]").forEach((btn) => {
|
|
// Remover listeners duplicados
|
|
btn.removeEventListener("click", toggleTheme);
|
|
btn.addEventListener("click", toggleTheme);
|
|
});
|
|
}
|
|
|
|
/* ---------- Menú móvil ---------- */
|
|
function initMobileMenu() {
|
|
const navToggle = document.querySelector("[data-nav-toggle]");
|
|
const mobileMenu = document.querySelector("[data-mobile-menu]");
|
|
if (navToggle && mobileMenu) {
|
|
// Remover listeners duplicados
|
|
const newToggle = navToggle.cloneNode(true);
|
|
navToggle.parentNode.replaceChild(newToggle, navToggle);
|
|
|
|
newToggle.addEventListener("click", function () {
|
|
mobileMenu.classList.toggle("open");
|
|
const expanded = mobileMenu.classList.contains("open");
|
|
this.setAttribute("aria-expanded", String(expanded));
|
|
});
|
|
|
|
mobileMenu.querySelectorAll("a").forEach((a) =>
|
|
a.addEventListener("click", () => {
|
|
mobileMenu.classList.remove("open");
|
|
const toggle = document.querySelector("[data-nav-toggle]");
|
|
if (toggle) toggle.setAttribute("aria-expanded", "false");
|
|
})
|
|
);
|
|
}
|
|
}
|
|
|
|
/* ---------- Inicializar todo al cargar ---------- */
|
|
initThemeToggle();
|
|
initMobileMenu();
|
|
|
|
/* ---------- Año dinámico en footer ---------- */
|
|
document.querySelectorAll("[data-year]").forEach((el) => {
|
|
el.textContent = new Date().getFullYear();
|
|
});
|
|
|
|
/* ============================================
|
|
EMBED PARCIALS (header + footer)
|
|
============================================ */
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const headerPlaceholder = document.getElementById('header-placeholder');
|
|
const footerPlaceholder = document.getElementById('footer-placeholder');
|
|
|
|
if (headerPlaceholder) {
|
|
fetch('partials/header.html')
|
|
.then(res => {
|
|
if (!res.ok) throw new Error('HTTP ' + res.status);
|
|
return res.text();
|
|
})
|
|
.then(html => {
|
|
headerPlaceholder.outerHTML = html;
|
|
// Re-inicializar componentes después del fetch
|
|
initThemeToggle();
|
|
initMobileMenu();
|
|
})
|
|
.catch(err => console.warn('Header no cargado:', err));
|
|
}
|
|
|
|
if (footerPlaceholder) {
|
|
fetch('partials/footer.html')
|
|
.then(res => {
|
|
if (!res.ok) throw new Error('HTTP ' + res.status);
|
|
return res.text();
|
|
})
|
|
.then(html => {
|
|
footerPlaceholder.outerHTML = html;
|
|
// Actualizar año automático
|
|
document.querySelectorAll("[data-year]").forEach((el) => {
|
|
el.textContent = new Date().getFullYear();
|
|
});
|
|
})
|
|
.catch(err => console.warn('Footer no cargado:', err));
|
|
}
|
|
});
|
|
|
|
})(); |