Coming Soon
New WordPress website is being built and will be published soon
document.addEventListener("DOMContentLoaded", () => { const rippleSettings = { maxSize: 100, animationSpeed: 5, strokeColor: [148, 217, 255], }; const canvas = document.getElementById("ripple-canvas"); if (!canvas) return; // safety check if not on page const ctx = canvas.getContext("2d"); let ripples = []; function resizeCanvas() { canvas.width = canvas.offsetWidth; canvas.height = canvas.offsetHeight; } resizeCanvas(); window.addEventListener("resize", resizeCanvas); canvas.addEventListener("mousemove", (e) => { const rect = canvas.getBoundingClientRect(); ripples.push({ x: e.clientX - rect.left, y: e.clientY - rect.top, size: 0, }); }); function draw() { ctx.clearRect(0, 0, canvas.width, canvas.height); ripples.forEach((ripple, i) => { ctx.beginPath(); ctx.arc(ripple.x, ripple.y, ripple.size, 0, 2 * Math.PI); ctx.strokeStyle = `rgba(${rippleSettings.strokeColor.join(",")}, ${ 1 - ripple.size / rippleSettings.maxSize })`; ctx.lineWidth = 2; ctx.stroke(); ripple.size += rippleSettings.animationSpeed; if (ripple.size > rippleSettings.maxSize) ripples.splice(i, 1); }); requestAnimationFrame(draw); } draw(); });
