CODEWITHSUNDEEP
jqueryvariablesdynamicjplayer
ArgGeo
ArgGeo

Reputation: 95

Change jPlayer stream source dynamically

What I need to do is to change jPlayer stream source on anchor or button click (5 in total) without refreshing the page or stoping the player. Is that possible?

JAVASCRIPT

jQuery(document).ready(function(){

        var stream = {
            title: "ABC Jazz",
            mp3: "http://listen.radionomy.com/abc-jazz"
        },
        ready = false;

        jQuery("#jquery_jplayer_master").jPlayer({
            ready: function (event) {
                ready = true;
                jQuery(this).jPlayer("setMedia", stream); //.jPlayer("play")
            },
            pause: function() {
                jQuery(this).jPlayer("clearMedia");
            },
            error: function(event) {
                if(ready && event.jPlayer.error.type === jQuery.jPlayer.error.URL_NOT_SET) {
                    // Setup the media stream again and play it.
                    jQuery(this).jPlayer("setMedia", stream).jPlayer("play");
                }
            },
            swfPath: "js",
            supplied: "mp3",
            preload: "none",
            wmode: "window",
            keyEnabled: false
        });

    });

ANCHORS

<a id="lounge" href="javascript:void(0)">Click for Lounge music</a>
<a id="rock" href="javascript:void(0)">Click for Rock music</a>
.
.
<a id="dance" href="javascript:void(0)">Click for Dounge music</a>

Upvotes: 4

Views: 963

Answers (1)

Ɛɔıs3
Ɛɔıs3

Reputation: 7853

Find the solution after hours of search.

Just add this to your code (according to your example) :

$("#jquery_jplayer_master").jPlayer('destroy');
// And then call again your js code with new params

Upvotes: 1

Related Questions