document.addEventListener("DOMContentLoaded", function() {
// 1. Scroll Reveal
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if(entry.isIntersecting) {
entry.target.classList.add('visible');
if(entry.target.querySelector('.counter')) startCounters(entry.target);
}
});
}, { threshold: 0.1 });
document.querySelectorAll('.olpa-animate-up, .olpa-animate-left, .olpa-animate-right').forEach(el => observer.observe(el));
// 2. Counters
function startCounters(container) {
const counter = container.querySelector('.counter');
if(!counter || counter.classList.contains('done')) return;
counter.classList.add('done');
const target = +counter.dataset.target;
let current = 0;
const inc = target / 50;
const timer = setInterval(() => {
current += inc;
if(current >= target) {
counter.innerText = target.toLocaleString();
clearInterval(timer);
} else {
counter.innerText = Math.floor(current).toLocaleString();
}
}, 30);
}
// 3. Countdown Timer (Actualizado a fin del día)
function updateTimer() {
const now = new Date();
// Lógica: Tiempo restante hasta el final del día (23:59:59)
let hours = 23 - now.getHours();
let minutes = 59 - now.getMinutes();
let seconds = 59 - now.getSeconds();
document.getElementById('hours').innerText = hours.toString().padStart(2, '0');
document.getElementById('minutes').innerText = minutes.toString().padStart(2, '0');
document.getElementById('seconds').innerText = seconds.toString().padStart(2, '0');
}
// Iniciar timer
updateTimer();
setInterval(updateTimer, 1000); // Actualizar cada segundo
// 4. 3D Carousel Logic (Only Desktop)
if (window.innerWidth > 768) {
const items = document.querySelectorAll('.carousel-item');
let currentIndex = 0; // Start first item
function updateCarousel() {
items.forEach((item, index) => {
item.className = 'carousel-item'; // Reset
if(index === currentIndex) item.classList.add('active');
else if(index === currentIndex - 1 || (currentIndex === 0 && index === items.length - 1)) item.classList.add('prev');
else if(index === currentIndex + 1 || (currentIndex === items.length - 1 && index === 0)) item.classList.add('next');
else item.classList.add('hidden');
});
}
document.getElementById('nextBtn')?.addEventListener('click', () => {
currentIndex = (currentIndex + 1) % items.length;
updateCarousel();
});
document.getElementById('prevBtn')?.addEventListener('click', () => {
currentIndex = (currentIndex - 1 + items.length) % items.length;
updateCarousel();
});
updateCarousel(); // Init
}
});