SoundCloud SDK Play Function

Why is trackId undefined on the first play press?

After a track is skipped, the play feature works as expected.

I'm building a player with the SoundCloud Javascript SDK, and I've run into a snag. When play is pressed, the variable trackId is undefined. However, I can skip tracks to get successful plays of each song in the example account.

*Note: I had this working with the HTML5 widget and api, but that includes an iframe, which will not work with iPhone audio playback, so I need to work this out with the javascript SDK.

Thanks in advance!

Development Area: http://dev-mountvalor.legendarylion.com/

Documentation: https://developers.soundcloud.com/docs/api/sdks#stream

  var songs=[{}];

   // function getPlaylist(){

   //  // currentTrack = songs[1].soundcloud_id;
   //  //  console.log(songs[1].soundcloud_id);
   //  //  console.log(currentTrack);
   // }

 var setList = 'testing-mountain/tracks';


SC.initialize({
            client_id: "ae0b7cf303a1217a43a57c3658e673ff"
        });

         SC.get("/resolve/?url=https://soundcloud.com/" + setList, {limit: 52}, function(userReturn){
            // console.log(userReturn);

            // console.log(userReturn.tracks[1].title);

            // console.log(userReturn.length);

              // iterate through the json and snag the stuff we need, create an associative array out of it
              for (var i = 0; i < userReturn.length; i++) {

                  songs.push(
                    {"title" : userReturn[i].title,
                    "song_url" : "https://soundcloud.com/",
                    "soundcloud_id" : userReturn[i].id, 
                    "artwork" : userReturn[i].artwork_url}
                    );
              }

              // Remove the proto addition to the object
              songs.shift();

              console.log(songs);
              // currentTrack=songs[1].soundcloud_id;
              // console.log(currentTrack);

                 // console.log(songs);
                 // console.log(songs[1].soundcloud_id);

                 // trackID = (songs[1].soundcloud_id);
                 // console.log('trackID is equal to '+ trackID);



              // $( "#track-title" ).empty();
              // $( "#track-title" ).append( "<p> Now Playing: " + userReturn[0].title + "</p><img class='player-thumb' src='" + userReturn[0].artwork_url + "' alt=''>" );

              // getPlaylist();

           });

    Track = function (trackId){
    //Testing mountain sample track
    // var trackId = '240347155';
    //Mount Valor sample track
    // var trackId = '241728584';

    // var setList = 'mountvalor/tracks';



        SC.stream("/tracks/" + trackId, function(sound){
            player = sound;
        });


        this.play = function() {
            player.play();            
        };

        this.pause = function() {
            player.pause();
        };

        this.stop = function() {
            player.stop();
        };
        // console.log(trackId);
    };


    Rotation = function(tracks) {
        var currentTrack = tracks[0];


        this.currentTrack = function () {
            return currentTrack;
        };

        this.nextTrack = function () {
            var currentIndex = tracks.indexOf(currentTrack);
            var nextTrackIndex = currentIndex + 1;
            var nextTrackId = tracks[nextTrackIndex];
            currentTrack = nextTrackId;
            console.log(currentTrack);
            console.log(currentIndex);
            $( "#track-title" ).html( "<p> Now Playing: " + currentTrack.title + "</p><img class='player-thumb' src='" + currentTrack.artwork + "' alt=''>" );
            return currentTrack;
        };

        this.backTrack = function () {
            var currentIndex = tracks.indexOf(currentTrack);
            var nextTrackIndex = currentIndex - 1;
            var nextTrackId = tracks[nextTrackIndex];
            currentTrack = nextTrackId;
            console.log(currentTrack);
            console.log(currentIndex);
            $( "#track-title" ).html( "<p> Now Playing: " + currentTrack.title + "</p><img class='player-thumb' src='" + currentTrack.artwork + "' alt=''>" );
            return currentTrack;
        };

    };

    $(document).ready (function(){

        $('#volume').on('change', function(event){
            player.setVolume($(this).val());
            // console.log($(this).val());
        });
        // console.log(songs);

        var rotation = new Rotation(songs);
        var currentTrack = rotation.currentTrack();
        var currentPlayingTrack = new Track(currentTrack.soundcloud_id);

        $('#play').on('click', function(event){
            currentTrack = rotation.currentTrack();
            currentPlayingTrack.play();
            $('#pause').show();
            $('#play').hide();
        });

      $('.hero-play-button').on('click', function(event){
          // console.log($(this).attr('id'));
          // grab the id of the current element clicked
          var circlePlayButtonId = ($(this).attr('id'));
          //replace the string in that element of the id to get the index counter from the id
          circlePlayButtonId = circlePlayButtonId.replace('circle-play-', '');
          // console.log('The replaced index variable is ' + circlePlayButtonId);
          //play the song based on the index pulled from the id when clicked
          // player.skip(circlePlayButtonId);
          $('#pause').show();
          $('#play').hide();
      });

        $('#pause').on('click', function(event){
            currentPlayingTrack.pause();
            $('#pause').hide();
            $('#play').show();
        });


        $('#next').on('click', function(event){
            currentPlayingTrack.stop();
            currentTrack = rotation.nextTrack();
            currentPlayingTrack = new Track(currentTrack.soundcloud_id);
            currentPlayingTrack.play();
            $('#play').hide();
            $('#pause').show();
        });
         $('#prev').on('click', function(event){
            currentPlayingTrack.stop();
            currentTrack = rotation.backTrack();
            currentPlayingTrack = new Track(currentTrack.soundcloud_id);
            currentPlayingTrack.play();
            $('#play').hide();
            $('#pause').show();
            console.log('backtrack!');
        });


    }); // End Document Ready

You should move the creation of track and rotation objects in time when songs are already loaded, inside:

SC.get("/resolve/?url=https://soundcloud.com/" + setList, {limit: 52})
  .then(function(userReturn){

Check plunk

链接地址: http://www.djcxy.com/p/65306.html

上一篇: 无法在Netbeans 6.9.1中创建Zend Framework项目

下一篇: SoundCloud SDK播放功能