Issues Playing and pausing tracks from a playlist

问题:

I'm creating an app using Soundcloud's JavaScript API that takes a URL to a Soundcloud playlist and displays the track list next to an audio player. I'm able to fetch everything using the API and play individual tracks using SC.stream(), but I'm running into a strange issue:

The first time you play a track, the Play and Pause buttons work as expected. If you select a new track, then go back and select the first track again, I would expect it to start over from the beginning. Instead, it remembers where it left off and the pause button doesn't work. If you hit the Play button while the audio is playing, the pause button works again.

How do I get SC.stream() to make a fresh request (start from the beginning of the track and reset the player object) when selecting the same track twice?

Below is a stripped down version of this working example on JSFiddle.

playTrack = function(id) {
  SC.stream("/tracks/" + id).then(function(player) {
    player.play();

    $(".player__play").click(function(e) {
      e.preventDefault();
      player.play();
    });

    $(".player__pause").click(function(e) {
      e.preventDefault();
      player.pause();
    });
  });
};

// Play a track from the playlist
$(document).on("click", ".playlist a", function(e) {
  e.preventDefault();
  var trackId = $(e.currentTarget).attr("data-track-id");
  playTrack(trackId);
});