// 滚动动画
const observerOptions = {
    threshold: 0.1,
    rootMargin: '0px 0px -50px 0px'
};

const observer = new IntersectionObserver((entries) => {
    entries.forEach(entry => {
        if (entry.isIntersecting) {
            entry.target.classList.add('visible');
        }
    });
}, observerOptions);

// 观察所有车型区域
document.addEventListener('DOMContentLoaded', () => {
    const carSections = document.querySelectorAll('.car-section');
    carSections.forEach(section => {
        observer.observe(section);
    });

    // 平滑滚动到锚点
    const navLinks = document.querySelectorAll('.nav-menu a[href^="#"]');
    navLinks.forEach(link => {
        link.addEventListener('click', (e) => {
            e.preventDefault();
            const targetId = link.getAttribute('href');
            const targetSection = document.querySelector(targetId);
            
            if (targetSection) {
                const offsetTop = targetSection.offsetTop - 80; // 考虑导航栏高度
                window.scrollTo({
                    top: offsetTop,
                    behavior: 'smooth'
                });
            }
        });
    });

    // 导航栏滚动效果
    const navbar = document.querySelector('.navbar');
    let lastScrollTop = 0;

    window.addEventListener('scroll', () => {
        const scrollTop = window.pageYOffset || document.documentElement.scrollTop;
        
        if (scrollTop > lastScrollTop && scrollTop > 100) {
            navbar.style.transform = 'translateY(-100%)';
        } else {
            navbar.style.transform = 'translateY(0)';
        }
        
        // 添加背景透明度变化
        if (scrollTop > 50) {
            navbar.style.background = 'rgba(10, 10, 10, 0.98)';
        } else {
            navbar.style.background = 'rgba(10, 10, 10, 0.95)';
        }
        
        lastScrollTop = scrollTop;
    });

    // 数字动画效果
    const animateNumbers = () => {
        const numbers = document.querySelectorAll('.stat-number');
        
        numbers.forEach(number => {
            const finalValue = number.textContent;
            const numericValue = parseInt(finalValue.replace(/[^\\d]/g, ''));
            const suffix = finalValue.replace(/[\\d]/g, '');
            
            if (numericValue > 0) {
                let currentValue = 0;
                const increment = numericValue / 50;
                const timer = setInterval(() => {
                    currentValue += increment;
                    if (currentValue >= numericValue) {
                        currentValue = numericValue;
                        clearInterval(timer);
                    }
                    number.textContent = Math.floor(currentValue) + suffix;
                }, 30);
            }
        });
    };

    // 当英雄区域进入视口时触发数字动画
    const heroObserver = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                animateNumbers();
                heroObserver.unobserve(entry.target);
            }
        });
    }, { threshold: 0.5 });

    const heroSection = document.querySelector('.hero');
    if (heroSection) {
        heroObserver.observe(heroSection);
    }

    // 车型卡片悬停效果增强
    const carImages = document.querySelectorAll('.car-image img');
    carImages.forEach(img => {
        img.addEventListener('mouseenter', () => {
            img.style.filter = 'brightness(1.1) contrast(1.1)';
        });
        
        img.addEventListener('mouseleave', () => {
            img.style.filter = 'brightness(1) contrast(1)';
        });
    });

    // 特性标签点击效果
    const featureTags = document.querySelectorAll('.feature-tag');
    featureTags.forEach(tag => {
        tag.addEventListener('click', () => {
            // 添加点击动画
            tag.style.transform = 'scale(0.95)';
            setTimeout(() => {
                tag.style.transform = 'scale(1)';
            }, 150);
            
            // 可以在这里添加更多交互，比如显示详细信息
            console.log(`点击了特性: ${tag.textContent}`);
        });
    });

    // CTA按钮点击效果
    const ctaButton = document.querySelector('.cta-button');
    if (ctaButton) {
        ctaButton.addEventListener('click', (e) => {
            e.preventDefault();
            
            // 添加点击动画
            ctaButton.style.transform = 'scale(0.95)';
            setTimeout(() => {
                ctaButton.style.transform = 'scale(1)';
            }, 150);
            
            // 模拟预约功能
            alert('感谢您的关注！我们的销售顾问将尽快与您联系，为您安排试驾体验。');
        });
    }

    // 响应式菜单切换（移动端）
    const createMobileMenu = () => {
        const navContainer = document.querySelector('.nav-container');
        const navMenu = document.querySelector('.nav-menu');
        
        // 创建移动端菜单按钮
        const menuButton = document.createElement('button');
        menuButton.className = 'mobile-menu-button';
        menuButton.innerHTML = '☰';
        menuButton.style.cssText = `
            display: none;
            background: none;
            border: none;
            color: var(--accent-gold);
            font-size: 1.5rem;
            cursor: pointer;
            padding: 0.5rem;
        `;
        
        navContainer.appendChild(menuButton);
        
        // 移动端菜单切换
        menuButton.addEventListener('click', () => {
            navMenu.style.display = navMenu.style.display === 'flex' ? 'none' : 'flex';
            navMenu.style.cssText = `
                position: absolute;
                top: 100%;
                left: 0;
                right: 0;
                background: var(--primary-black);
                flex-direction: column;
                padding: 1rem;
                border-bottom: 1px solid var(--border-color);
            `;
        });
        
        // 响应式显示控制
        const handleResize = () => {
            if (window.innerWidth <= 768) {
                menuButton.style.display = 'block';
                navMenu.style.display = 'none';
            } else {
                menuButton.style.display = 'none';
                navMenu.style.display = 'flex';
                navMenu.style.cssText = '';
            }
        };
        
        window.addEventListener('resize', handleResize);
        handleResize(); // 初始调用
    };

    createMobileMenu();

    // 懒加载图片
    const lazyImages = document.querySelectorAll('img');
    const imageObserver = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                const img = entry.target;
                img.style.opacity = '0';
                img.style.transition = 'opacity 0.5s ease-in-out';
                
                // 模拟图片加载
                setTimeout(() => {
                    img.style.opacity = '1';
                }, 100);
                
                imageObserver.unobserve(img);
            }
        });
    });

    lazyImages.forEach(img => {
        imageObserver.observe(img);
    });

    // 添加页面加载完成后的入场动画
    document.body.style.opacity = '0';
    setTimeout(() => {
        document.body.style.transition = 'opacity 0.5s ease-in-out';
        document.body.style.opacity = '1';
    }, 100);

    // 键盘导航支持
    document.addEventListener('keydown', (e) => {
        if (e.key === 'Tab') {
            // 确保焦点可见
            document.body.classList.add('keyboard-navigation');
        }
    });

    document.addEventListener('mousedown', () => {
        document.body.classList.remove('keyboard-navigation');
    });

    // 添加键盘导航样式
    const style = document.createElement('style');
    style.textContent = `
        .keyboard-navigation *:focus {
            outline: 2px solid var(--accent-gold) !important;
            outline-offset: 2px !important;
        }
    `;
    document.head.appendChild(style);
});

// 性能优化：防抖函数
function debounce(func, wait) {
    let timeout;
    return function executedFunction(...args) {
        const later = () => {
            clearTimeout(timeout);
            func(...args);
        };
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
    };
}

// 优化滚动性能
const optimizedScroll = debounce(() => {
    // 滚动相关的优化操作
    console.log('滚动事件已优化');
}, 16); // 约60fps

window.addEventListener('scroll', optimizedScroll);

// 错误处理
window.addEventListener('error', (e) => {
    console.error('页面错误:', e.error);
});

// Promise错误处理
window.addEventListener('unhandledrejection', (e) => {
    console.error('未处理的Promise错误:', e.reason);
});