Question

我试图为某些Soundcloud曲目创建自定义播放器。我们的想法是隐藏Iframe并创建一些玩家来播放不同的曲目。装载和播放都很好但我有两个挑战。

如何创建进度条（SC.Widget.Events.PLAY_PROGRESS）
如何创建下载链接？

我编写此代码的方式摘录：

    (function(){
    var widgetIframe = document.getElementById('sc-widget'),
        widget       = SC.Widget(widgetIframe);

    widget.bind(SC.Widget.Events.READY, function() {

    $('#play').click(function(){
        widget.play();
    });
});  }());

糟糕的是OPEN API已经关闭..

Answer 1

如果您尝试使用自定义播放器流式传输曲目，我建议您根本不使用该部件。相反，请使用streaming SDK directly。 There are methods可以完成加载，播放，暂停，搜索，获取歌曲当前时间等所需的所有内容。

要初始化流式播放器，您可以执行以下操作：

SC.initialize({
  client_id: "<client id>"
});

SC.stream("/tracks/" + song_id).then(function (player) {
  player.play();
}

要构建实际的进度条，您可以在流函数内部执行以下操作（此示例使用JQuery，但您不需要）：

player.on("time", function () {
    var current_time = player.currentTime();
    var current_duration = player.options.duration;
    $(".scrubber .scrubber_fill").css("width", ((current_time / current_duration) * 100) + "%");
});

自定义Soundcloud Widget（api）播放器

1 个答案: