dj_slider.js

var song1;
var song2;
var song3;

var speedSlider1;
var volumeSlider1;

var speedSlider2;


var button1;
var button2;

var songvol = 0;



function preload() {
  song1 = loadSound("sounds/supernatural.mp3");
  song2 = loadSound("sounds/04_Sierra_Leone.m4a");
  song3 = loadSound("sounds/15_Sunday_Candy.m4a");
}

function Supernatural() {
  if (song1.isPlaying() ) { 
    song1.stop();
  } else {
    song1.play();
  }
  if (song2.isPlaying()){
    song2.stop();
  } else {
    song2.play();
  }
}
//this function doesn't work. I want to make song2 turn off when sundayCandy is called by button2 below. 
function sundayCandy() {
  if (song3.isPlaying() ) { 
    song2.stop();
  } else {
    song3.play();
  }
}

function setup() {
  noCanvas();

  speedSlider1 = createSlider(0.5, 4, 1, 0.1);
  speedSlider1.parent('rate');
  volumeSlider1 = createSlider(0, 1, 0.5, 0.001);
  volumeSlider1.style('width', '200px');
  volumeSlider1.parent('volume');
  
  speedSlider2 = createSlider(0.5, 4, 1, 0.1);
  speedSlider2.parent('rate');

  
  button1 = createButton('Play');
  // button.position(650, 410);
  button1.style('width', '130px');
  button1.mousePressed(Supernatural);
  
  
  button2 = createButton('Next');
  button2.style('width', '130px');
  button2.mousePressed(sundayCandy);
  

}
function draw() {
  background(0);
  songvol = map(volumeSlider1.value(), 0, 1, 1, 0);
  song1.amp(songvol);
  song1.rate(speedSlider1.value());
  
  song2.amp(volumeSlider1.value());
  song2.rate(speedSlider2.value());
}