From c501e891ff7380335b74a5b3beb5d91c4c4b5dff Mon Sep 17 00:00:00 2001 From: black Date: Mon, 11 Dec 2023 23:07:44 +0600 Subject: [PATCH] automation compleated --- main.js | 52 ++++++++++++++++++++++++++++++---------------------- 1 file changed, 30 insertions(+), 22 deletions(-) diff --git a/main.js b/main.js index 6b2c3f7..f22917c 100644 --- a/main.js +++ b/main.js @@ -26,8 +26,8 @@ window.onload = () => { context.fill(); const mouse = { - x: 0, - y: 0, + x: 20, + y: 20, }; canvas.ontouchmove = (e) => { @@ -48,16 +48,16 @@ window.onload = () => { class Perticle { constructor() { - this.x = mouse.x; - this.y = mouse.y; - this.size = Math.random() * 7 + 1; - this.speedX = Math.random() * 5 - 2.5; - this.speedY = Math.random() * 5 - 2.5; - this.fillStyle = `hsl(${hue},100%,50%)`; + this.x = Math.abs(mouse.x); + this.y = Math.abs(mouse.y); + this.size = Math.random() * 3 + 1; + this.dx = Math.random() * 5 - 2.5; + this.dy = Math.random() * 5 - 2.5; + this.fillStyle = `hsl(${hue},100%,40%)`; } update() { - this.x += this.speedX; - this.y += this.speedY; + this.x += this.dx; + this.y += this.dy; if (this.size > 0.2) this.size -= 0.1; } draw() { @@ -69,7 +69,7 @@ window.onload = () => { } const init = () => { - for (let i = 0; i < 50; i++) { + for (let i = 0; i < 60; i++) { perticlesArray.push(new Perticle()); } }; @@ -100,19 +100,27 @@ window.onload = () => { }; animate(); - setInterval(() => { - const speed = 10; - - if (mouse.x > canvas.width || Math.abs(mouse.x) < 1) { - mouse.x += speed; + const variant = () => { + const speed = 5; + if (mouse.x > canvas.width) { + mouse.x = -mouse.x; } - - if (mouse.y < canvas.height) { - mouse.y += speed; - } else { + if (mouse.y > canvas.height) { mouse.y = -mouse.y; } - + mouse.x += speed; + mouse.y += speed; init(); - }, 1); + + requestAnimationFrame(variant); + }; + + variant(); + + /* + setInterval(() => { + mouse.x = Math.random() * canvas.width + mouse.y = Math.random() * canvas.height + }, 1000); + */ };