TheGreatUnknown/UniversalSymbolicAI

1document.addEventListener('DOMContentLoaded', function() {2    // Initialize GSAP animations3    initAnimations();4    5    // Add particles to quantum sphere6    createParticles();7    8    // Smooth scrolling for navigation links9    initSmoothScroll();10    11    // Add form submission handler12    initFormHandler();13});14 15/* @tweakable number of particles in the quantum sphere visualization */16const particleCount = 15;17 18/* @tweakable primary glow color (matches CSS variable) */19const primaryGlowColor = '#7400e0';20 21/* @tweakable secondary glow color (matches CSS variable) */22const secondaryGlowColor = '#00d4ff';23 24/* @tweakable particle size range */25const particleSizeRange = {min: 3, max: 8};26 27function initAnimations() {28    // Animate tech cards on scroll29    gsap.from('.tech-card', {30        scrollTrigger: {31            trigger: '.technology',32            start: 'top 80%',33        },34        y: 50,35        opacity: 0,36        duration: 0.8,37        stagger: 0.2,38        ease: 'power3.out'39    });40    41    // Animate use cases on scroll42    gsap.from('.use-case', {43        scrollTrigger: {44            trigger: '.use-cases',45            start: 'top 80%',46        },47        y: 30,48        opacity: 0,49        duration: 0.6,50        stagger: 0.15,51        ease: 'power2.out'52    });53    54    // Animate goals on scroll55    gsap.from('.goal', {56        scrollTrigger: {57            trigger: '.goals',58            start: 'top 80%',59        },60        scale: 0.9,61        opacity: 0,62        duration: 0.7,63        stagger: 0.2,64        ease: 'back.out(1.5)'65    });66}67 68function createParticles() {69    const particles = document.querySelector('.particles');70    71    for (let i = 0; i < particleCount; i++) {72        const particle = document.createElement('div');73        particle.classList.add('particle');74        75        // Random size76        const size = Math.random() * (particleSizeRange.max - particleSizeRange.min) + particleSizeRange.min;77        78        // Random position79        const posX = Math.random() * 100;80        const posY = Math.random() * 100;81        82        // Random color (between primary and secondary glow)83        const color = i % 2 === 0 ? primaryGlowColor : secondaryGlowColor;84        85        // Set particle styles86        particle.style.cssText = `87            position: absolute;88            width: ${size}px;89            height: ${size}px;90            background: ${color};91            border-radius: 50%;92            top: ${posY}%;93            left: ${posX}%;94            box-shadow: 0 0 ${size * 2}px ${color};95            opacity: ${Math.random() * 0.5 + 0.3};96            animation: particle-float ${Math.random() * 4 + 3}s ease-in-out infinite alternate-reverse;97        `;98        99        // Add to container100        particles.appendChild(particle);101    }102}103 104function initSmoothScroll() {105    document.querySelectorAll('a[href^="#"]').forEach(anchor => {106        anchor.addEventListener('click', function(e) {107            e.preventDefault();108            109            const targetId = this.getAttribute('href');110            const targetElement = document.querySelector(targetId);111            112            if (targetElement) {113                window.scrollTo({114                    top: targetElement.offsetTop - 100,115                    behavior: 'smooth'116                });117            }118        });119    });120}121 122function initFormHandler() {123    const contactForm = document.querySelector('.contact-form form');124    125    if (contactForm) {126        contactForm.addEventListener('submit', function(e) {127            e.preventDefault();128            129            // Get form values130            const name = document.getElementById('name').value;131            const email = document.getElementById('email').value;132            const interest = document.getElementById('interest').value;133            const message = document.getElementById('message').value;134            135            // In a real application, you would send this data to your server136            console.log('Form submitted:', { name, email, interest, message });137            138            // Show success message139            alert('Thank you for your interest! We will get back to you soon.');140            141            // Reset form142            contactForm.reset();143        });144    }145}146 147// Add window resize handler for mobile optimization148window.addEventListener('resize', function() {149    // This could be used to adjust animations or layouts based on window size150    if (window.innerWidth < 768) {151        // Mobile optimizations152    }153});154 155