SoundCloud API: using oEmbed to specify the start and end time of a track

I have a web application that integrates with the SoundCloud API for searching and playing tracks. I can successfully transfer tracks through the API using SoundCloud oEmbed as follows:

scope.playTrack = function(track) {
  SC.oEmbed(track.permalink_url, { auto_play: true })
    .then(function(oEmbed) {
      scope.soundCloudWidget = $sce.trustAsHtml(oEmbed.html);
      scope.$apply();
    });
};

With widgets associated with the view:

<div ng-bind-html="soundCloudWidget"></div >

This works as expected. My problem is that I would like to transfer the track this way, but with the specified start and stop times . I did some research and found a seemingly related https://stackoverflow.com/a/166269/2129/ which is mentioned that you can:

add #t=12sto audio URL to run it at 12th second

URL-, :

https://soundcloud.com/griz/summer-97-ft-muzzy-bearr#t=54s

, start = '54s' -

scope.playTrackSection = function(track, start) {
  SC.oEmbed(track.permalink_url, { auto_play: true, t: start })
    .then(function(oEmbed) {
      scope.soundCloudWidget = $sce.trustAsHtml(oEmbed.html);
      scope.$apply();
    });
};

scope.playTrackSection = function(track, start) {
  var url = track.permalink_url + "#t=" + start;
  SC.oEmbed(track.permalink_url, { auto_play: true })
    .then(function(oEmbed) {
      scope.soundCloudWidget = $sce.trustAsHtml(oEmbed.html);
      scope.$apply();
    });
};

. ?

: , - , ?

+4
1

. SoundCloud Widget API !

JavaScript, API SoundCloud Widget, script html.

script SC.Widget(/*iframeElement|iframeElementID*/) . (, ). SC.Widget iframe .

, script - :

scope.playTrackSection = function(track, startTime, endTime) {
  SC.oEmbed(track.permalink_url, { auto_play: true })
    .then(function(oEmbed) {
      scope.soundCloudWidget = $sce.trustAsHtml(oEmbed.html);
      scope.$apply();

      scope.iframe = document.getElementById('soundcloud_widget').querySelector('iframe');
      scope.widget = SC.Widget(scope.iframe);

      scope.widget.seekTo(startTime);
      scope.widget.bind('playProgress', function(needle) {
        if (needle.currentPosition >= endTime) {
          scope.widget.pause();
        }
      });
    });
};

html:

<div id="soundcloud_widget" ng-bind-html="soundCloudWidget"></div>

, scope.widget.bind('xxxx', ....) API- Widget. , , , , , , .., .

0

Source: https://habr.com/ru/post/1626231/


All Articles