Integrate PDA Videos with jPlayer

pda-video-integrate-jPlayer.js

(function ($) {
  'use strict';
  $(document).ready(function () {

    // Init jPlayer.
    $("#jquery_jplayer_1").jPlayer({
      cssSelectorAncestor: "#jp_container_1",
      swfPath: "/js",
      supplied: "mp3, oga",
      useStateClassSkin: true,
      autoBlur: false,
      smoothPlayBar: true,
      keyEnabled: true,
      remainingDuration: true,
      toggleDuration: true
    });

    // Example: we have the button with class name is track and data-mp3-id attribute storing the protected mp3 file.
    // <button class="track" data-mp3-id="1">Play</button>
    $('.track').click(function(evt) {
      const src =  $(this).attr('data-mp3-id');
      
      // It will generate the private link and pass it to jPlayer.
      _generate_signed_url(src, function (mp3) {
        if (!mp3) {
          console.log('Cannot generate the private link.');
      }
      $("#jquery_jplayer_1").jPlayer("setMedia", {
        mp3,
        waitForLoad: false,
      }).jPlayer("play");
      });

    });

    function _generate_signed_url(src, cb) {
      const rootDomain = ajax_obj.rest_url;
      const url = rootDomain + 'puv/v1/private-link/' + src;
      $.ajax({
    	type: 'post',
    	dataType: 'json',
    	url: url,
    	success: function (response) {
    	  cb(response);
    	}
      })
}
  });
})(jQuery);