Soundcloud HTML5 Widget is not loaded, throws error - soundcloud

Question

I am trying to use SoundCloud HTML5 widget.
I want to load the widget and then, through JavaScript, tell it what to play. But when I tried to do this by this code
<script src="http://connect.soundcloud.com/sdk.js"></script>
<iframe id="sc-widget" width="100%" height="166" scrolling="no" frameborder="no" src="http://w.soundcloud.com/player/"></iframe>
<script src="http://w.soundcloud.com/player/api.js" type="text/javascript"></script>
<script>
var widgetIframe = document.getElementById('sc-widget'),
widget = SC.Widget(widgetIframe),
newWidgetUrl = 'http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F1848538&show_artwork=true';
console.log("before load");
widget.load(newWidgetUrl);
console.log("after load");
</script>
all I see in the console is
before load
after load
before load
after load
before load
after load
Unsafe JavaScript attempt to access frame with URL
http://www.karelbilek.com/musicalibre/ from frame with URL
https://w.soundcloud.com/player/. The frame requesting access has a
protocol of 'https', the frame being accessed has a protocol of
'http'. Protocols must match.
and the error
No SoundCloud widget URL was provided
in the widget. Now what am I doing wrong? Why is the console.log run three times, why is nothing loaded and why do I see the error?

Answer 1

OK, I think I get it. The key things:
Something must be loaded in the HTML5 widget beforehand, otherwise it never gets loaded and you can't even reload it. It doesn't matter what it is, but it must be an existent track.
The example here http://developers.soundcloud.com/blog/html5-widget-api is wrong - you should put a track URL as a parameter to widget.load, not the whole w.soundcloud.com... thing.
The revised, working version
<script src="http://connect.soundcloud.com/sdk.js"></script>
<iframe id="sc-widget" width="100%" height="166" scrolling="no" frameborder="no" src="http://w.soundcloud.com/player/?url=http%3A%2F%2Fapi.soundcloud.com%2Ftracks%2F1848538&show_artwork=true"></iframe>
<script src="http://w.soundcloud.com/player/api.js" type="text/javascript"></script>
<script>
var widgetIframe = document.getElementById('sc-widget'),
widget = SC.Widget(widgetIframe),
newWidgetUrl = 'http://api.soundcloud.com/tracks/1848538';
console.log("before load");
widget.load(newWidgetUrl);
console.log("after load");
</script>
The errors are still appearing, but they are not really relevant.