Hugging Face's logo

Spaces:
MakiAi
/
Cosmic-Particles-Sim-gpt4-5
Running

App Files Community
MakiAi commited on
Commit
0e464db
·
verified ·
1 Parent(s): 6e2272b

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +33 -99
index.html CHANGED
@@ -10,129 +10,63 @@
10
  </head>
11
  <body style="margin:0; overflow:hidden;">
12
  <script>
13
- let particles = [];
14
- let sphereRadius = 250;
15
- let pulseTimer = 0;
16
- let renderingMode = 0;
17
 
18
- function setup() {
19
- createCanvas(windowWidth, windowHeight, WEBGL);
20
- setAttributes('alpha', true);
21
- easycam = createEasyCam({ distance: 600 });
22
 
23
- for (let i = 0; i < 100; i++) {
24
- particles.push(new Particle());
 
 
25
  }
26
  }
27
 
28
  function draw() {
29
- background(0);
30
- rotateY(frameCount * 0.001);
31
- rotateX(frameCount * 0.0005);
32
-
33
- noFill();
34
- stroke(255, 50);
35
- strokeWeight(1);
36
- push();
37
- sphere(sphereRadius);
38
- pop();
39
-
40
- for (let p of particles) {
41
- p.update();
42
- p.display();
43
- }
44
-
45
- if (pulseTimer > 0) pulseTimer--;
46
- if (random() < 0.005) pulseTimer = 60;
47
- }
48
-
49
- function mousePressed() {
50
- for (let p of particles) {
51
- p.applyEnergyBurst();
52
  }
53
  }
54
 
55
- function keyPressed() {
56
- renderingMode = (renderingMode + 1) % 3;
57
- }
58
-
59
- class Particle {
60
  constructor() {
61
- this.pos = p5.Vector.random3D().mult(random(sphereRadius * 0.5));
62
- this.vel = p5.Vector.random3D().mult(0.5);
63
- this.trail = [];
64
  }
65
 
66
  update() {
67
- this.pos.add(this.vel);
68
 
69
- for (let other of particles) {
70
- if (other !== this) {
71
- let d = p5.Vector.dist(this.pos, other.pos);
72
- if (d < 50 && d > 1) {
73
- let attraction = p5.Vector.sub(other.pos, this.pos).normalize().mult(0.01);
74
- this.vel.add(attraction);
75
- }
76
- }
77
- }
78
 
79
- if (this.pos.mag() > sphereRadius) {
80
- let bounce = this.pos.copy().normalize().mult(-1);
81
- this.vel.reflect(bounce);
82
- }
83
 
84
- if (pulseTimer > 0 && random() < 0.05) {
85
- this.vel.add(p5.Vector.random3D().mult(2));
 
86
  }
87
-
88
- this.trail.push(this.pos.copy());
89
- if (this.trail.length > 50) {
90
- this.trail.shift();
91
  }
92
  }
93
 
94
- applyEnergyBurst() {
95
- this.vel.add(p5.Vector.random3D().mult(3));
96
- }
97
-
98
- display() {
99
  noStroke();
100
-
101
- if (renderingMode === 0) {
102
- fill(100 + sin(frameCount * 0.01) * 155, 200, 255, 200);
103
- sphereDetail(4);
104
- push();
105
- translate(this.pos.x, this.pos.y, this.pos.z);
106
- sphere(4);
107
- pop();
108
- } else if (renderingMode === 1) {
109
- stroke(100 + cos(frameCount * 0.01) * 155, 100, 255, 200);
110
- strokeWeight(2);
111
- point(this.pos.x, this.pos.y, this.pos.z);
112
- } else {
113
- stroke(255, 255, 255, 100);
114
- strokeWeight(1);
115
- noFill();
116
- push();
117
- translate(this.pos.x, this.pos.y, this.pos.z);
118
- box(5);
119
- pop();
120
- }
121
-
122
- beginShape();
123
- noFill();
124
- for (let i = 0; i < this.trail.length; i++) {
125
- let pos = this.trail[i];
126
- stroke(100 + i * 3, 150 + i, 255 - i * 5, i * 5);
127
- vertex(pos.x, pos.y, pos.z);
128
- }
129
- endShape();
130
  }
131
  }
132
 
133
- function windowResized() {
134
- resizeCanvas(windowWidth, windowHeight);
135
- }
136
  </script>
137
  </body>
138
  </html>
 
10
  </head>
11
  <body style="margin:0; overflow:hidden;">
12
  <script>
 
 
 
 
13
 
14
+ let fish = [];
15
+ const numFish = 300;
 
 
16
 
17
+ function setup() {
18
+ createCanvas(800, 600);
19
+ for (let i = 0; i < numFish; i++) {
20
+ fish.push(new Fish());
21
  }
22
  }
23
 
24
  function draw() {
25
+ background(10, 50, 100);
26
+
27
+ for (let f of fish) {
28
+ f.update();
29
+ f.show();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
30
  }
31
  }
32
 
33
+ class Fish {
 
 
 
 
34
  constructor() {
35
+ this.position = createVector(random(width), random(height));
36
+ this.angle = random(TWO_PI);
37
+ this.speed = random(1, 2);
38
  }
39
 
40
  update() {
41
+ this.angle += random(-0.03, 0.03);
42
 
43
+ let vx = cos(this.angle) * this.speed;
44
+ let vy = sin(this.angle) * this.speed;
 
 
 
 
 
 
 
45
 
46
+ this.position.x += vx;
47
+ this.position.y += vy;
 
 
48
 
49
+ let margin = 50;
50
+ if (this.position.x < margin || this.position.x > width - margin) {
51
+ this.angle = PI - this.angle;
52
  }
53
+ if (this.position.y < margin || this.position.y > height - margin) {
54
+ this.angle = -this.angle;
 
 
55
  }
56
  }
57
 
58
+ show() {
59
+ push();
60
+ translate(this.position.x, this.position.y);
61
+ rotate(this.angle);
62
+ fill(200, 150, 50);
63
  noStroke();
64
+ ellipse(0, 0, 8, 4);
65
+ pop();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
66
  }
67
  }
68
 
69
+
 
 
70
  </script>
71
  </body>
72
  </html>