Trigger play next at end of audio file

1

I’ve got a couple of audio playlist web apps which are working well - thanks to the support of the Hype forum community - but I’d like to enhance them by auto playing the next item.

Is there a simple way of triggering play next at the end of a piece of audio ?

2

The answer is quite possibly, but it depends on your audio playing technique. Would it be possible to post a zip of your .hype document, or at least post some code on how you're kicking off the audio? (I don't want to assume you used a specific technique from past posts) Thanks!

5

Thanks Jonathan - here is the play pause script:

		
	var songList = hypeDocument.customData.songList
	
	var audio = document.getElementById('myaudio');   //Get hidden audio control elements
	
	var song = songList[hypeDocument.customData.theSong_id]
	
	var coverImage = document.querySelector('.coverPic')
	hypeDocument.setElementProperty(coverImage, 'background-image', "${resourcesFolderName}/" + song.pic)
	$(".blurb").text(song.blurb)

	 
	var source = hypeDocument.resourcesFolderURL()+"/"+ song.track + ".mp3";
	if(audio.src != source) {
		audio.src=source;
	}


	if (audio.paused) { 
  audio.play(); //play track
 		$("#play_btn").hide();  //Hide the play button
		$("#stop_btn").show();  //Show the pause button
  
  
} else { 
  audio.pause(); //pause track
  $("#play_btn").show();  //Show the play button
		$("#stop_btn").hide();  //Hide the pause button
}
6

And this is the manually triggered play next script:




var list = hypeDocument.customData.songList;
hypeDocument.customData.theSong_id = 
        (hypeDocument.customData.theSong_id + 1) % list.length;
var theSong_idText = hypeDocument.getElementById('songid')
theSong_idText.innerHTML = `Song ID =  ${hypeDocument.customData.theSong_id}`;
hypeDocument.functions().play(hypeDocument, element, event);
7

Yes, since you are using the HTML5 <audio> tag, you can just add a listener to the onended event which should work. In your setup, before you set the src, you could do something like:

audio.onended = (function () {
	var list = hypeDocument.customData.songList;
	hypeDocument.customData.theSong_id = 
			(hypeDocument.customData.theSong_id + 1) % list.length;
	var theSong_idText = hypeDocument.getElementById('songid')
	theSong_idText.innerHTML = `Song ID =  ${hypeDocument.customData.theSong_id}`;
	hypeDocument.functions().play(hypeDocument, element, event);	
});

(the interior code is just pasting what you said you have to manually trigger the play next script.