// Main JavaScript for TechForge Nexus

document.addEventListener('DOMContentLoaded', function() {
    // Initialize any global functionality
    // Enhanced smooth scrolling for anchor links with animation
    document.querySelectorAll('a.scroll-link').forEach(anchor => {
        anchor.addEventListener('click', function (e) {
            e.preventDefault();
            const targetId = this.getAttribute('href');
            if (targetId.startsWith('#')) {
                const targetElement = document.querySelector(targetId);
                if (targetElement) {
                    // Add active class for visual feedback
                    document.querySelectorAll('a.scroll-link').forEach(link => {
                        link.classList.remove('active');
                    });
                    this.classList.add('active');
                    
                    // Calculate scroll position
                    const headerHeight = document.querySelector('techforge-header')?.shadowRoot?.querySelector('.header')?.offsetHeight || 80;
                    const targetPosition = targetElement.offsetTop - headerHeight - 20;
                    
                    // Smooth scroll with easing
                    window.scrollTo({
                        top: targetPosition,
                        behavior: 'smooth'
                    });
                    
                    // Add visual highlight to target section
                    targetElement.classList.add('highlight-section');
                    setTimeout(() => {
                        targetElement.classList.remove('highlight-section');
                    }, 2000);
                }
            }
        });
    });

    // Smooth scrolling for general # links
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        if (!anchor.classList.contains('scroll-link')) {
            anchor.addEventListener('click', function (e) {
                const targetId = this.getAttribute('href');
                if (targetId === '#') return;
                
                const targetElement = document.querySelector(targetId);
                if (targetElement) {
                    e.preventDefault();
                    const headerHeight = document.querySelector('techforge-header')?.shadowRoot?.querySelector('.header')?.offsetHeight || 80;
                    window.scrollTo({
                        top: targetElement.offsetTop - headerHeight - 20,
                        behavior: 'smooth'
                    });
                }
            });
        }
    });
// Parallax effect for hero section
    const heroSection = document.querySelector('section:first-of-type');
    if (heroSection) {
        window.addEventListener('scroll', function() {
            const scrolled = window.pageYOffset;
            const rate = scrolled * -0.5;
            if (heroSection.querySelector('video')) {
                heroSection.querySelector('video').style.transform = `translate3d(0px, ${rate}px, 0px)`;
            }
        });
    }

    // Intersection Observer for animations
    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('animate-fade-in');
            }
        });
    }, observerOptions);

    // Observe all sections and cards
    document.querySelectorAll('section, .feature-card, .rounded-2xl').forEach(el => {
        el.classList.add('opacity-0', 'transition-opacity', 'duration-700');
        observer.observe(el);
    });
    // Add CSS for animations
    const style = document.createElement('style');
    style.textContent = `
        .animate-fade-in {
            opacity: 1 !important;
            animation: fadeIn 0.7s ease-out forwards;
        }
        
        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
        
        /* Highlight animation for target sections */
        .highlight-section {
            animation: highlightPulse 2s ease;
        }
        
        @keyframes highlightPulse {
            0% {
                box-shadow: 0 0 0 0 rgba(245, 196, 107, 0);
            }
            50% {
                box-shadow: 0 0 0 20px rgba(245, 196, 107, 0.2);
            }
            100% {
                box-shadow: 0 0 0 0 rgba(245, 196, 107, 0);
            }
        }
        
        /* New button animations */
        .scroll-link {
            transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }
        
        .scroll-link:hover {
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }
    `;
    document.head.appendChild(style);
    
    // Add float animation to new buttons after a delay
    setTimeout(() => {
        const scrollButtons = document.querySelectorAll('.scroll-link');
        scrollButtons.forEach((button, index) => {
            button.style.animationDelay = `${index * 0.1}s`;
            button.classList.add('animate-float-soft');
        });
    }, 1000);
// Video controls
    const heroVideos = document.querySelectorAll('video');
    heroVideos.forEach(video => {
        // Ensure video plays
        video.play().catch(error => {
            console.log('Video autoplay failed:', error);
            // Fallback: play on user interaction
            const playVideoOnce = () => {
                video.play();
                document.removeEventListener('click', playVideoOnce);
            };
            document.addEventListener('click', playVideoOnce);
        });
    });

    // Video player controls for foreground video
    const videoPlayerContainer = document.querySelector('.group');
    if (videoPlayerContainer) {
        const video = videoPlayerContainer.querySelector('video');
        const playButton = videoPlayerContainer.querySelector('button:nth-of-type(1)');
        const muteButton = videoPlayerContainer.querySelector('button:nth-of-type(2)');

        if (playButton && video) {
            playButton.addEventListener('click', () => {
                if (video.paused) {
                    video.play();
                    playButton.innerHTML = '<i data-feather="pause" class="w-5 h-5"></i>';
                } else {
                    video.pause();
                    playButton.innerHTML = '<i data-feather="play" class="w-5 h-5"></i>';
                }
                feather.replace();
            });
        }

        if (muteButton && video) {
            muteButton.addEventListener('click', () => {
                video.muted = !video.muted;
                muteButton.innerHTML = video.muted 
                    ? '<i data-feather="volume-x" class="w-5 h-5"></i>'
                    : '<i data-feather="volume-2" class="w-5 h-5"></i>';
                feather.replace();
            });
        }

        // Update timeline progress (simulated)
        const timelineProgress = videoPlayerContainer.querySelector('.h-full.bg-accent');
        if (timelineProgress && video) {
            const updateProgress = () => {
                if (video.duration) {
                    const percent = (video.currentTime / video.duration) * 100;
                    timelineProgress.style.width = percent + '%';
                }
            };
            video.addEventListener('timeupdate', updateProgress);
        }
    }
// Testimonial hover effects
    const testimonials = document.querySelectorAll('.bg-secondary\\/50');
    testimonials.forEach(testimonial => {
        testimonial.addEventListener('mouseenter', function() {
            this.style.transform = 'translateY(-5px)';
        });
        
        testimonial.addEventListener('mouseleave', function() {
            this.style.transform = 'translateY(0)';
        });
    });

    // Mobile menu toggle (if needed in future)
    function initMobileMenu() {
        const menuToggle = document.createElement('button');
        menuToggle.className = 'md:hidden fixed top-6 right-6 z-50 bg-accent text-primary p-3 rounded-xl';
        menuToggle.innerHTML = '<i data-feather="menu"></i>';
        document.body.appendChild(menuToggle);
        
        feather.replace();
        
        menuToggle.addEventListener('click', function() {
            const nav = document.querySelector('nav');
            if (nav) {
                nav.classList.toggle('hidden');
                nav.classList.toggle('flex');
                nav.classList.toggle('flex-col');
                nav.classList.toggle('absolute');
                nav.classList.toggle('top-20');
                nav.classList.toggle('left-0');
                nav.classList.toggle('right-0');
                nav.classList.toggle('bg-secondary');
                nav.classList.toggle('p-4');
            }
        });
    }

    // Initialize mobile menu on small screens
    if (window.innerWidth < 768) {
        initMobileMenu();
    }

    // Update year in footer (if needed)
    const yearElement = document.querySelector('#current-year');
    if (yearElement) {
        yearElement.textContent = new Date().getFullYear();
    }

    // Performance monitoring
    window.addEventListener('load', function() {
        const loadTime = window.performance.timing.domContentLoadedEventEnd - window.performance.timing.navigationStart;
        console.log(`Page loaded in ${loadTime}ms`);
    });
});

// Utility functions
const TechForgeUtils = {
    debounce: function(func, wait) {
        let timeout;
        return function executedFunction(...args) {
            const later = () => {
                clearTimeout(timeout);
                func(...args);
            };
            clearTimeout(timeout);
            timeout = setTimeout(later, wait);
        };
    },

    throttle: function(func, limit) {
        let inThrottle;
        return function() {
            const args = arguments;
            const context = this;
            if (!inThrottle) {
                func.apply(context, args);
                inThrottle = true;
                setTimeout(() => inThrottle = false, limit);
            }
        };
    },

    formatBytes: function(bytes, decimals = 2) {
        if (bytes === 0) return '0 Bytes';
        const k = 1024;
        const dm = decimals < 0 ? 0 : decimals;
        const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
        const i = Math.floor(Math.log(bytes) / Math.log(k));
        return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
    }
};

// Export for potential module usage
if (typeof module !== 'undefined' && module.exports) {
    module.exports = TechForgeUtils;
}