document.addEventListener('DOMContentLoaded', function() {
    initPreloader();
    initNavbar();
    initScrollEffects();
    initCounters();
    initCursorGlow();
    initMobileNav();
    initBackToTop();
    initContactFloat();
    initContactForm();
    initServiceCards();
    initAos();
    initImagePreview();
});

function initPreloader() {
    const preloader = document.getElementById('preloader');
    setTimeout(() => {
        preloader.classList.add('hidden');
    }, 2000);
}

function initNavbar() {
    const navbar = document.getElementById('navbar');
    
    window.addEventListener('scroll', () => {
        if (window.scrollY > 100) {
            navbar.classList.add('scrolled');
        } else {
            navbar.classList.remove('scrolled');
        }
    });
}

function initScrollEffects() {
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function(e) {
            e.preventDefault();
            const target = document.querySelector(this.getAttribute('href'));
            if (target) {
                target.scrollIntoView({
                    behavior: 'smooth',
                    block: 'start'
                });
            }
        });
    });
}

function initCounters() {
    const counters = document.querySelectorAll('.strength-number');
    const observerOptions = {
        threshold: 0.3
    };

    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                const counter = entry.target;
                const target = parseInt(counter.getAttribute('data-target'));
                animateCounter(counter, target);
                observer.unobserve(counter);
            }
        });
    }, observerOptions);

    counters.forEach(counter => {
        observer.observe(counter);
    });
}

function animateCounter(element, target) {
    const duration = 2000;
    const steps = 60;
    const increment = target / steps;
    let current = 0;

    const timer = setInterval(() => {
        current += increment;
        if (current >= target) {
            element.textContent = formatNumber(target);
            clearInterval(timer);
        } else {
            element.textContent = formatNumber(Math.floor(current));
        }
    }, duration / steps);
}

function formatNumber(num) {
    if (num >= 10000) {
        return (num / 10000).toFixed(1) + '万';
    }
    return num.toLocaleString();
}

function initCursorGlow() {
    const cursorGlow = document.querySelector('.cursor-glow');
    let mouseX = 0;
    let mouseY = 0;
    let glowX = 0;
    let glowY = 0;

    document.addEventListener('mousemove', (e) => {
        mouseX = e.clientX;
        mouseY = e.clientY;
        cursorGlow.classList.add('active');
    });

    function animateGlow() {
        glowX += (mouseX - glowX) * 0.05;
        glowY += (mouseY - glowY) * 0.05;
        cursorGlow.style.left = glowX + 'px';
        cursorGlow.style.top = glowY + 'px';
        requestAnimationFrame(animateGlow);
    }

    animateGlow();

    document.addEventListener('mouseleave', () => {
        cursorGlow.classList.remove('active');
    });
}

function initMobileNav() {
    const navToggle = document.getElementById('navToggle');
    const navLinks = document.getElementById('navLinks');

    navToggle.addEventListener('click', () => {
        navToggle.classList.toggle('active');
        navLinks.classList.toggle('active');
        document.body.classList.toggle('overflow-hidden');
    });

    navLinks.querySelectorAll('a').forEach(link => {
        link.addEventListener('click', () => {
            navToggle.classList.remove('active');
            navLinks.classList.remove('active');
            document.body.classList.remove('overflow-hidden');
        });
    });
}

function initBackToTop() {
    const backToTop = document.getElementById('backToTop');

    window.addEventListener('scroll', () => {
        if (window.scrollY > 500) {
            backToTop.classList.add('active');
        } else {
            backToTop.classList.remove('active');
        }
    });

    backToTop.addEventListener('click', () => {
        window.scrollTo({
            top: 0,
            behavior: 'smooth'
        });
    });
}

function initContactFloat() {
    const floatBtn = document.querySelector('.float-btn');
    const floatPanel = document.getElementById('floatPanel');
    const closeFloat = document.getElementById('closeFloat');

    floatBtn.addEventListener('click', () => {
        floatPanel.classList.toggle('active');
    });

    closeFloat.addEventListener('click', () => {
        floatPanel.classList.remove('active');
    });

    document.addEventListener('click', (e) => {
        if (!floatPanel.contains(e.target) && !floatBtn.contains(e.target)) {
            floatPanel.classList.remove('active');
        }
    });
}

function initContactForm() {
    const contactForm = document.getElementById('contactForm');

    if (contactForm) {
        contactForm.addEventListener('submit', (e) => {
            e.preventDefault();
            
            const formData = new FormData(contactForm);
            const data = {
                name: formData.get('name'),
                phone: formData.get('phone'),
                message: formData.get('message')
            };

            showNotification('感谢您的咨询！我们将尽快与您联系。');
            contactForm.reset();
        });
    }
}

function showNotification(message) {
    const notification = document.createElement('div');
    notification.style.cssText = `
        position: fixed;
        top: 100px;
        left: 50%;
        transform: translateX(-50%);
        background: linear-gradient(135deg, #061836, #00B4D8);
        color: white;
        padding: 16px 32px;
        border-radius: 12px;
        font-size: 16px;
        z-index: 99999;
        animation: slideDown 0.5s ease;
        box-shadow: 0 10px 30px rgba(6, 24, 54, 0.3);
    `;
    notification.textContent = message;
    document.body.appendChild(notification);

    setTimeout(() => {
        notification.style.animation = 'slideUp 0.5s ease';
        setTimeout(() => {
            notification.remove();
        }, 500);
    }, 3000);
}

function initServiceCards() {
    const serviceCards = document.querySelectorAll('.service-card');
    const secondaryButtons = document.querySelectorAll('.btn-secondary');

    secondaryButtons.forEach((btn, index) => {
        btn.addEventListener('click', () => {
            const card = serviceCards[index];
            const title = card.querySelector('h3').textContent;
            showNotification(`即将跳转到「${title}」详情页...`);
        });
    });
}

function initAos() {
    const elements = document.querySelectorAll('[data-aos]');
    const observerOptions = {
        threshold: 0.1,
        rootMargin: '0px 0px -50px 0px'
    };

    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.style.opacity = '1';
                entry.target.style.transform = 'translateY(0)';
                observer.unobserve(entry.target);
            }
        });
    }, observerOptions);

    elements.forEach(element => {
        element.style.opacity = '0';
        element.style.transform = 'translateY(30px)';
        element.style.transition = 'opacity 0.8s ease, transform 0.8s ease';
        observer.observe(element);
    });
}

document.body.insertAdjacentHTML('beforeend', `
    <style>
        @keyframes slideDown {
            from {
                opacity: 0;
                transform: translateX(-50%) translateY(-20px);
            }
            to {
                opacity: 1;
                transform: translateX(-50%) translateY(0);
            }
        }
        @keyframes slideUp {
            from {
                opacity: 1;
                transform: translateX(-50%) translateY(0);
            }
            to {
                opacity: 0;
                transform: translateX(-50%) translateY(-20px);
            }
        }
        .overflow-hidden {
            overflow: hidden;
        }
    </style>
`);

const contactBtn = document.getElementById('contactBtn');
if (contactBtn) {
    contactBtn.addEventListener('click', () => {
        const contactSection = document.getElementById('contact');
        if (contactSection) {
            contactSection.scrollIntoView({
                behavior: 'smooth',
                block: 'center'
            });
        }
    });
}

const caseCards = document.querySelectorAll('.case-card');
caseCards.forEach(card => {
    card.addEventListener('click', () => {
        const title = card.querySelector('h3').textContent;
        showNotification(`即将查看「${title}」案例详情...`);
    });
});

function initImagePreview() {
    const clickableImages = document.querySelectorAll('img[data-src], img[src$=".jpg"], img[src$=".png"], img[src$=".jpeg"]');
    const modal = document.getElementById('imageModal');
    const modalImage = document.getElementById('modalImage');
    const modalCaption = document.getElementById('modalCaption');
    const closeBtn = document.getElementById('modalClose');
    const overlay = document.getElementById('modalOverlay');
    const prevBtn = document.getElementById('prevBtn');
    const nextBtn = document.getElementById('nextBtn');
    
    const imageList = [];
    let currentIndex = 0;

    clickableImages.forEach((img, index) => {
        img.classList.add('clickable-image');
        img.setAttribute('data-index', index);
        
        imageList.push({
            src: img.src,
            alt: img.alt || '图片预览',
            title: img.title || img.alt || '图片预览'
        });

        img.addEventListener('click', function(e) {
            e.stopPropagation();
            currentIndex = parseInt(this.getAttribute('data-index'));
            showModal(currentIndex);
        });
    });

    function showModal(index) {
        if (imageList.length === 0) return;
        
        const imageData = imageList[index];
        modalImage.src = imageData.src;
        modalImage.alt = imageData.alt;
        modalCaption.textContent = imageData.title;
        modal.style.display = 'block';
        document.body.style.overflow = 'hidden';
    }

    function closeModal() {
        modal.style.display = 'none';
        document.body.style.overflow = '';
    }

    function prevImage() {
        currentIndex = (currentIndex - 1 + imageList.length) % imageList.length;
        showModal(currentIndex);
    }

    function nextImage() {
        currentIndex = (currentIndex + 1) % imageList.length;
        showModal(currentIndex);
    }

    closeBtn.addEventListener('click', closeModal);
    overlay.addEventListener('click', closeModal);
    
    prevBtn.addEventListener('click', function(e) {
        e.stopPropagation();
        prevImage();
    });
    
    nextBtn.addEventListener('click', function(e) {
        e.stopPropagation();
        nextImage();
    });

    document.addEventListener('keydown', function(e) {
        if (modal.style.display === 'block') {
            if (e.key === 'Escape') {
                closeModal();
            } else if (e.key === 'ArrowLeft') {
                prevImage();
            } else if (e.key === 'ArrowRight') {
                nextImage();
            }
        }
    });
}