let recorder;

​

let reverbslider;

let lowfreqslider;

let highpassslider;

let distortionslider;

let delayslider;

​

let micvolumeslider;

let songvolumeslider;

​

let song;

let songvolume;

​

let recordedsong;

let state = 1;

let count;

​

function preload() {

  song = loadSound("instrumental1.mp3");

​

  reverb = new p5.Reverb();

  lowPass = new p5.LowPass();

  highpass = new p5.HighPass();

  distort = new p5.Distortion();

  delay = new p5.Delay();

}

​

function setup() {

  createCanvas(600, 600);

  background(100, 10, 140);

  frameRate(30);

​

  mic = new p5.AudioIn();

  mic.start();

  mic.connect();

  mic.amp(0.2);

  recorder = new p5.SoundRecorder();

  //recorder.setInput(mic);

​

  fill("white");

  // micvolumeslider = createSlider(0, 1, 0.2, 0.01);

  // micvolumeslider.position(width / 2, height / 8 - 15);

  // micvolumeslider.style("width", "160px");

  // text("Mic Volume", width / 4, height / 8);

​

  reverbslider = createSlider(0, 1, 0, 0.01);

  reverbslider.position(width / 2, (2 * height) / 8 - 15);

  reverbslider.style("width", "160px");

  text("Reverb", width / 4, (2 * height) / 8);

​

  lowfreqslider = createSlider(10, 22050, 10);

  lowfreqslider.position(width / 2, (3 * height) / 8 - 15);

  lowfreqslider.style("width", "160px");

  text("Lowfreq Filter", width / 4, (3 * height) / 8);

​

  highpassslider = createSlider(10, 22050, 10);

  highpassslider.position(width / 2, (4 * height) / 8 - 15);

  highpassslider.style("width", "160px");

  text("Highfreq Filter", width / 4, (4 * height) / 8);

​

  distortionslider = createSlider(0, 1, 0, 0.01);

  distortionslider.position(width / 2, (5 * height) / 8 - 15);

  distortionslider.style("width", "160px");

  text("Distortion", width / 4, (5 * height) / 8);

​

  delayslider = createSlider(0, 0.5, 0, 0.01);

  delayslider.position(width / 2, (6 * height) / 8 - 15);

  delayslider.style("width", "160px");

  text("Delay", width / 4, (6 * height) / 8);

​

  // songvolumeslider = createSlider(0, 1, 1, 0.01);

  // songvolumeslider.position(width / 2, (7 * height) / 8 - 15);

  // songvolumeslider.style("width", "160px");

  // text("Song Volume", width / 4, (7 * height) / 8);

​

  textSize(20);

  textAlign(CENTER);

  text("Press any key to play track!", width / 2, (8 * height) / 8 - 20);

  textSize(25);

  text("Karaoke for One", width / 2, 37);

​

  reverb.process(mic, 10);

  lowPass.process(mic);

  highpass.process(mic);

  distort.process(mic, 0.1, "2x");

  delay.process(mic, "", 0.5);

​

  recordedsong = new p5.SoundFile();

}

​

function draw() {

  reverb.drywet(reverbslider.value());

  lowPass.freq(lowfreqslider.value());

  highpass.freq(highpassslider.value());

  distort.drywet(distortionslider.value());

  delay.delayTime(delayslider.value());

​

  // mic.amp(micvolumeslider.value());

  // song.amp(songvolumeslider.value());

​

  getLyrics();

}

​

function keyPressed() {

  userStartAudio();

  count = frameCount;

​

  //state %=2;

  console.log(state);

​

  if (state === 1) {

    song.play();

    recorder.record(recordedsong);

​

    fill("white");

​

    createCanvas(600, 600);

    background(220, 0, 55);

    textSize(20);

    textAlign(CENTER);

    text("Recording! Press any key to STOP recording.", width / 2, 50);

    // micvolumeslider.hide();

    reverbslider.hide();

    lowfreqslider.hide();

    highpassslider.hide();

    distortionslider.hide();

    delayslider.hide();

    // songvolumeslider.hide();

    console.log(count);

    text("I Want It That Way",width/2,550);

    textSize(15)

    text("Backstreet Boys", width/2, 570);

​

    state++;

  } else if (state === 2) {

    recorder.stop();

    song.stop();

    mic.disconnect();

    state++;

    createCanvas(600, 600);

    background(0, 160, 111);

    textSize(20);

    textAlign(CENTER);

    text("Press any key to SAVE recording.", width / 2, height / 2);

  } else if (state === 3) {

    save(recordedsong, "i want it that way cover");

    state = 1;

  }

}

​

function getLyrics() {

  textSize(14);

  if (frameCount === count + 285) text("You are my fire.", width / 2 - 50, 100);

​

  if (frameCount === count + 420) text("The one desire.", width / 2 + 50, 100);

​

  if (frameCount === count + 570)

    text("Believe when I say.", width / 2 - 60, 120);

​

  if (frameCount === count + 720)

    text("I want it that way.", width / 2 + 60, 120);

​

  if (frameCount === count + 855)

    text("But we are two worlds apart.", width / 2 - 85, 140);

​

  if (frameCount === count + 1050)

    text("Can't reach to your heart", width / 2 + 85, 140);

​

  if (frameCount === count + 1200) text("When you say...", width / 2 - 75, 160);

​

  if (frameCount === count + 1290)

    text("That I want it that way", width / 2 + 75, 160);

​

  if (frameCount === count + 1410)

    text("[CHORUS] Tell me why ain't nothin' but a heartache", width / 2, 180);

​

  if (frameCount === count + 1560)

    text("Tell me why, ain't nothin' but a mistake", width / 2, 200);

​

  if (frameCount === count + 1730)

    text("Tell me why, I never wanna hear you say", width / 2, 220);

​

  if (frameCount === count + 1890) text("I want it that way", width / 2, 240);

​

  if (frameCount === count + 2010) text("Am I your fire?", width / 2 - 50, 270);

​

  if (frameCount === count + 2160) text("Your one desire", width / 2 + 50, 270);

​

  if (frameCount === count + 2280)

    text("Yes, I know it's too late.", width / 2 - 70, 290);

​

  if (frameCount === count + 2460)

    text("But I want it that way", width / 2 + 70, 290);

​

  if (frameCount === count + 2580) text("[CHORUS]", width / 2, 310);

​

  if (frameCount === count + 3180)

    text("Now I can see that we've fallen apart.", width / 2 - 120, 330);

​

  if (frameCount === count + 3330)

    text("From the way that it used to be, yeah", width / 2 + 120, 330);

​

  if (frameCount === count + 3480)

    text("No matter the distance, I want you to know", width / 2 - 120, 350);

​

  if (frameCount === count + 3600)

    text("That deep down inside of me", width / 2 + 120, 350);

​

  if (frameCount === count + 3750)

    text("You are my fire.", width / 2 - 50, 370);

​

  if (frameCount === count + 3900) text("The one desire.", width / 2 + 50, 370);

​

  if (frameCount === count + 4050)

    text("You are (you are, you are, you are)", width / 2, 390);

​

  if (frameCount === count + 4290)

    text("Don't wanna hear you say", width / 2, 410);

​

  if (frameCount === count + 4350)

    text("Ain't nothin' but a heartache", width / 2, 430);

​

  if (frameCount === count + 4500)

    text(

      "Ain't nothin' but a mistake (don't wanna hear you say)",

      width / 2,

      450

    );

​

  if (frameCount === count + 4650)

    text("I never wanna hear you say (oh, yeah)", width / 2, 470);

​

  if (frameCount === count + 4830) text("I want it that way", width / 2, 490);

​

  if (frameCount === count + 4920) text("[CHORUS]", width / 2, 520);

​

  if (frameCount === count + 5490) text("[CHORUS]", width / 2, 540);

​

  if (frameCount === count + 6090)

    text("'Cause I want it that way", width / 2, 560);

}

​