GabiZar/Images-Scrapper-JS
1
0
Fork 0
mirror of https://github.com/Gabi-Zar/Images-Scrapper-JS.git synced 2026-04-17 05:36:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

Improve stars canvas

Browse Source
This commit is contained in:
GabiZar
2026-03-05 22:26:30 +01:00
parent ff702d74aa
commit 33c1ea317a
2 changed files with 8 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
public/script.js
View File

@@ -28,7 +28,7 @@ function starsCanvas(number) {
const stars = []; const stars = [];
for (let i = 0; i < number; i++) { for (let i = 0; i < number; i++) {
stars.push(makeStar()); stars.push(makeStar(10000));
} }
function animate() { function animate() {
@@ -43,7 +43,7 @@ function starsCanvas(number) {
const velocity = Math.sqrt(stars[i].dx ** 2 + stars[i].dy ** 2); const velocity = Math.sqrt(stars[i].dx ** 2 + stars[i].dy ** 2);
stars[i].radius *= 1 + 0.001 * velocity; stars[i].radius *= 1 + 0.002 * velocity;
stars[i].position.x += stars[i].dx; stars[i].position.x += stars[i].dx;
stars[i].position.y += stars[i].dy; stars[i].position.y += stars[i].dy;
stars[i].dx *= 1 + 0.002 * velocity; stars[i].dx *= 1 + 0.002 * velocity;
@@ -61,19 +61,19 @@ function starsCanvas(number) {
requestAnimationFrame(animate); requestAnimationFrame(animate);
} }
function makeStar() { function makeStar(initialTime = 0) {
const angle = Math.random() * 2 * Math.PI; const angle = Math.random() * 2 * Math.PI;
const speed = Math.random() * 0.1 + 0.05; const speed = Math.random() * 0.2 + 0.05;
const initialTime = Math.random() * 5000; initialTime = Math.random() * initialTime;
const dx = Math.cos(angle) * speed; const dx = Math.cos(angle) * speed;
const dy = Math.sin(angle) * speed; const dy = Math.sin(angle) * speed;
const star = { const star = {
position: { x: centerX + dx * initialTime, y: centerY + dy * initialTime }, position: { x: centerX + dx * initialTime, y: centerY + dy * initialTime },
radius: Math.random() * 3, radius: Math.random() * 0.5 + 0.0001 * initialTime,
dx: dx, dx: dx,
dy: dy, dy: dy,
color: 0, color: 100 + 0.01 * initialTime,
}; };
return star; return star;

2
public/style.css
View File

@@ -85,7 +85,7 @@ body {
z-index: 0; z-index: 0;
overflow: auto; overflow: auto;
backdrop-filter: blur(6px); backdrop-filter: blur(3px);
} }
.horizontal-div { .horizontal-div {