//click reset to restart everything

​

let lines = [];

let sound, amplitude, cnv;

​

​

function setup() {

  cnv = createCanvas(600, 400);

  amplitude = new p5.Amplitude();

  cnv.mouseClicked(function() {

    if (song.isPlaying()) {

      song.stop();

    } else {

      song.play();

    }

  });

  resetSketch();

  let button = createButton("reset");

  button.mousePressed(resetSketch);

}

​

function resetSketch() {

  for (let i = 0; i < 1; i++) {

    lines[i] = new Line(width, height, 20);

    lines[i].show();

    background(0);

  }

}

​

function draw() {

  stroke(0);

  //stroke(164, 156, 147, 90);

  strokeWeight(1);

  noFill();

  let level = amplitude.getLevel();

  let size = map(level, 0, -1, 10, 900);

  ellipse(width / 2, height / 2, size, size);

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

    lines[i].show();

  }

}

​

function preload() {

  font = loadFont('TurretRoad-Bold.ttf');

  song = loadSound('SF2.wav');

}

​

​

​

class Line {

  constructor(x, y, r) {

    this.x = x;

    this.y = y;

    this.r = r;

    this.angle = 0;

    this.spin = 0.1;

    this.grow = this.spin * 5;

  }

  show() {

​

    this.angle += this.spin;

    this.r = this.r + this.grow;

    this.x = cos(this.angle) * this.r; // add level here or play with pitch 

    this.y = sin(this.angle) * this.r;

    translate(width / 2, height / 2);

    //stroke(164, 156, 147, 90);

    stroke(156, random(125), random(89));

    strokeWeight(1);

    let level = amplitude.getLevel();

    let size = map(level, 0, 1, 0, 900);

    line(0, 0, random(this.x), random(this.y));

  }

}