AI Boids Flocking - Emergent Swarm Intelligence Watch 100 birds flock together using Craig Reynolds

function setup() {
  createCanvas(windowWidth, windowHeight);

  // Use HSB so we can map heading → hue easily
  colorMode(HSB, 360, 100, 100, 100);
  background(0); // solid black to start

  // Create initial flock
  for (let i = 0; i < NUM_BOIDS; i++) {
    boids.push(new Boid(random(width), random(height)));
  }
}

function draw() {
  // Draw a translucent background for fading trails
  // (alpha = 20/100 → about 20% opaque, 80% previous frame visible)
  background(0, 0, 0, 20);

  // Optional: visualize predator (mouse) as a faint circle
  noFill();
  stroke(0, 0, 100, 30); // light, semi-transparent
  strokeWeight(2);
  circle(mouseX, mouseY, 80);

  // Update and render boids
  for (let boid of boids) {
    boid.flock(boids);
    boid.update();
    boid.edges();
    boid.show();
  }
}

function windowResized() {
  resizeCanvas(windowWidth, windowHeight);
  background(0); // reset background on resize
}

constructor(x, y) {
    this.position = createVector(x, y);

    // Start with random direction & speed
    const angle = random(TWO_PI);
    const speed = random(1.5, 3.0);
    this.velocity = p5.Vector.fromAngle(angle).mult(speed);

    this.acceleration = createVector(0, 0);

    this.maxSpeed = 3.0;
    this.maxForce = 0.08; // max steering force

    this.size = 5; // use for triangle size and edge wrapping
  }

flock(boids) {
    const alignment = this.align(boids);
    const cohesion = this.cohesion(boids);
    const separation = this.separation(boids);
    const avoidPredator = this.fleePredator();

    // Weights for each behavior
    alignment.mult(1.0);
    cohesion.mult(0.8);
    separation.mult(1.5);
    avoidPredator.mult(2.0);

    this.acceleration.add(alignment);
    this.acceleration.add(cohesion);
    this.acceleration.add(separation);
    this.acceleration.add(avoidPredator);
  }

update() {
    // Integrate acceleration into velocity and position
    this.velocity.add(this.acceleration);
    this.velocity.limit(this.maxSpeed);
    this.position.add(this.velocity);

    // Reset acceleration each frame
    this.acceleration.mult(0);
  }

edges() {
    const margin = this.size * 2;

    if (this.position.x > width + margin) this.position.x = -margin;
    if (this.position.x < -margin) this.position.x = width + margin;
    if (this.position.y > height + margin) this.position.y = -margin;
    if (this.position.y < -margin) this.position.y = height + margin;
  }

align(boids) {
    const perceptionRadius = 70;
    const steering = createVector(0, 0);
    let total = 0;

    for (let other of boids) {
      const d = p5.Vector.dist(this.position, other.position);
      if (other !== this && d < perceptionRadius) {
        steering.add(other.velocity);
        total++;
      }
    }

    if (total > 0) {
      steering.div(total);
      steering.setMag(this.maxSpeed);
      steering.sub(this.velocity);
      steering.limit(this.maxForce);
    }

    return steering;
  }

cohesion(boids) {
    const perceptionRadius = 70;
    const steering = createVector(0, 0);
    let total = 0;

    for (let other of boids) {
      const d = p5.Vector.dist(this.position, other.position);
      if (other !== this && d < perceptionRadius) {
        steering.add(other.position);
        total++;
      }
    }

    if (total > 0) {
      steering.div(total);
      // Steer toward that center point
      steering.sub(this.position);
      steering.setMag(this.maxSpeed);
      steering.sub(this.velocity);
      steering.limit(this.maxForce);
    }

    return steering;
  }

separation(boids) {
    const desiredSeparation = 25;
    const steering = createVector(0, 0);
    let total = 0;

    for (let other of boids) {
      const d = p5.Vector.dist(this.position, other.position);
      if (other !== this && d < desiredSeparation) {
        let diff = p5.Vector.sub(this.position, other.position);
        // Stronger repulsion when very close
        diff.div(d * d || 1); // avoid division by zero
        steering.add(diff);
        total++;
      }
    }

    if (total > 0) {
      steering.div(total);
      steering.setMag(this.maxSpeed);
      steering.sub(this.velocity);
      steering.limit(this.maxForce * 1.5);
    }

    return steering;
  }

fleePredator() {
    const predatorPos = createVector(mouseX, mouseY);
    const d = p5.Vector.dist(this.position, predatorPos);
    const threatRadius = 120;

    if (d < threatRadius) {
      let flee = p5.Vector.sub(this.position, predatorPos);
      flee.setMag(this.maxSpeed);

      flee.sub(this.velocity);
      flee.limit(this.maxForce * 3.0);

      // Stronger when closer to the predator
      const scale = map(d, 0, threatRadius, 2.0, 0.3);
      flee.mult(scale);

      return flee;
    }

    return createVector(0, 0);
  }

show() {
    const theta = this.velocity.heading();

    // Map direction (-PI..PI) to hue (0..360)
    const hueVal = map(theta, -PI, PI, 0, 360);

    push();
    translate(this.position.x, this.position.y);
    rotate(theta);

    // Gradient-like effect via HSB hue based on direction
    fill(hueVal, 80, 100, 80);   // colorful body
    stroke(hueVal, 80, 100, 100); // matching outline
    strokeWeight(1.3);

    // Triangle pointing in direction of motion (nose to the right)
    beginShape();
    vertex(this.size * 2, 0);         // nose
    vertex(-this.size, this.size);    // back bottom
    vertex(-this.size, -this.size);   // back top
    endShape(CLOSE);

    pop();
  }