Update the JPlayer MP3 file each time a function is called

Question

function showAudioFull(id)
{
    var url = URL_DIRSCREENAUDIOSHOT+AUDIOSHOT_PREFIX+id+'.mp3';
    var myCirclePlayer = new CirclePlayer("#jquery_audioFile",
            {
                m4a: url              
            }, {
                cssSelectorAncestor: "#cp_container_1"
            });
}

I am appending the MP3 link to JPlayer each time I call this function in my JS file.

There will be a set of images with "id". With an onClick() function this showAudioFull() is invoked.

But problem is JPlayer is not updating the mp3 file that is being played. It keeps playing the same audio which I click at the first time.

FYI : Using JPlayer Circle player

what is the reason you are creating a new player every time? — user1852503
@user1852503 I am just trying to update the file link. I dont have an idea about JPlayer so far. My requirement is as follows : If I click first image with id "1" then jplayer should play 1.mp3. In case if i click the 2nd image with id "2", the Jplayer should play 2.mp3 in the same player instead of 1.mp3 — Madhusudhan
jplayer.org/latest/developer-guide/#jPlayer-fundamentals. search for "setMedia". — user1852503
@user1852503 setMedia is fine. but problem is I initialize the player in document.ready. But the MP3 is provided in another function in the same JS file. Any suggestion on how to go through this? — Madhusudhan

alexP alexP · Accepted Answer · 2014-03-07T11:06:05

What about:

var myCirclePlayer = new CirclePlayer("#jquery_audioFile", {
    m4a: url
}, {
    cssSelectorAncestor: "#cp_container_1"
});

function showAudioFull(id) {
    var url = URL_DIRSCREENAUDIOSHOT + AUDIOSHOT_PREFIX + id + '.mp3';
    myCirclePlayer("setMedia", {
        mp3: url
    });
};

This method (setMedia) is used to define the media to play. The media parameter is an object that has properties defining the different encoding formats and a poster image. Source: jPlayer dev guide

Update the JPlayer MP3 file each time a function is called

1 Answers