Name is required.
Email address is required.
Invalid email address
Answer is required.
Exceeding max length of 5KB

Enabling/Disabling cc toggle based on condition

Hi I am Working with JWPLAYER 6.0 version.

There is a small requirement from client that if caption file not exist then just remove the cc button and if caption file exist then cc button will be there.
please sharwe your ideas asap.

<script type ="text/javascript">

jwplayer("myElement").setup({
playlist: [{
file: "jwplayer-7.2.2/MUNA.mp4",
image:"images.jpg",
titile: "My file",
displaytitle: true,
startparam: 'start',
primary: "html5",
tracks: [{
file: "jwplayer-7.2.2/MUNA.vtt",
label: "English",
kind: "captions",
"default": false

}
]

}],
captions: {
color: '#FF33F9',
fontSize: 24,
backgroundOpacity: 20
}

});

8 Community Answers

Up Down

Donni

JW Player Support Agent  
0 rated :

Is there anything preventing you from using JW 7? If there are no captions present, the CC button will not show up.

Up Down

Sudhir Ranjan Rout

User  
0 rated :

No,They don't want to upgrade the player they want this feature with jwplayer 6.0 version.

so if also any ajax call can be made for this like on success caption button will be shown and on failure caption button will hide.

Up Down

Donni

JW Player Support Agent  
0 rated :

The CC button should not appear in JW 6 if there are no captions present, do you have an example of the behavior you are reporting?

Also, please note: support for JW 6 will cease at the end of this year.

Up Down

Sudhir Ranjan Rout

User  
0 rated :

As of now if this is possible to hide & show the caption button though ajax call then let me know.

Up Down

Donni

JW Player Support Agent  
0 rated :

You shouldn’t need to use ajax at all, can you show me an embed you created that has a CC button when no captions are present?

Up Down

Sudhir Ranjan Rout

User  
0 rated :

<script type ="text/javascript">
var urlToFileVTT = 'jwplayer-7.2.2/MUNAA.vtt'; //this is the file not present but still this shows a caption button(cc
).
var urlToFileXML = 'jwplayer-7.2.2/MUNA.xml';

var myJwPlayer = jwplayer("myElement").setup({
playlist: [{
file: "jwplayer-7.2.2/MUNA.mp4",
image:"images.jpg",
titile: "My file",
displaytitle: true,
startparam: 'start',
modes: [
// {type: 'flash', src: 'jwplayer/player.swf'},
{type: 'flash'}
]

tracks: [{
file: urlToFileVTT || urlToFileXML,

label: "English",
// kind: "captions",
"default": false

}]

//}

}],
captions: {
color: '#FF33F9',
fontSize: 24,
backgroundOpacity: 20
}

});
console.log(myJwPlayer);
console.log(myJwPlayer.getRenderingMode());

myJwPlayer.onPlay(function(e) {
doesFileExist(urlToFileVTT);

alert("Volume is changed to: "+ e.play());
});


function doesFileExist(urlToFileVTT)
{
var xhr = new XMLHttpRequest();
xhr.open('HEAD',urlToFileVTT,false);
xhr.send();

if (xhr.status == "404") {

alert("File is not found");
console.log("File doesn't exist");

// console.log(eval(urlToFile));
doesFileExist(urlToFileXML);
return false;


} else {

alert("File is");
console.log("File exists");
// console.log("demo:"+eval(urlToFile));
// $("#myElement").hide();
$("#myElement").attr('disabled','disabled');
return true;

}
}

function doesFileExist(urlToFileXML)
{
var xhr = new XMLHttpRequest();
xhr.open('HEAD',urlToFileXML,false);
xhr.send();

if (xhr.status == "404") {

alert("File is not found");
console.log("File doesn't exist");
// console.log(eval(urlToFile));
$("#myElement").removeAttr('disabled');
return false;


} else {

alert("File is");
console.log("File exists");
// console.log("demo:"+eval(urlToFile));
$("#myElement").attr('disabled','disabled');
return true;

}
}


</script>

Up Down

Sudhir Ranjan Rout

User  
0 rated :

Hi Donni,Here is the updated code.

if i set null to the variable which i passed to check the url then cc button not loaded.

but the problem is after value return from ajax call then by default it sets value to its' original mode.

<script type ="text/javascript">
var urlToFileVTT = 'jwplayer-7.2.2/MUNAA.vtt';
// var urlToFileXML = 'jwplayer-7.2.2/MU11NA.xml';

var myJwPlayer = jwplayer("myElement").setup({
playlist: [{
file: "jwplayer-7.2.2/MUNA.mp4",
image:"images.jpg",
titile: "My file",
displaytitle: true,
startparam: 'start',
modes: [
// {type: 'flash', src: 'jwplayer/player.swf'},
{type: 'flash'}
],
tracks: [{
file: urlToFileVTT,

label: "English",
kind: "captions",
"default": false

}]

}],

"playlist.position": "right","playlist.size": 360,height: 270,width: 72,
captions: {
color: '#FF33F9',
fontSize: 24,
backgroundOpacity: 20
}

});
console.log(myJwPlayer);
console.log(myJwPlayer.getRenderingMode());

myJwPlayer.onPlay(function(e) {
doesFileExist(urlToFileVTT);
// doesFileExist(urlToFileXML);
alert("Volume is changed to: "+ e.play());
});


function doesFileExist(urlToFileVTT)
{
var xhr = new XMLHttpRequest();
xhr.open('HEAD',urlToFileVTT,false);
xhr.send();

if (xhr.status == "404") {

alert("File is not found");



urlToFileVTT = null;
console.log("File not exist"+urlToFileVTT);
return false;


} else {

alert("File is");
console.log("File exists");
alert(xhr.getAllResponseHeaders());
return true;

}

}

this is the updated code and the problem is if value which is returned from ajax call if i am able to set then my problem will be solved.

so please see this code and give me a perfect solution.

Up Down

George

JW Player Support Agent  
0 rated :

Hello Sudhir,

Here’s a test page:
http://qa.jwplayer.com.s3.amazonaws.com/~george/check_captions.html

Please keep in mind that we don’t write custom code implementations, any further debugging will be up to your team.

This question has received the maximum number of answers.