Evolución en proceso

Estamos creando algo nuevo.

Nuestro sitio se encuentra temporalmente en mantenimiento. Estamos trabajando en una nueva experiencia digital y volveremos a estar disponibles muy pronto.

Sistema en actualización

Gracias por tu paciencia

/* * Año automático */ document.getElementById("year").textContent = new Date().getFullYear(); /* * Luz que sigue al cursor */ const cursorLight = document.getElementById("cursorLight"); window.addEventListener("mousemove", function (event) { cursorLight.style.left = event.clientX + "px"; cursorLight.style.top = event.clientY + "px"; }); window.addEventListener("mouseleave", function () { cursorLight.style.opacity = "0"; }); window.addEventListener("mouseenter", function () { cursorLight.style.opacity = "1"; }); /* * Partículas animadas */ const canvas = document.getElementById("particles"); const context = canvas.getContext("2d"); let particles = []; let mouse = { x: null, y: null }; const settings = { particleCountDesktop: 75, particleCountMobile: 38, connectionDistance: 125, mouseDistance: 160 }; function resizeCanvas() { const pixelRatio = Math.min(window.devicePixelRatio || 1, 2); canvas.width = window.innerWidth * pixelRatio; canvas.height = window.innerHeight * pixelRatio; canvas.style.width = window.innerWidth + "px"; canvas.style.height = window.innerHeight + "px"; context.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0); createParticles(); } class Particle { constructor() { this.reset(); } reset() { this.x = Math.random() * window.innerWidth; this.y = Math.random() * window.innerHeight; this.size = Math.random() * 1.6 + 0.35; this.velocityX = (Math.random() - 0.5) * 0.34; this.velocityY = (Math.random() - 0.5) * 0.34; this.opacity = Math.random() * 0.55 + 0.18; } update() { this.x += this.velocityX; this.y += this.velocityY; if (this.x < -10) { this.x = window.innerWidth + 10; } if (this.x > window.innerWidth + 10) { this.x = -10; } if (this.y < -10) { this.y = window.innerHeight + 10; } if (this.y > window.innerHeight + 10) { this.y = -10; } if (mouse.x !== null && mouse.y !== null) { const distanceX = mouse.x - this.x; const distanceY = mouse.y - this.y; const distance = Math.sqrt( distanceX * distanceX + distanceY * distanceY ); if ( distance > 0 && distance < settings.mouseDistance ) { const force = ( settings.mouseDistance - distance ) / settings.mouseDistance; this.x -= (distanceX / distance) * force * 0.65; this.y -= (distanceY / distance) * force * 0.65; } } } draw() { context.beginPath(); context.arc( this.x, this.y, this.size, 0, Math.PI * 2 ); context.fillStyle = "rgba(160, 226, 255, " + this.opacity + ")"; context.fill(); } } function createParticles() { particles = []; const count = window.innerWidth < 700 ? settings.particleCountMobile : settings.particleCountDesktop; for (let index = 0; index < count; index++) { particles.push(new Particle()); } } function connectParticles() { for ( let firstIndex = 0; firstIndex < particles.length; firstIndex++ ) { for ( let secondIndex = firstIndex + 1; secondIndex < particles.length; secondIndex++ ) { const distanceX = particles[firstIndex].x - particles[secondIndex].x; const distanceY = particles[firstIndex].y - particles[secondIndex].y; const distance = Math.sqrt( distanceX * distanceX + distanceY * distanceY ); if (distance < settings.connectionDistance) { const opacity = 1 - distance / settings.connectionDistance; context.beginPath(); context.strokeStyle = "rgba(84, 230, 255, " + opacity * 0.09 + ")"; context.lineWidth = 0.6; context.moveTo( particles[firstIndex].x, particles[firstIndex].y ); context.lineTo( particles[secondIndex].x, particles[secondIndex].y ); context.stroke(); } } } } function animateParticles() { context.clearRect( 0, 0, window.innerWidth, window.innerHeight ); particles.forEach(function (particle) { particle.update(); particle.draw(); }); connectParticles(); window.requestAnimationFrame(animateParticles); } window.addEventListener("mousemove", function (event) { mouse.x = event.clientX; mouse.y = event.clientY; }); window.addEventListener("mouseleave", function () { mouse.x = null; mouse.y = null; }); window.addEventListener("resize", resizeCanvas); resizeCanvas(); animateParticles();