Question

I’ve been having problems with the custom soundcloud HTML 5 soundcloud player that I got from here: https://github.com/soundcloud/soundcloud-custom-player

What I’m trying to do is load the soundcloud player as individual tracks in a fullscreen slideshow. At the end of each track, I would like an event to trigger that clicks the navigation button, then starts the next player (because of the way the slider is set up, it won’t automatically read the ‘next track’ and instead should be able to find the next individual ‘play’ button and click it)

I’ve gotten some makeshift ideas to work

$(document).bind('onPlayerPause.scPlayer', function(event){
$('.next').click();
});

Really basic and it indeed clicks functions that way it is written. However, because the event triggers when the player pauses, it also clicks the ‘.next’ when I click the ‘play’ button to pause.

To summarize:

Find the event handler that sees when the track ends, not when it is paused and successfully implement it into code.

Answer 1

I find this in soundclousd-custom-player docs:

onMediaTimeUpdate.scPlayer

gets triggered constantly when the player
is playing, could be used to display track progress outside of the
player node

$(document).bind('onMediaTimeUpdate.scPlayer', function(event){
    console.log(event.target, 'the track is at ' + event.position + ' out of ' + 
    event.duration + ' which is ' + event.relative + ' of the total'); 
});

You have to trigger your event when event.relative equals to 100% or when event.positon equals to event.duration.