Playing multiple songs in row

p5.js Libraries
1

hello everyone im trying to play 2 songs in row but it end up playing only the first song every time can someone help me plz

let song;
let song2 ;
function setup() {
  song = loadSound('sample1.mp3');
  song2 = loadSound('sample2.mp3');
  createCanvas(720, 200);
  background(255, 0, 0);
}

function mousePressed() {
  if (song.isPlaying()) {
    // .isPlaying() returns a boolean
    song.stop();
    song2.stop();
    background(255, 0, 0);
  } else {
    song.play();
    if(!song.isPlaying()){
      song2.play();
    }
    
    background(0, 255, 0);
  }
}
1 Like
2

well i guess i find it myself but its seems weird

let song = [];

function setup() {
  song[0] = loadSound('sample1.mp3');
  song[1] = loadSound('sample1.mp3');
  createCanvas(720, 200);
  background(255, 0, 0);
}

function mousePressed() {
 for (let index = 0; index < song.length; index++) {
  song[index].playMode('untilDone');
  song[index].play();
  song[index].onended(stop)
  console.log(index)
  function stop()
  {
    if(index+1<song.length){
      setTimeout(() => { song[index+1].play(); }, 1000/4);
      ;
    }
   
 
  }
   
 }
 
  
}
4

What does this mean? Down part?

5

i mean its not working with more then two songs
sorry

6

fyi … your second example is pointing to the same audio file.

Try calling onended() for each item in the song array in setup()
Keep track of the array index with a global variable, in your callback function play the next audio file with song[index].play() and then check if index < song.length - 1 and either increment index or set it to 0 depending on the evaluation.

Inside mousePressed() you can play index 0 of the array, but you will need some further logic to stop and play the files correctly (remember setup() contains that callback) depending on what you are going for .

2 Likes
7

thank you so much ithink its working now

let song = [];
let index= 0;
function setup() {
  song[0] = loadSound('sample1.mp3');
  song[1] = loadSound('sample2.mp3');
  song[2] = loadSound("sample3.mp3");
  song[3] = loadSound("sample4.mp3");
  
  createCanvas(720, 200);
  background(255, 0, 0);
}
function draw(){
song.forEach(sound => {
  sound.onended(go)
});

function go(){
  if( index < song.length-1  ){
  song[index+1].play()
  index++
  }
}
 
}
function mousePressed() {
  song[0].play()
  index = 0
}
1 Like
8 
const sng_src = ['https://ia800702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/01.%20Kellogg%27s%20Rice%20Krispies%20-%20Snap%2C%20Crackle%2C%20Pop%20%5BKellogg%27s%20Rice%20Krispies%5D_sample.mp3',
    'https://ia800702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/02.%20Chiquita%20Bananas%20-%20I%27m%20A%20Chiquita%20Banana_sample.mp3',
    'https://ia800702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/03.%20Good%20%26%20Plenty%20-%20Choo%20Choo%20Charlie_sample.mp3',
    'https://ia600702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/04.%20Marshmallow%20Fluff%20-%20If%20You%20Like%20Fluff%2C%20Fluff%2C%20Fluff%20%5BFluffernutter%20OR%20Marshmallow%20Fluff%5D_sample.mp3',
    'https://ia600702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/05.%20Mounds%20And%20Almond%20Joy%20Candy%20Bars%20-%20Sometimes%20You%20Feel%20Like%20A%20Nut_sample.mp3',
    'https://ia800702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/06.%20Hershey%27s%20Chocolate%20Bars%20-%20There%27s%20Nothing%20Like%20The%20Face_sample.mp3',
    'https://ia800702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/07.%20Oreo%20Chocolate%20Sandwich%20Cookies%20-%20Do%20You%20Know%20Exactly%20How_sample.mp3',
    'https://ia800702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/08.%20Cracker%20Jack%20-%20Candy-Coated%20Popcorn%2C%20Peanuts%20and%20a%20Prize%20%5BCrackerjack%5D_sample.mp3',
    'https://ia600702.us.archive.org/6/items/cd_tee-vee-toons-the-commercials_various-artists-ajax-cleanser-ajax-laundry/disc1/09.%20Coca-Cola%20-%20I%27d%20Like%20To%20Buy%20The%20World%20A%20Coke_sample.mp3'
  ],
  sng_names = ['snap, crackle, pop', 'chiquita banana', 'choo choo charlie', 'fluffernutter marshmallow', 'mounds & almond nut', 'hershey', 'oreo', 'cracker jacks', "coke"],
  NUM_SNGS = sng_src.length,
  sngs = [];

let idx = 0,
  canReset = true,
  s_canPlay = 'click to play';

function preload() {
  for (let i = 0; i < NUM_SNGS; i++) {
    sngs[i] = loadSound(sng_src[i]);
  }
}

function setup() {
  createCanvas(400, 400);
  textSize(30);
  textAlign(CENTER);
}

function draw() {
  background(220);

  checkForLastIndex();

  (canReset) ? text(s_canPlay, width * 0.5, height * 0.5): text(sng_names[idx], width * 0.5, height * 0.5)

  onReset();
}

const checkForLastIndex = _ => {
  if (idx === NUM_SNGS) {
    sngs.forEach(sng => {
      sng.onended(_ => {});
    });
    canReset = true;
    s_canPlay = 'click to play again';
    idx = 0;
  }
}

const onReset = _ => {
  if (canReset && mouseIsPressed) {
    sngs.forEach(sng => {
      sng.onended(_ => {
        idx++;
        playNextAudioTrack.call(this, idx);
      });
    });
    sngs[idx].play();
    canReset = false;
    initState = false;
  }
}

const playNextAudioTrack = i => {
  if (i < NUM_SNGS) sngs[i].play();
}
2 Likes