CODEWITHSUNDEEP
soundcloudsoundmanager2
Graphicd02
Graphicd02

Reputation: 73

Play SoundCloud links through Soundmanager2

I'm using the Soundmanager Mp3 Button on my site. However, I'd like to use the Soundcloud Api to stream tracks through Soundmanager instead of hosting MP3's. Basically, I'd like to stream a Soundcloud link through the Soundmanager button. Possible?

I've tried creating a jQuery loop (below) but still haven't had any luck.

<ol>
<li><a class="sm2_button" href="http://soundcloud.com/....">Track Title</a>
</li>
</ol>

and the jQuery

$("ol a").each(function()
    { 
        var thisLink = $(this);                         
        var track_url = this.href;                      // save href value of each link to 'track_url' i.e. soundcloud.com/...
        this.href = this.href.replace(track_url, "#");  // replace href value with '#'
        var consumer_key = 'My Consumer Key';
            // now resolve the stream_url through Soundcloud's getJSON method
        $.when($.getJSON('http://api.soundcloud.com/resolve?url=' + track_url + '&format=json&consumer_key=' + consumer_key + '&callback=?', function(track) {
            url = track.stream_url + '?consumer_key=' + consumer_key;   
            })).done(function() {
                // and place an 'onclick' on each link
                $(thisLink).attr('onclick', "if (basicMP3Player.lastSound) { basicMP3Player.lastSound.stop(); } document.getElementById('mp3').type='audio/mpeg'; document.getElementById('mp3').href = '" + url + "'; basicMP3Player.handleClick({target: document.getElementById('mp3')});");
            });
    });

Upvotes: 3

Views: 2769

Answers (3)

Ben Y
Ben Y

Reputation: 1881

This was driving me nuts too. After a bunch of digging I was able to get it to work if I specified an mp3 mimetype in the link:

<ol>
    <li><a type="audio/mp3" class="sm2_button" href="https://api.soundcloud.com/tracks/49349198/stream?client_id=YOUR_CLIENT_ID">Track Title</a></li>
</ol>

Upvotes: 5

Graphicd02
Graphicd02

Reputation: 73

I tried this and thought I had it...anyone see anything? 

 <script src="http://connect.soundcloud.com/sdk.js"></script>
    <script>
    SC.initialize({
      client_id: "My Consumer Key",
      redirect_uri: "My Redirect",
    });

    SC.get("/users/MYUSERID/tracks", {limit: 1000}, function(tracks){
      alert("Latest track: " + tracks[0].title);
    });

    $(".sm2_button").live("click", function(sound){
         sound.play();
      });

    </script>

    <script>
    $(document).ready(function() {

      $(".sm2_button").each(function()
        { 
            var thisLink = $(this);                         
            var track_url = this.href;                      // save href value of each link to 'track_url' i.e. soundcloud.com/...
            this.href = this.href.replace(track_url, "#");  // replace href value with '#'
            var consumer_key = 'My Consumer Key';
                // now resolve the stream_url through Soundcloud's getJSON method
            $.when($.getJSON('http://api.soundcloud.com/resolve?url=' + track_url + '&format=json&consumer_key=' + consumer_key + '&callback=?', function(track) {
                url = track.stream_url + '?consumer_key=' + consumer_key;   
                })).done(function() {
                    // and place an 'onclick' on each link
                    $(thisLink).attr('onclick', "if (basicMP3Player.lastSound) { basicMP3Player.lastSound.stop(); } document.getElementById('mp3').type='audio/mpeg'; document.getElementById('mp3').href = '" + url + "'; basicMP3Player.handleClick({target: document.getElementById('mp3')});");
                });
        }); 
          }); </script>

Upvotes: 0

Marco
Marco

Reputation: 644

You could also try using the SoundCloud Javascript SDK, which'll take care of most of this for you.

SC.initialize({
  client_id: "YOUR_CLIENT_ID",
  redirect_uri: "http://example.com/callback.html",
});


SC.stream("/tracks/293", function(sound){
  sound.play();
});

Upvotes: 1

Related Questions