var piano;

var tone3;

let i = 0;

​

function preload() {

  tone = loadSound("piano.wav");

  piano = loadSound("piano.mp3");

  tone3 = loadSound("tone3.wav");

}

​

function setup() {

​

  createCanvas(400, 200);

  drawBgd();

  drawKey();

​

​

}

​

​

​

function draw() {

​

​

​

​

​

​

​

​

}

​

function drawBgd() {

​

​

  background(220);

​

  fill(0);

  rect(0, 0, 300, 50);

​

  noFill();

  rect(0, 0, 300, 200);

  //   rect(i,50,50,200);

​

  //   fill(0);

  //   rect(i + 15, 50, 18,100);

  //   line(i + 25,50,i + 25,200);

  circle(360, 50, 20);

  circle(360, 80, 20);

  text('CASIO', 330, 20);

​

​

​

}

​

function drawKey() {

  for (i = 0; i < 300; i = i + 50) {

    fill(255);

    rect(i, 50, 50, 200);

​

    fill(0);

    rect(i + 15, 50, 18, 100);

    line(i + 25, 50, i + 25, 200);

    console.log(mouseX);

  }

}

​

function mousePressed() {

  if (mouseX < 50) {

    tone.play();

​

  }

  if (mouseX > 50 && mouseX < 100) {

    piano.play();

​

  }

  if (mouseX > 100 && mouseX < 150) {

    tone3.play();

  }

  if (mouseX > 150 && mouseX < 200) {

    tone.play();

​

  }

  if (mouseX > 200 && mouseX < 250) {

    piano.play();

​

  }

  if (mouseX > 250 && mouseX < 300) {

    tone3.play();

  }

​

​

}