89 lines, no comments ยท 3,677 tokens, written in 16 seconds for $0.033


 1  let particles = [];
 2  const numParticles = 800;
 3  let noiseScale = 0.005;
 4  let zOffset = 0;
 5  
 6  function setup() {
 7    createCanvas(windowWidth, windowHeight);
 8    colorMode(HSB, 360, 100, 100, 100);
 9    for (let i = 0; i < numParticles; i++) {
10      particles.push(new Particle());
11    }
12    background(220, 80, 10, 100);
13  }
14  
15  function draw() {
16    fill(220, 80, 10, 8);
17    noStroke();
18    rect(0, 0, width, height);
19    
20    zOffset += 0.003;
21    
22    for (let p of particles) {
23      p.update();
24      p.follow();
25      p.edges();
26      p.show();
27    }
28  }
29  
30  class Particle {
31    constructor() {
32      this.pos = createVector(random(width), random(height));
33      this.vel = createVector(0, 0);
34      this.acc = createVector(0, 0);
35      this.maxSpeed = random(2, 5);
36      this.prevPos = this.pos.copy();
37      this.hue = random(180, 320);
38    }
39    
40    update() {
41      this.prevPos.set(this.pos);
42      this.vel.add(this.acc);
43      this.vel.limit(this.maxSpeed);
44      this.pos.add(this.vel);
45      this.acc.mult(0);
46    }
47    
48    follow() {
49      let angle = noise(this.pos.x * noiseScale, this.pos.y * noiseScale, zOffset) * TWO_PI * 2;
50      let force = p5.Vector.fromAngle(angle);
51      force.setMag(0.5);
52      this.applyForce(force);
53      
54      if (mouseIsPressed) {
55        let mouseForce = createVector(mouseX, mouseY);
56        mouseForce.sub(this.pos);
57        let dist = mouseForce.mag();
58        if (dist < 150) {
59          mouseForce.setMag(0.8);
60          mouseForce.mult(-1);
61          this.applyForce(mouseForce);
62        }
63      }
64    }
65    
66    applyForce(force) {
67      this.acc.add(force);
68    }
69    
70    edges() {
71      if (this.pos.x < 0 || this.pos.x > width || this.pos.y < 0 || this.pos.y > height) {
72        this.pos.set(random(width), random(height));
73        this.prevPos.set(this.pos);
74      }
75    }
76    
77    show() {
78      let speed = this.vel.mag();
79      let currentHue = map(speed, 0, this.maxSpeed, this.hue, this.hue + 40) % 360;
80      stroke(currentHue, 80, 100, 50);
81      strokeWeight(1.5);
82      line(this.pos.x, this.pos.y, this.prevPos.x, this.prevPos.y);
83    }
84  }
85  
86  function windowResized() {
87    resizeCanvas(windowWidth, windowHeight);
88    background(220, 80, 10, 100);
89  }