var kit = new Tone.Players({

  "synth": "synth.wav",

  "hh":"hihat.wav",

  "kick":"kick.wav"

});

​

var playButton;

​

kit.toMaster();

​

Tone.Transport.bpm.value = 60;

​

Tone.Transport.scheduleRepeat(playRhythm1, '8n');

Tone.Transport.start();

​

var beat;

​

​

function setup() {

  slider = createSlider(20, 240, 20, 20);

  slider.position(25, 20);

  slider.value(Tone.Transport.bpm.value);

  slider.input(updateBPM);

  createCanvas(550, 500);

  strokeWeight(0);

  playButton = createButton('press space to pause');

  playButton.position(20, 465);

  playButton.mouseClicked(togglePlay);

​

}

​

​

​

function playRhythm1(time) {

  beat = Tone.Transport.position.split(":")[1];

  if (kit.loaded) {

    kit.get("hh").start(time);

​

    if(beat == 0, 1, 2, 3){

      fill("cyan");

    } 

    }

}

​

function playRhythm2(time) {

  beat = Tone.Transport.position.split(":")[1];

  if (kit.loaded) {

    kit.get("kick").start(time);

    if(beat == 0, 1, 2, 3){

            fill("magenta");

} 

  }

}

​

function playRhythm3(time) {

  beat = Tone.Transport.position.split(":")[1];

  if (kit.loaded) {

    kit.get("synth").start(time);

​

    if(beat == 0, 1, 2, 3){

            fill("yellow");     

        }

  }

}

​

let value = 0;

​

​

function keyPressed() {

let x = 1

if ((keyIsPressed == true) && (key == 'a')){  

    fill('magenta')

    Tone.Transport.scheduleRepeat(playRhythm2, '2n');

​

  } else if (keyCode === 83) {

    fill('yellow');

    Tone.Transport.scheduleRepeat(playRhythm3, '4n');

​

  } else if (keyCode === 68) {

    fill('cyan');

    Tone.Transport.scheduleRepeat(playRhythm1, '8n');

  } else if (keyCode === 32) {

    togglePlay();

  } else {   stroke(0);

  noFill();

  }

  return false;

}

​

function drawWords(x) {

​

noStroke(0);

  textFont('futura');

  textSize('10px');

  fill('rgb(181, 9, 104)');

  let a = text('A = KICK', x, 130);

  fill('rgb(194, 194, 14)');

  let s =  text('S = SYNTH', x, 245);

  fill('rgb(20, 170, 181)');

  let dd = text('D = HIHAT', x, 375);

  noFill();

}

​

​

function updateBPM(){

     Tone.Transport.bpm.rampTo(slider.value()); 

}

​

​

function togglePlay(){

  if (Tone.Transport.state == "started"){

        Tone.Transport.stop();

      playButton.html('paused');

  } else {

    if(kit.loaded){

        Tone.Transport.start();

        playButton.html('playing');

    }

  }

}

​

​

function draw() {

​

  const b = slider.value();

  const c = (b-250)*.5;

  //const d = -(c)*;

  // print(d);

  background('white');

  ellipse(mouseX, mouseY , c, c)*2;

  textAlign(LEFT);

  drawWords(25);

​

​

​

}

​

​

​

​

​