Jplayer's CirclePlayer IE and Autoload issue

Today another harsh day for debugging front end stuff. I stumble upon a jquery audio plugin that would not work in IE. How can it be when their demo is running okay in it. Aside from IE problem it can not be autoplay after load. I had whole day researching on what this plugins problem really is all about. I skip on the IE thing and googled the problem about autoplay and found out answers from devs also.

A developer answered in stackoverflow.com about autoplay is to add an option canplay function on the parameter passed to object circleplayer.

var player1 = new CirclePlayer("#myPlayerId",
    {
        mp3: "mymp3.com"
    },
    {
         wmode: "window",
         cssSelector: "#myselector",
         canplay: function(){
               jQuery("#myPlayerId").jPlayer("play");
         }
    }
);

Another developer answered


var player1 = new CirclePlayer("#myPlayerId",
    {
        mp3: "mymp3.com"
    },
    {
         wmode: "window",
         cssSelector: "#myselector",
         ready: function(){
               jQuery("#myPlayerId").jPlayer("play");
         }
    }
);


But none of this really work for me. It took me about an hour finding another solution until I found a mailinglist about it. It says you have to change the basecode of circleplayer in its binded initialization function.
So I had some work around with it to solve the problem on autoload.

Open the circle.player.js from your plugins folder or wherever you place the circle player script.  In line 45, in the defaults object variable add autoplay: false which means the autoplay is set to false as default


defaults = {
// solution: "flash, html", // For testing Flash with CSS3
supplied: "mp3",
solution: "flash,html",
// Android 2.3 corrupts media element if preload:"none" is used.
// preload: "none", // No point preloading metadata since no times are displayed. It helps keep the buffer state correct too.
cssSelectorAncestor: "#cp_container_1",
cssSelector: {
play: ".cp-play",
pause: ".cp-pause"
},
autoplay: false
},



In line 87, inside the circle players initialization function add the code below


                       /**
* For autoplay
*/
if(self.options.autoplay){
$(this).jPlayer("setMedia", self.media).jPlayer('play');
}else{
$(this).jPlayer("setMedia", self.media);
}

After you add the code your plugin can be used as this,


var myCirclePlayer = new CirclePlayer("#jquery_jplayer_1",
{
mp3: "music/booty me down.mp3"
}, {
cssSelectorAncestor: "#cp_container_1",
swfPath: "js",
wmode: "window", size : { width:"40px" },
  autoload: true
}
);

This works fine in mine, hope it is with you too.