You need to sign in to do that
Don't have an account?
sfp
Salesforce1 app auto play and ended event jplayer not working.
Hi All,
Please help, this issue, I was working Jplayer audio should play in Android phones in salesforce1 app. Its working perfectly in IPAD and Iphone in salesforce1 app. Its not working in android salesforce1 app jplayer audio file auto play and ended event.
var ended_{!tid} = false;
var waitForProgress = true;
var myCirclePlayer_{!tid} = new CirclePlayer("#jquery_jplayer_1_{!tid}",{
mp3: "{!JSENCODE(FileUrl)}"
},
{
cssSelectorAncestor: "#cp_container_1_{!tid}",
loadeddata: function(){
if($.jPlayer.platform.android) {
alert("android loaded");
$("#jquery_jplayer_1_{!tid}").jPlayer("playHead",1);
}
},
setmedia: function() {
$("#jquery_jplayer_1_{!tid}").data('jPlayer').androidFix.setMedia = false;
alert("android setmedia");
},
progress: function() {
if(waitForProgress && $.jPlayer.platform.android) {
//alert('android');
waitForProgress = true;
//ShowTimer();
$("#jquery_jplayer_1_{!tid}").jPlayer("play");
}
},
canplay: function() {
//setInterval(8000);
if(waitForProgress && $.jPlayer.platform.android) {
//alert('android');
waitForProgress = false;
//ShowTimer();
$("#jquery_jplayer_1_{!tid}").jPlayer("play");
}else{
$("#jquery_jplayer_1_{!tid}").jPlayer("play");
}
},
play : function() {
// $("#jquery_jplayer_1_{!tid}").jPlayer("play");
},
ended: function () {
if($.jPlayer.platform.android) {
alert("android ended");
ended_{!tid} = true;
$("#jquery_jplayer_1_{!tid}").jPlayer("playHead",0);
} else {
alert("ios ended");
ended_{!tid} = true;
}
},
swfPath: "{!URLFOR($Resource.jplayermob, 'Jplayer.swf')}",
//swfPath: "http://jplayer.org/js",
solution: "flash, html",
supplied: "mp3, m4a",
wmode: "window",
size : { width:"40px" },
autoplay: true
});
<div id="jquery_jplayer_1_{!tid}"></div>
<div class="prototype-wrapper"> <!-- A wrapper to emulate use in a webpage and center align -->
<!-- The container for the interface can go where you want to display it. Show and hide it as you need. -->
<div id="cp_container_1_{!tid}">
<ul class="cp-controls">
<li><a class="cp-play" id="aplay_{!tid}" onclick="end_play_{!tid}();" tabindex="1">play</a></li>
<li><a class="cp-pause" id="apause_{!tid}" style="display:none;" tabindex="1">pause</a></li> <!-- Needs the inline style here, or jQuery.show() uses display:inline instead of display:block -->
</ul>
</div>
</div>
Please help, this issue, I was working Jplayer audio should play in Android phones in salesforce1 app. Its working perfectly in IPAD and Iphone in salesforce1 app. Its not working in android salesforce1 app jplayer audio file auto play and ended event.
var ended_{!tid} = false;
var waitForProgress = true;
var myCirclePlayer_{!tid} = new CirclePlayer("#jquery_jplayer_1_{!tid}",{
mp3: "{!JSENCODE(FileUrl)}"
},
{
cssSelectorAncestor: "#cp_container_1_{!tid}",
loadeddata: function(){
if($.jPlayer.platform.android) {
alert("android loaded");
$("#jquery_jplayer_1_{!tid}").jPlayer("playHead",1);
}
},
setmedia: function() {
$("#jquery_jplayer_1_{!tid}").data('jPlayer').androidFix.setMedia = false;
alert("android setmedia");
},
progress: function() {
if(waitForProgress && $.jPlayer.platform.android) {
//alert('android');
waitForProgress = true;
//ShowTimer();
$("#jquery_jplayer_1_{!tid}").jPlayer("play");
}
},
canplay: function() {
//setInterval(8000);
if(waitForProgress && $.jPlayer.platform.android) {
//alert('android');
waitForProgress = false;
//ShowTimer();
$("#jquery_jplayer_1_{!tid}").jPlayer("play");
}else{
$("#jquery_jplayer_1_{!tid}").jPlayer("play");
}
},
play : function() {
// $("#jquery_jplayer_1_{!tid}").jPlayer("play");
},
ended: function () {
if($.jPlayer.platform.android) {
alert("android ended");
ended_{!tid} = true;
$("#jquery_jplayer_1_{!tid}").jPlayer("playHead",0);
} else {
alert("ios ended");
ended_{!tid} = true;
}
},
swfPath: "{!URLFOR($Resource.jplayermob, 'Jplayer.swf')}",
//swfPath: "http://jplayer.org/js",
solution: "flash, html",
supplied: "mp3, m4a",
wmode: "window",
size : { width:"40px" },
autoplay: true
});
<div id="jquery_jplayer_1_{!tid}"></div>
<div class="prototype-wrapper"> <!-- A wrapper to emulate use in a webpage and center align -->
<!-- The container for the interface can go where you want to display it. Show and hide it as you need. -->
<div id="cp_container_1_{!tid}">
<ul class="cp-controls">
<li><a class="cp-play" id="aplay_{!tid}" onclick="end_play_{!tid}();" tabindex="1">play</a></li>
<li><a class="cp-pause" id="apause_{!tid}" style="display:none;" tabindex="1">pause</a></li> <!-- Needs the inline style here, or jQuery.show() uses display:inline instead of display:block -->
</ul>
</div>
</div>
PS: if this answers your question then hit Like and mark it as solution!
I did not get any errors in console. If I click on the play button in /one/one.app its not playing. In mobile Salesforce1 app its click on manually its playing. In android 4.4.4 version. In Ipad/Iphone autoplay its working perfectly.
Console this is the error, I am getting: I am using styleguide in herokuapp.
Font from origin 'https://sfdc-styleguide.herokuapp.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://nbvi.eu0.visual.force.com' is therefore not allowed access.
Please help this issue.
Kind Regards
PS: if this answers your question then hit Like and mark it as solution!