if (window.location.href === 'https://my-mc.link' || window.location.href === 'https://my-mc.link/') { const iframe = document.getElementById('ytplayer'); if (iframe) { iframe.onerror = () => { iframe.style.display = 'none'; const img = document.querySelector('.hero-bg img'); if (img) { img.style.display = 'block'; } }; } } window.addEventListener('load', () => { window.scrollTo(0, 0); }); const sections = document.querySelectorAll('.section-bg'); const observer = new IntersectionObserver((entries) => { entries.forEach((entry, index) => { if (entry.isIntersecting) { entry.target.style.transform = 'translateY(0)'; entry.target.style.opacity = '1'; entry.target.style.transitionDelay = `${index * 0.1}s`; } }); }, { threshold: 0.1 }); sections.forEach(section => { section.style.transform = 'translateY(30px)'; section.style.opacity = '0'; section.style.transition = 'transform 0.7s ease-out, opacity 0.7s ease-out'; observer.observe(section); }); particlesJS("particles-js", { "particles": { "number": { "value": 30, "density": { "enable": true, "value_area": 800 } }, "color": { "value": ["#14b8a6", "#3b82f6"] // Mimics gradient by alternating colors }, "shape": { "type": "circle", // Matches border-radius: 50% "stroke": { "width": 0, "color": "#000000" } }, "opacity": { "value": 0.9, // Matches box-shadow opacity "random": true, "anim": { "enable": true, // Mimics fadeInOut animation "speed": 1, // Slower for smooth fade "opacity_min": 0, // Fades to fully transparent "sync": false } }, "size": { "value": 8, // Default size (matches 8px) "random": true, // Allows some particles to be larger (up to 12px) "anim": { "enable": true, "speed": 4, "size_min": 4, // Smaller sizes for variation "sync": false } }, "line_linked": { "enable": false // No lines needed per CSS }, "move": { "enable": true, "speed": 2, // Mimics float animation "direction": "none", "random": true, "straight": false, "out_mode": "out", "bounce": false, "attract": { "enable": false } } }, "interactivity": { "detect_on": "canvas", "events": { "onhover": { "enable": true, "mode": "repulse" }, "onclick": { "enable": true, "mode": "push" }, "resize": true }, "modes": { "repulse": { "distance": 100, "duration": 0.4 }, "push": { "particles_nb": 4 } } }, "retina_detect": true }); // Custom logic for glow effect document.addEventListener('DOMContentLoaded', () => { const pJS = window.pJSDom[0].pJS; const targetElements = document.querySelectorAll('.feature-card, .nav-btn, .btn-minecraft'); // Function to check if a particle is behind or near an element function checkParticleProximity() { targetElements.forEach(element => { const rect = element.getBoundingClientRect(); let hasGlow = false; pJS.particles.array.forEach(particle => { const particleX = particle.x + pJS.canvas.el.offsetLeft; const particleY = particle.y + pJS.canvas.el.offsetTop; const buffer = 20; // Buffer zone around element for glow trigger // Check if particle is within or near the element's bounding box if ( particleX >= rect.left - buffer && particleX <= rect.right + buffer && particleY >= rect.top - buffer && particleY <= rect.bottom + buffer ) { hasGlow = true; } }); // Apply or remove glow effect if (hasGlow) { element.classList.add('glow-effect'); element.classList.remove('no-glow'); } else { element.classList.remove('glow-effect'); element.classList.add('no-glow'); } }); } // Run proximity check in a separate animation loop function animateGlowEffect() { checkParticleProximity(); requestAnimationFrame(animateGlowEffect); } // Start the animation loop animateGlowEffect(); }); function throttle(fn, wait) { let lastTime = 0; return function (...args) { const now = Date.now(); if (now - lastTime >= wait) { fn.apply(this, args); lastTime = now; } }; } if (window.location.href === 'https://my-mc.link' || window.location.href === 'https://my-mc.link/') { const hero = document.querySelector('.hero-bg'); if (hero) { const heroImg = hero.querySelector('img'); if (heroImg) { window.addEventListener( 'scroll', throttle(() => { const scrollPosition = window.pageYOffset; if (heroImg.style.display === 'block') { heroImg.style.transform = `translate(-50%, calc(-50% + ${scrollPosition * 0.3}px)) scale(1.2)`; } }, 16) ); } } } const tiltCards = document.querySelectorAll('.tilt-card'); tiltCards.forEach(card => { card.addEventListener('mousemove', (e) => { const rect = card.getBoundingClientRect(); const x = e.clientX - rect.left; const y = e.clientY - rect.top; const centerX = rect.width / 2; const centerY = rect.height / 2; const tiltX = (y - centerY) / 12; const tiltY = (centerX - x) / 12; card.style.transform = `perspective(1200px) rotateX(${tiltX}deg) rotateY(${tiltY}deg)`; }); card.addEventListener('mouseleave', () => { card.style.transform = 'perspective(1200px) rotateX(0) rotateY(0)'; }); }); const buttons = document.querySelectorAll('.btn-minecraft'); buttons.forEach(button => { button.addEventListener('mousemove', (e) => { const rect = button.getBoundingClientRect(); const x = e.clientX - rect.left; const y = e.clientY - rect.top; button.style.setProperty('--x', `${x}px`); button.style.setProperty('--y', `${y}px`); }); }); // Hamburger Menu Toggle const hamburger = document.querySelector('.hamburger'); const mobileNav = document.querySelector('[data-mobile-nav]'); const navLinks = mobileNav.querySelectorAll('a'); // Debounce function to prevent rapid clicks function debounce(fn, wait) { let timeout; return function (...args) { clearTimeout(timeout); timeout = setTimeout(() => fn.apply(this, args), wait); }; } hamburger.addEventListener('click', debounce(() => { console.log('Hamburger clicked, toggling menu'); mobileNav.classList.toggle('active'); hamburger.classList.toggle('active'); }, 100)); navLinks.forEach(link => { link.addEventListener('click', () => { console.log('Nav link clicked, closing menu'); mobileNav.classList.remove('active'); hamburger.classList.remove('active'); }); }); document.addEventListener('click', (e) => { if (!mobileNav.contains(e.target) && !hamburger.contains(e.target) && mobileNav.classList.contains('active')) { console.log('Clicked outside, closing menu'); mobileNav.classList.remove('active'); hamburger.classList.remove('active'); } });