// Funcionalidades principais do site de casamento

// Variáveis globais
let weddingDate = new Date('2026-01-01T19:00:00').getTime();
let carouselItems = [];
let currentCarouselPosition = 0;
let carouselInterval;

// Inicialização quando o DOM estiver carregado
document.addEventListener('DOMContentLoaded', function() {
    // Inicializar menu lateral
    initSidebar();
    
    // Inicializar contador regressivo
    initCountdown();
    
    // Inicializar carrossel de fotos
    initPhotoCarousel();
    
    // Inicializar formulário de confirmação
    initRsvpForm();
});

// Função para inicializar o menu lateral
function initSidebar() {
    const menuToggle = document.getElementById('menuToggle');
    const sidebar = document.getElementById('sidebar');
    const overlay = document.getElementById('overlay');
    const menuLinks = document.querySelectorAll('.sidebar-menu a');
    
    // Abrir/fechar menu ao clicar no botão
    menuToggle.addEventListener('click', function() {
        menuToggle.classList.toggle('active');
        sidebar.classList.toggle('active');
        overlay.classList.toggle('active');
    });
    
    // Fechar menu ao clicar no overlay
    overlay.addEventListener('click', function() {
        menuToggle.classList.remove('active');
        sidebar.classList.remove('active');
        overlay.classList.remove('active');
    });
    
    // Fechar menu ao clicar em um link
    menuLinks.forEach(function(link) {
        link.addEventListener('click', function() {
            menuToggle.classList.remove('active');
            sidebar.classList.remove('active');
            overlay.classList.remove('active');
        });
    });
}

// Função para inicializar o contador regressivo
function initCountdown() {
    updateCountdown();
    
    // Atualizar contador a cada segundo
    setInterval(updateCountdown, 1000);
}

// Função para atualizar o contador regressivo
function updateCountdown() {
    const now = new Date().getTime();
    const distance = weddingDate - now;
    
    // Cálculo de dias, horas, minutos e segundos
    const days = Math.floor(distance / (1000 * 60 * 60 * 24));
    const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    const seconds = Math.floor((distance % (1000 * 60)) / 1000);
    
    // Atualizar elementos HTML
    document.getElementById('days').innerText = formatNumber(days);
    document.getElementById('hours').innerText = formatNumber(hours);
    document.getElementById('minutes').innerText = formatNumber(minutes);
    document.getElementById('seconds').innerText = formatNumber(seconds);
    
    // Se a data já passou
    if (distance < 0) {
        clearInterval(countdownInterval);
        document.getElementById('days').innerText = '00';
        document.getElementById('hours').innerText = '00';
        document.getElementById('minutes').innerText = '00';
        document.getElementById('seconds').innerText = '00';
    }
}

// Função para formatar números (adicionar zero à esquerda se necessário)
function formatNumber(number) {
    return number < 10 ? '0' + number : number;
}

// Função para inicializar o carrossel de fotos
function initPhotoCarousel() {
    // Imagens de exemplo para o carrossel (serão substituídas por imagens reais)
    carouselItems = [
        'images/photo1.jpg',
        'images/photo2.jpg',
        'images/photo3.jpg',
        'images/photo4.jpg',
        'images/photo5.jpg',
        'images/photo6.jpg'
    ];
    
    const carouselContainer = document.getElementById('carouselContainer');
    const photoCarousel = document.getElementById('photoCarousel');
    
    // Criar elementos do carrossel
    carouselItems.forEach(function(item) {
        const carouselItem = document.createElement('div');
        carouselItem.className = 'carousel-item';
        
        const img = document.createElement('img');
        img.src = item;
        img.alt = 'Foto do casal';
        
        carouselItem.appendChild(img);
        carouselContainer.appendChild(carouselItem);
    });
    
    // Duplicar os primeiros itens para criar efeito infinito
    for (let i = 0; i < 4; i++) {
        const carouselItem = document.createElement('div');
        carouselItem.className = 'carousel-item';
        
        const img = document.createElement('img');
        img.src = carouselItems[i];
        img.alt = 'Foto do casal';
        
        carouselItem.appendChild(img);
        carouselContainer.appendChild(carouselItem);
    }
    
    // Adicionar controles de navegação
    const controlsDiv = document.createElement('div');
    controlsDiv.className = 'carousel-controls';
    
    const prevButton = document.createElement('button');
    prevButton.className = 'carousel-control prev';
    prevButton.innerHTML = '&#10094;';
    prevButton.addEventListener('click', function() {
        moveCarousel('prev');
    });
    
    const nextButton = document.createElement('button');
    nextButton.className = 'carousel-control next';
    nextButton.innerHTML = '&#10095;';
    nextButton.addEventListener('click', function() {
        moveCarousel('next');
    });
    
    controlsDiv.appendChild(prevButton);
    controlsDiv.appendChild(nextButton);
    photoCarousel.appendChild(controlsDiv);
    
    // Iniciar animação do carrossel
    startCarouselAnimation();
}

// Função para iniciar a animação do carrossel
function startCarouselAnimation() {
    const carouselContainer = document.getElementById('carouselContainer');
    const itemWidth = document.querySelector('.carousel-item').offsetWidth + 20; // Largura do item + margem
    const visibleItems = 4; // Número de itens visíveis ao mesmo tempo
    
    // Parar animação anterior se existir
    if (carouselInterval) {
        clearInterval(carouselInterval);
    }
    
    // Animar o carrossel a cada 5 segundos
    carouselInterval = setInterval(function() {
        moveCarousel('next');
    }, 5000);
}

// Função para mover o carrossel
function moveCarousel(direction) {
    const carouselContainer = document.getElementById('carouselContainer');
    const itemWidth = document.querySelector('.carousel-item').offsetWidth + 20; // Largura do item + margem
    
    if (direction === 'next') {
        currentCarouselPosition -= itemWidth;
        
        // Resetar posição quando chegar ao final
        if (currentCarouselPosition <= -(itemWidth * carouselItems.length)) {
            currentCarouselPosition = 0;
        }
    } else {
        currentCarouselPosition += itemWidth;
        
        // Resetar posição quando voltar ao início
        if (currentCarouselPosition > 0) {
            currentCarouselPosition = -(itemWidth * (carouselItems.length - 4));
        }
    }
    
    carouselContainer.style.transform = `translateX(${currentCarouselPosition}px)`;
}

// Função para inicializar o formulário de confirmação
function initRsvpForm() {
    const rsvpForm = document.getElementById('rsvpForm');
    
    rsvpForm.addEventListener('submit', function(e) {
        e.preventDefault();
        
        // Obter dados do formulário
        const name = document.getElementById('name').value;
        const email = document.getElementById('email').value;
        const phone = document.getElementById('phone').value;
        const guests = document.getElementById('guests').value;
        const message = document.getElementById('message').value;
        
        // Gerar QR Code
        generateQRCode(name, email, phone, guests);
        
        // Enviar dados por e-mail (simulação)
        sendConfirmationEmail(name, email, phone, guests, message);
    });
}

// Função para gerar QR Code
function generateQRCode(name, email, phone, guests) {
    // Limpar QR Code anterior
    document.getElementById('qrcode').innerHTML = '';
    
    // Criar string com dados para o QR Code
    const qrData = `Nome: ${name}\nE-mail: ${email}\nTelefone: ${phone}\nAcompanhantes: ${guests}`;
    
    // Gerar QR Code
    new QRCode(document.getElementById('qrcode'), {
        text: qrData,
        width: 200,
        height: 200,
        colorDark: '#333333',
        colorLight: '#ffffff',
        correctLevel: QRCode.CorrectLevel.H
    });
    
    // Mostrar container do QR Code
    document.getElementById('qrcodeContainer').style.display = 'block';
}

// Função para enviar e-mail de confirmação (simulação)
function sendConfirmationEmail(name, email, phone, guests, message) {
    console.log('Enviando e-mail de confirmação para jrfilho@outlook.com.br');
    console.log('Dados:', { name, email, phone, guests, message });
    
    // Em um ambiente real, aqui seria implementada a lógica de envio de e-mail
    // Utilizando um serviço como EmailJS, Formspree, ou um backend personalizado
}

// Função para inicializar os mapas
function initMaps() {
    // Coordenadas de exemplo (serão substituídas por coordenadas reais)
    const ceremonyLocation = { lat: -23.550520, lng: -46.633308 }; // São Paulo
    const hotel1Location = { lat: -23.555, lng: -46.639 };
    const hotel2Location = { lat: -23.545, lng: -46.630 };
    const salon1Location = { lat: -23.552, lng: -46.635 };
    const salon2Location = { lat: -23.548, lng: -46.632 };
    
    // Criar mapas
    createMap('ceremonyMap', ceremonyLocation, 'Local da Cerimônia');
    createMap('hotel1Map', hotel1Location, 'Hotel 1');
    createMap('hotel2Map', hotel2Location, 'Hotel 2');
    createMap('salon1Map', salon1Location, 'Salão 1');
    createMap('salon2Map', salon2Location, 'Salão 2');
    
    // Configurar links para Google Maps
    document.getElementById('ceremonyMapLink').href = `https://www.google.com/maps?q=${ceremonyLocation.lat},${ceremonyLocation.lng}`;
    document.getElementById('hotel1MapLink').href = `https://www.google.com/maps?q=${hotel1Location.lat},${hotel1Location.lng}`;
    document.getElementById('hotel2MapLink').href = `https://www.google.com/maps?q=${hotel2Location.lat},${hotel2Location.lng}`;
    document.getElementById('salon1MapLink').href = `https://www.google.com/maps?q=${salon1Location.lat},${salon1Location.lng}`;
    document.getElementById('salon2MapLink').href = `https://www.google.com/maps?q=${salon2Location.lat},${salon2Location.lng}`;
}

// Função para criar um mapa
function createMap(elementId, position, title) {
    const map = new google.maps.Map(document.getElementById(elementId), {
        center: position,
        zoom: 15,
        styles: [
            {
                "featureType": "all",
                "elementType": "geometry.fill",
                "stylers": [
                    {
                        "weight": "2.00"
                    }
                ]
            },
            {
                "featureType": "all",
                "elementType": "geometry.stroke",
                "stylers": [
                    {
                        "color": "#9c9c9c"
                    }
                ]
            },
            {
                "featureType": "all",
                "elementType": "labels.text",
                "stylers": [
                    {
                        "visibility": "on"
                    }
                ]
            },
            {
                "featureType": "landscape",
                "elementType": "all",
                "stylers": [
                    {
                        "color": "#f2f2f2"
                    }
                ]
            },
            {
                "featureType": "landscape",
                "elementType": "geometry.fill",
                "stylers": [
                    {
                        "color": "#e6e6e6"
                    }
                ]
            },
            {
                "featureType": "poi",
                "elementType": "all",
                "stylers": [
                    {
                        "visibility": "off"
                    }
                ]
            },
            {
                "featureType": "road",
                "elementType": "all",
                "stylers": [
                    {
                        "saturation": -100
                    },
                    {
                        "lightness": 45
                    }
                ]
            },
            {
                "featureType": "road",
                "elementType": "geometry.fill",
                "stylers": [
                    {
                        "color": "#c0c0c0"
                    }
                ]
            },
            {
                "featureType": "road",
                "elementType": "labels.text.fill",
                "stylers": [
                    {
                        "color": "#7b7b7b"
                    }
                ]
            },
            {
                "featureType": "road",
                "elementType": "labels.text.stroke",
                "stylers": [
                    {
                        "color": "#ffffff"
                    }
                ]
            },
            {
                "featureType": "road.highway",
                "elementType": "all",
                "stylers": [
                    {
                        "visibility": "simplified"
                    }
                ]
            },
            {
                "featureType": "road.arterial",
                "elementType": "labels.icon",
                "stylers": [
                    {
                        "visibility": "off"
                    }
                ]
            },
            {
                "featureType": "transit",
                "elementType": "all",
                "stylers": [
                    {
                        "visibility": "off"
                    }
                ]
            },
            {
                "featureType": "water",
                "elementType": "all",
                "stylers": [
                    {
                        "color": "#a9a9a9"
                    },
                    {
                        "visibility": "on"
                    }
                ]
            }
        ]
    });
    
    // Adicionar marcador
    const marker = new google.maps.Marker({
        position: position,
        map: map,
        title: title
    });
}
