script.js

// Cosmic Void Navigation - Main Script

document.addEventListener('DOMContentLoaded', () => {
    // Initialize feather icons
    if (typeof feather !== 'undefined') {
        feather.replace();
    }

    // Create star field background
    createStarField();

    // Handle scroll effects
    handleScrollEffects();

    // Mobile menu toggle (delegated to navbar component)
    document.addEventListener('mobile-menu-toggle', (e) => {
        console.log('Mobile menu toggled:', e.detail.open);
    });
});

// Create animated star field
function createStarField() {
    const starContainer = document.createElement('div');
    starContainer.className = 'stars';
    
    const starCount = 100;
    
    for (let i = 0; i < starCount; i++) {
        const star = document.createElement('div');
        star.className = 'star';
        
        // Random position
        star.style.left = `${Math.random() * 100}%`;
        star.style.top = `${Math.random() * 100}%`;
        
        // Random size
        const size = Math.random() * 2 + 1;
        star.style.width = `${size}px`;
        star.style.height = `${size}px`;
        
        // Random animation delay
        star.style.animationDelay = `${Math.random() * 3}s`;
        star.style.animationDuration = `${Math.random() * 3 + 2}s`;
        
        starContainer.appendChild(star);
    }
    
    document.body.appendChild(starContainer);
}

// Handle scroll-based effects
function handleScrollEffects() {
    let lastScroll = 0;
    const navbar = document.querySelector('cosmic-navbar');
    
    window.addEventListener('scroll', () => {
        const currentScroll = window.pageYOffset;
        
        // Dispatch scroll event to navbar
        if (navbar) {
            navbar.dispatchEvent(new CustomEvent('page-scroll', {
                detail: {
                    scrollY: currentScroll,
                    direction: currentScroll > lastScroll ? 'down' : 'up'
                }
            }));
        }
        
        lastScroll = currentScroll;
    }, { passive: true });
}

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

// Utility: Throttle function
function throttle(func, limit) {
    let inThrottle;
    return function executedFunction(...args) {
        if (!inThrottle) {
            func(...args);
            inThrottle = true;
            setTimeout(() => inThrottle = false, limit);
        }
    };
}

// Intersection Observer for reveal animations
const revealObserver = new IntersectionObserver((entries) => {
    entries.forEach(entry => {
        if (entry.isIntersecting) {
            entry.target.classList.add('revealed');
            revealObserver.unobserve(entry.target);
        }
    });
}, {
    threshold: 0.1,
    rootMargin: '0px 0px -50px 0px'
});

// Observe elements with reveal class
document.querySelectorAll('.reveal').forEach(el => {
    revealObserver.observe(el);
});