let sounds = [];

// Number of samples to load

let NUM = 7;

let R;

let CENTER;

let FULL_CIRCLE = 360;

let a = 0;

let ASPEED = 10;

let playMetro = false;

​

// Beats

let voices = [];

let metronome;

​

function preload() {

  // Load all the sounds

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

    sounds.push(loadSound("data/" + i + ".mp3"));

  }

}

​

function setup() {

  frameRate(30);

  createCanvas(windowWidth, windowHeight);

  R = width / 2;

  CENTER = {

    x: width / 2,

    y: height / 2

  };

  angleMode(DEGREES);

​

  // Make a regular set of beats, beat every 60 frames

  let beats = [];

  for (let i = 0; i < FULL_CIRCLE; i += 60) beats.push(i);

  // Regular beat voice (can turn on/off with keypress)

  metronome = new Voice(sounds[4], beats, 0.01, 'gold'),

​

​

    // Makes voices with following parameters:

    // soundfile, array of beats, max random rotation speed, color

    voices = [

      new Voice(sounds[0], [0, 180], 0, 'red'),

      new Voice(sounds[1], [0, 120, 240], 0, 'cadetblue'),

​

      // new Voice(sounds[0], [5, 87, 136, 214, 270], 1, 'red'),

      // new Voice(sounds[1], [60, 120, 180, 240], 0.1, 'cadetblue'),

      // new Voice(sounds[2], [17, 46], 0.5, 'yellowgreen'),

      // new Voice(sounds[2], [17, 46], 0.5, 'yellowgreen'),

      // new Voice(sounds[3], [192], 1, 'purple'),

      // new Voice(sounds[5], [60, 240, 330], 0.1, 'turquoise'),

      // new Voice(sounds[6], [20], 0.1, 'deeppink'),

    ]

}

​

function draw() {

  background(255);

  // Instructions

  text("Press any key to toggle metronome.", 20, 20);

​

  // Move the playhead (in DEGREES, not radians)

  a += ASPEED;

  // Reset everything when the playhead crosses 360->0 threshold

  if (a >= 360) {

    for (let voice of voices) {

      voice.reset();

    }

  }

  // Wrap around

  a %= FULL_CIRCLE;

​

  // Run the voices

  translate(CENTER.x, CENTER.y);

  for (let voice of voices) {

    // Skip over last voice until you want to play it

    voice.play(a);

    voice.display();

  }

​

  // Play metronome if on

  if (playMetro) {

    metronome.play(a);

    metronome.display();

  }

​

  // Display circle

  noFill();

  stroke('black');

  ellipse(0, 0, R * 2, R * 2);

  // Display playhead

  noStroke();

  fill('black');

  let x = cos(a) * R;

  let y = sin(a) * R;

  ellipse(x, y, 20, 20);

}

​

function keyPressed() {

  playMetro = !playMetro;

}