let spirals = [];

​

function setup() {

  // Create a canvas with dimensions 800x800

  createCanvas(700, 650);

  // Set the background color to black

  background(0);

}

​

function draw() {

  // Semi-transparent background for a trail effect

  background(0, 25);

  // Loop through all spirals in the array

  for (let i = 0; i < spirals.length; i++) {

    // Update and display each spiral

    spirals[i].update();

    spirals[i].display();

    // Check for collision with other spirals

    for (let j = i + 1; j < spirals.length; j++) {

      if (spirals[i].collidesWith(spirals[j])) {

        // If collision occurs, create a wave between the two spirals

        createWaveBetween(spirals[i], spirals[j]);

      }

    }

  }

}

​

function mouseDragged() {

  // Create a new spiral at the mouse position when dragged

  let newSpiral = new Spiral(mouseX, mouseY);

  spirals.push(newSpiral);

  // Remove the spiral after 5 seconds

  setTimeout(() => {

    spirals.splice(spirals.indexOf(newSpiral), 1);

  }, 20000);

}

​

function mouseClicked() {

  // Check if the mouse is clicked inside any existing spiral

  for (let i = 0; i < spirals.length; i++) {

    if (dist(mouseX, mouseY, spirals[i].pos.x, spirals[i].pos.y) < spirals[i].radius) {

      // If clicked inside a spiral, transform it and revert after 3 seconds

      spirals[i].transform();

      setTimeout(() => {

        spirals[i].revert();

      }, 3000);

    }

  }

}

​

function keyTyped() {

  // Clear the screen when the 'c' key is pressed

  if (key === 'c') {

    clearScreen();

  }

}

​

// Define the Spiral class

class Spiral {

  constructor(x, y) {

    // Initialize position, radius, angle, color, and lifespan

    this.pos = createVector(x, y);

    this.radius = random(5, 20);

    this.angle = 0;

    this.color = color(random(255), random(255), random(255), 100);

    this.transformed = false;

    this.lifespan = 20000; // 5 seconds lifespan

  }

  update() {

    // Update angle and radius over time

    this.angle += 0.05;

    this.radius += 0.5;

    this.lifespan -= deltaTime;

  }

  display() {

    // Display the spiral

    push();

    translate(this.pos.x, this.pos.y);

    stroke(this.color);

    noFill();

    beginShape();

    for (let i = 0; i < this.angle; i += 0.1) {

      let x = this.radius * cos(i);

      let y = this.radius * sin(i);

      vertex(x, y);

    }

    endShape();

    pop();

    // Remove the spiral if its lifespan is over

    if (this.lifespan <= 0) {

      spirals.splice(spirals.indexOf(this), 1);

    }

  }

​

  transform() {

    // Transform the spiral (change color in this case)

    this.transformed = true;

    this.color = color(random(255), random(255), random(255), 100);

  }

​

  revert() {

    // Revert the spiral to its original state

    this.transformed = false;

    this.color = color(random(255), random(255), random(255), 100);

  }

​

  collidesWith(other) {

    // Check if this spiral collides with another spiral

    let d = dist(this.pos.x, this.pos.y, other.pos.x, other.pos.y);

    return d < this.radius + other.radius;

  }

}

​

function createWaveBetween(spiral1, spiral2) {

  // Create a wave between two spirals

  let startX = spiral1.pos.x + spiral1.radius * cos(spiral1.angle);

  let startY = spiral1.pos.y + spiral1.radius * sin(spiral1.angle);

  let endX = spiral2.pos.x + spiral2.radius * cos(spiral2.angle);

  let endY = spiral2.pos.y + spiral2.radius * sin(spiral2.angle);

  let wave = new HorizontalWave(startX, startY, endX, endY);

  wave.display();

}

​

// Define the HorizontalWave class

class HorizontalWave {

  constructor(x1, y1, x2, y2) {

    // Initialize start and end points, amplitude, frequency, color, and lifespan

    this.start = createVector(x1, y1);

    this.end = createVector(x2, y2);

    this.amplitude = 20;

    this.frequency = 0.1;

    this.color = color(255);

    this.lifespan = 5000; // 5 seconds lifespan

  }

  display() {

    // Display the horizontal wave

    push();

    stroke(this.color);

    noFill();

    beginShape();

    for (let x = this.start.x; x < this.end.x; x += 5) {

      let y = this.start.y + this.amplitude * sin(this.frequency * x);

      vertex(x, y);

    }

    endShape();

    pop();

    // Remove the wave after 5 seconds

    if (this.lifespan <= 0) {

      // You might want to implement a way to remove the wave from the array

    }

  }

}

​

function clearScreen() {

  // Clear the screen and reset arrays

  background(0);

  spirals = [];

}

​