CODEWITHSUNDEEP
javascriptjqueryjsonjplayerplaylist
Radoslav T.
Radoslav T.

Reputation: 75

Gettin information from JSON file for jPlayer Playlist

I'm making a music player for my site using jPlayer.

What I want is to have a JSON file hosted somewhere to store track title and file name. And by clicking different buttons to load different playlists.

How do I load information from JSON files into my player?

Here is the JSON itself:

{"tracks":[
    {
        "title": "Some Track 1",
        "trackname": "Some_track_name_1"
    },
    {
        "title": "Some Track 2",
        "trackname": "Some_track_name_2"
    },
    {
        "title": "Some Track 3",
        "trackname": "Some_track_name_3"
    }
]}

Here is the idea for JS I have. 

$.getJSON("path/to/playlist.json",
function(....){

//Get JSON data and generate a playlist
//Playlists are generated with:
    customPlaylist.add({
        title: title var,
        mp3: 'track path' + filename var + '.mp3' ,
    });   
});

And once the custom playlist is created it awaits to be set as default playlist called myPlaylist by jPlayer:

$("#Playlist_1").click(function() {
    myPlaylist.setPlaylist([

       set the generated playlist "customPlaylist" as the 
       default playlist "myPlaylist" here....

    ]);

And this way I THINK I'll have multiple playlists so users can chose which one to play.

My knowlge of JS and JSON is limited so what I have are just rough ideas.

Upvotes: 0

Views: 1067

Answers (1)

Roboroads
Roboroads

Reputation: 1709

You are going in the right direction!

You only have to use the variable you are getting back. Tracks is an array, so you can loop through it with forEach;

$.getJSON("path/to/playlist.json",
    function(playlist){

//Get JSON data and generate a playlist
//Playlists are generated with:
        playlist.tracks.forEach(function(track){
            customPlaylist.add({
                title: track.title,
                mp3: 'track path' + track.trackname + '.mp3' ,
            });
        });

    });

Upvotes: 1

Related Questions