Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Soundcloud: play multiple tracks simultaneously - HTML5 widget

I am trying to create a simple multi-track player based on Soundcloud, displaying multiple tracks and start playing them simultaneously.

I found a similar prototype here (Flash widget based): http://sessian.com/10/
Pressing two different 'Play' buttons, the two tracks can be played together.

It seems that using the HTML5 widgets instead this is not possible, only one track can be played at a time. Quick example here: http://jsfiddle.net/ftwJr/7/

Html:

<iframe id="widget" src='http://w.soundcloud.com/player/?url=http://api.soundcloud.com/tracks/43315398&auto_play=true' width="100%"></iframe>
<iframe id="widget2" width="100%" src='http://w.soundcloud.com/player/?url=http://api.soundcloud.com/tracks/4331538'></iframe>    

JavaScript:

(function() {
    var iframe = document.querySelector('#widget');
    var widget = SC.Widget(iframe);
    widget.bind(SC.Widget.Events.PLAY, function(eventData) {
        alert('Playing 1...');
    });
    widget.bind(SC.Widget.Events.PAUSE, function(eventData) {
        alert('PAUSE 1...');
    });

    var iframe2 = document.querySelector('#widget2');
    var widget2 = SC.Widget(iframe2);
    widget2.bind(SC.Widget.Events.PLAY, function(eventData) {
        alert('Playing 2...');
    });
    widget2.bind(SC.Widget.Events.PAUSE, function(eventData) {
        alert('PAUSE 2...');
    });
}());


Pressing 'Play' will pass a pause event to the other window. This is true also in different browser tabs.

Is there a way to allow multiple simultaneous playing using the HTML5 widget? (An existing SC init option, or a way to have two different SC instances, or ...)

Thank you!

like image 910
FraDiGomma Avatar asked Sep 13 '12 16:09

FraDiGomma


1 Answers

To clarify: the API for the flash and HTML5 widgets supports a single_active parameter for exactly this use case.

like image 154
pje Avatar answered Nov 22 '22 10:11

pje