Как создать динамический плейлист Jplayer с JSON или XML-url с помощью плейлиста Add-on

Question

Как создать динамический список воспроизведения Jplayer из JSON или XML или URL-адрес папки и использовать этот плейлист с новым надстройкой Play Playlist Jplayer?

Команда Jplayer упоминает, что вы можете это сделать (http://jplayer.org/latest/demo-02-jPlayerPlaylist/), но пока еще нет примеров как для создания динамического плейлиста, так и для того, чтобы связать этот плейлист с новым надстройкой Playlist. Кто-нибудь, пожалуйста, покажет рабочий пример способа создания динамического плейлиста и ссылку на этот новый плейлист на новый плейлист Jplayer?

Answer 1

Вы можете использовать следующий код в качестве отправной точки:

$(document).ready(function(){ 
    var cssSelector = { jPlayer: "#jquery_jplayer_1", cssSelectorAncestor: "#jp_container_1" }; 
    var options = { swfPath: "../js", supplied: "ogg, mp3" }; 
    var myPlaylist = new jPlayerPlaylist(cssSelector, [], options); 

    $.get("xml_audio.php", {}, function (xml){ 
     $('Track', xml).each(function (i){ 
     var title = $(this).attr('title'); 
     var track_name = $(this).attr('track_name'); 

     myPlaylist.add({ 
      'title': title, 
      'mp3': 'audio/' + track_name + '.mp3', 
      'ogg': 'audio/' + track_name + '.ogg' 
     }); 
     }); 
    }); 
}); 

В качестве альтернативы, пожалуйста, обратите внимание на jPlayer Jukebox add-on. Он основан на jPlayer Playlist add-on, но добавляет дополнительные функции, такие как возможность сканирования страницы для медиа-ссылок и обеспечения их воспроизведения. Теперь он поддерживает плейлисты в формате XSPF.

Answer 2

<script> 
$(document).ready(function(){ 
var cssSelector = { 
    jPlayer: ".jquery_jplayer_1", 
    cssSelectorAncestor: "#jp_container_1" 
}; 
var playlist = []; // Empty playlist 
var options = { 
    swfPath: "../newjs/jplayer", 
    supplied: "mp3" 
}; 
var myPlaylist = new jPlayerPlaylist(cssSelector, playlist, options); 
$.getJSON("<?php print base_path() ?>/album-json",function(data){ // get the JSON array produced by my PHP 
    $.each(data,function(index,value){ 

     myPlaylist.add({title:$(this).attr("title"),mp3:$(this).attr("mp3")}); // add each element in data in myPlaylist 

    }) 

}); 
}); 
</script>