1
0
mirror of https://github.com/videojs/video.js.git synced 2025-01-25 11:13:52 +02:00

Close GH-609: Captions fixes. Fixes #564, Fixes #542

This commit is contained in:
Steve Heffernan 2013-06-28 13:06:50 -07:00
parent b4a07a3d9d
commit ffd308e305
5 changed files with 25 additions and 28 deletions

View File

@ -23,7 +23,7 @@
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4' />
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm' />
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg' />
<track kind="captions" src="demo.captions.vtt" srclang="en" label="English" />
<track kind="captions" src="demo.captions.vtt" srclang="en" label="English"></track><!-- Tracks need an ending tag thanks to IE9 -->
</video>
</body>

View File

@ -24,6 +24,7 @@
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'>
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'>
<source src="http://video-js.zencoder.com/oceans-clip.ogv" type='video/ogg'>
<track kind="captions" src="../build/demo-files/demo.captions.vtt" srclang="en" label="English"></track><!-- Tracks need an ending tag thanks to IE9 -->
<p>Video Playback Not Supported</p>
</video>

View File

@ -710,23 +710,10 @@ so you can upgrade to newer versions easier. You can remove all these styles by
.vjs-default-skin .vjs-subtitles-button:before { content: "\e00c"; }
/* There's unfortunately no CC button in FontAwesome, so we need
to manually create one. Please +1 the fontawesome request.
to use another font. Please +1 the fontawesome request.
https://github.com/FortAwesome/Font-Awesome/issues/968 */
.vjs-default-skin .vjs-captions-button {
font-size: 1em; /* Font icons are 1.5em */
}
.vjs-default-skin .vjs-captions-button:before {
content: "\e008";
font-family: VideoJS;
font-size: 1.5em;
line-height: 2;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
text-shadow: none;
}

View File

@ -3,7 +3,9 @@
*/
// HTML5 Shiv. Must be in <head> to support older browsers.
document.createElement('video');document.createElement('audio');
document.createElement('video');
document.createElement('audio');
document.createElement('track');
/**
* Doubles as the main function for users to create a player instance and also

View File

@ -113,22 +113,18 @@ vjs.Player.prototype.getTagSettings = function(tag){
// Get tag children settings
if (tag.hasChildNodes()) {
var child, childName,
children = tag.childNodes,
i = 0,
j = children.length;
var children, child, childName, i, j;
for (; i < j; i++) {
children = tag.childNodes;
for (i=0,j=children.length; i<j; i++) {
child = children[i];
// Change case needed: http://ejohn.org/blog/nodename-case-sensitivity/
childName = child.nodeName.toLowerCase();
if (childName === 'source') {
options['sources'].push(vjs.getAttributeValues(child));
} else if (childName === 'track') {
options['tracks'].push(vjs.getAttributeValues(child));
}
}
}
@ -148,12 +144,23 @@ vjs.Player.prototype.createEl = function(){
// so we'll need to turn off any default tracks if we're manually doing
// captions and subtitles. videoElement.textTracks
if (tag.hasChildNodes()) {
var nrOfChildNodes = tag.childNodes.length;
for (var i=0,j=tag.childNodes;i<nrOfChildNodes;i++) {
if (j[0].nodeName.toLowerCase() == 'source' || j[0].nodeName.toLowerCase() == 'track') {
tag.removeChild(j[0]);
var nodes, nodesLength, i, node, nodeName, removeNodes;
nodes = tag.childNodes;
nodesLength = nodes.length;
removeNodes = [];
while (nodesLength--) {
node = nodes[nodesLength];
nodeName = node.nodeName.toLowerCase();
if (nodeName === 'source' || nodeName === 'track') {
removeNodes.push(node);
}
}
for (i=0; i<removeNodes.length; i++) {
tag.removeChild(removeNodes[i]);
}
}
// Make sure tag ID exists