Question

I’m using the SC HTML5 player, when one sound finishes, I load in another source, however the FINISH event only seems to fire for the first song, my code is as follows

//Set the source
document.getElementById("sc-widget").src = scPath;
//get the widget reference
var widgetIframe = document.getElementById('sc-widget'),
widget       = SC.Widget(widgetIframe);
//set the finish event
widget.bind(SC.Widget.Events.FINISH, endSC);

function endSC() {
                    var scPath = "http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F1848538&show_artwork=true&auto_play=true";
                    document.getElementById("sc-widget").src = scPath;
                    var widgetIframe = document.getElementById('sc-widget'),
                    widget       = SC.Widget(widgetIframe);
                    widget.bind(SC.Widget.Events.FINISH, endSC);
}

I’ve tried setting the endSC target to another function but that doesn’t work, what am I missing? Thanks!

Answer 1

I had the same problem. SC.Widget method is working fine when I call it for the first time, but if I try to call it for the second time the console will fire “Uncaught TypeError: Cannot read property ‘parentWindow’ of null” error in http://w.soundcloud.com/player/api.js script. And that is where api.js script stops with actions (.Widget, .bind, etc.)

I found the solution. It’s very weird, but it is a solution.
SoundCloud remote script is minified. Load it in your browser, C/P it in some online js beautifier and save it locally. Edit line 103 as follows:

return a.contentWindow;// || a.contentDocument.parentWindow

So I removed that .parentWindow call.

Save the file and call it in your page’s head section. And that’s it! Now FINISH event fires on every loaded widget.

I hope this will help.