Comparar commits

..

1 Commits

Autor SHA1 Mensagem Data
Gary Katsevman 326aa541c1 v5.9.2 dist 2016-04-19 17:36:18 -04:00
215 arquivos alterados com 43301 adições e 50888 exclusões
-4
Ver Arquivo
@@ -1,4 +0,0 @@
{
"presets": ["es2015-loose"],
"plugins": ["transform-es3-property-literals", "transform-es3-member-expression-literals", "inline-json"]
}
-1
Ver Arquivo
@@ -28,6 +28,5 @@ test/coverage/*
.sass-cache
dist/*
es5/*
.idea/
+47
Ver Arquivo
@@ -0,0 +1,47 @@
{
"evil" : true,
"validthis": true,
"node" : true,
"debug" : true,
"boss" : true,
"expr" : true,
"eqnull" : true,
"quotmark" : "single",
"sub" : true,
"trailing" : true,
"undef" : true,
"laxbreak" : true,
"esnext" : true,
"eqeqeq" : true,
"predef" : [
"_V_",
"goog",
"console",
"require",
"define",
"module",
"exports",
"process",
"q",
"asyncTest",
"deepEqual",
"equal",
"expect",
"module",
"notDeepEqual",
"notEqual",
"notStrictEqual",
"ok",
"throws",
"QUnit",
"raises",
"start",
"stop",
"strictEqual",
"test",
"throws",
"sinon"
]
}
-1
Ver Arquivo
@@ -1,5 +1,4 @@
# Exclude everything but the contents of the dist directory.
**/*
!dist/**
!es5/**
!src/css/**
+1 -1
Ver Arquivo
@@ -1,6 +1,6 @@
language: node_js
node_js:
- 4.4
- 0.12
before_install:
- export CHROME_BIN=chromium-browser
- export DISPLAY=:99.0
-112
Ver Arquivo
@@ -6,118 +6,6 @@ _(none)_
--------------------
## 5.12.0 (2016-08-25)
* @misteroneill, @BrandonOCasey, and @pagarwal123 updates all the code to pass the linter ([view](https://github.com/videojs/video.js/pull/3459))
* @misteroneill added ghooks to run linter on git push ([view](https://github.com/videojs/video.js/pull/3459))
* @BrandonOCasey removed unused base-styles.js file ([view](https://github.com/videojs/video.js/pull/3486))
* @erikyuzwa, @gkatsev updated CSS build to inlcude the IE8-specific CSS from a separate file instead of it being inside of sass ([view](https://github.com/videojs/video.js/pull/3380)) ([view2](https://github.com/erikyuzwa/video.js/pull/1))
* @gkatsev added null checks around navigator.userAgent ([view](https://github.com/videojs/video.js/pull/3502))
* greenkeeper updated karma dependencies ([view](https://github.com/videojs/video.js/pull/3523))
* @BrandonOCasey updated language docs to link to IANA language registry ([view](https://github.com/videojs/video.js/pull/3493))
* @gkatsev removed unused dependencies ([view](https://github.com/videojs/video.js/pull/3516))
* @misteroneill enabled and updated videojs-standard and fixed an issue with linting ([view](https://github.com/videojs/video.js/pull/3508))
* @misteroneill updated tests to qunit 2.0 ([view](https://github.com/videojs/video.js/pull/3509))
* @gkatsev added slack badge to README ([view](https://github.com/videojs/video.js/pull/3527))
* @gkatsev reverted back to qunitjs 1.x to unbreak IE8. Added es5-shim to tests ([view](https://github.com/videojs/video.js/pull/3533))
* @gkatsev updated build system to open es5 folder for bundles and dist folder other users ([view](https://github.com/videojs/video.js/pull/3445))
* greenkeeper updated uglify ([view](https://github.com/videojs/video.js/pull/3547))
* greenkeeper updated grunt-concurrent ([view](https://github.com/videojs/video.js/pull/3532))
* greenkeeper updated karma-chrome-launcher ([view](https://github.com/videojs/video.js/pull/3553))
* @gkatsev added tests for webpack and browserify bundling and node.js requiring ([view](https://github.com/videojs/video.js/pull/3558))
* @rlchung fixed tests that weren't disposing players when they finished ([view](https://github.com/videojs/video.js/pull/3524))
## 5.11.5 (2016-08-25)
* @misteroneill fixed wrapping native and emulated MediaErrors ([view](https://github.com/videojs/video.js/pull/3562))
* @snyderizer fixed switching between audio tracks. Fixes #3510 ([view](https://github.com/videojs/video.js/pull/3538))
* @jbarabander added title attribute to audio button. Fixes #3528 ([view](https://github.com/videojs/video.js/pull/3565))
* @misteroneill fixed IE8 media error test failure ([view](https://github.com/videojs/video.js/pull/3568))
## 5.11.4 (2016-08-16)
_(none)_
## 5.11.3 (2016-08-15)
* @vdeshpande fixed control text for fullscreen button ([view](https://github.com/videojs/video.js/pull/3485))
* @mister-ben fixed android treating swipe as a tap ([view](https://github.com/videojs/video.js/pull/3514))
* @mboles updated duration() method documentation ([view](https://github.com/videojs/video.js/pull/3515))
* @mister-ben silenced chrome's play() request was interrupted by pause() error ([view](https://github.com/videojs/video.js/pull/3518))
## 5.11.2 (2016-08-09)
_(none)_
## 5.11.1 (2016-08-08)
* @vxsx fixed legend selector to be more specific. Fixes #3492 ([view](https://github.com/videojs/video.js/pull/3494))
## 5.11.0 (2016-07-22)
* @BrandonOCasey Document audio/video track usage ([view](https://github.com/videojs/video.js/pull/3295))
* @hartman Correct documentation to refer to nativeTextTracks option ([view](https://github.com/videojs/video.js/pull/3309))
* @nickygerritsen Also pass tech options to canHandleSource ([view](https://github.com/videojs/video.js/pull/3303))
* @misteroneill Un-deprecate the videojs.players property ([view](https://github.com/videojs/video.js/pull/3299))
* @nickygerritsen Add title to all clickable components ([view](https://github.com/videojs/video.js/pull/3296))
* @nickygerritsen Update Dutch language file ([view](https://github.com/videojs/video.js/pull/3297))
* @hartman Add descriptions and audio button to adaptive classes ([view](https://github.com/videojs/video.js/pull/3312))
* @MattiasBuelens Retain details from tech error ([view](https://github.com/videojs/video.js/pull/3313))
* @nickygerritsen Fix test for tooltips in IE8 ([view](https://github.com/videojs/video.js/pull/3327))
* @mboles added loadstart event to jsdoc ([view](https://github.com/videojs/video.js/pull/3370))
* @hartman added default print styling ([view](https://github.com/videojs/video.js/pull/3304))
* @ldayananda updated videojs to not do anything if no src is set ([view](https://github.com/videojs/video.js/pull/3378))
* @nickygerritsen removed unused tracks when changing sources. Fixes #3000 ([view](https://github.com/videojs/video.js/pull/3002))
* @vit-koumar updated Flash tech to return Infinity from duration instead of -1 ([view](https://github.com/videojs/video.js/pull/3128))
* @alex-phillips added ontextdata to Flash tech ([view](https://github.com/videojs/video.js/pull/2748))
* @MattiasBuelens updated components to use durationchange only ([view](https://github.com/videojs/video.js/pull/3349))
* @misteroneill improved Logging for IE < 11 ([view](https://github.com/videojs/video.js/pull/3356))
* @vdeshpande updated control text of modal dialog ([view](https://github.com/videojs/video.js/pull/3400))
* @ldayananda fixed mouse handling on menus by using mouseleave over mouseout ([view](https://github.com/videojs/video.js/pull/3404))
* @mister-ben updated language to inherit correctly and respect the attribute on the player ([view](https://github.com/videojs/video.js/pull/3426))
* @sashyro fixed nativeControlsForTouch option ([view](https://github.com/videojs/video.js/pull/3410))
* @tbasse fixed techCall null check against tech ([view](https://github.com/videojs/video.js/pull/2676))
* @rbran100 checked src and currentSrc in handleTechReady to work around mixed content issues in chrome ([view](https://github.com/videojs/video.js/pull/3287))
* @OwenEdwards fixed caption settings dialog labels for accessibility ([view](https://github.com/videojs/video.js/pull/3281))
* @OwenEdwards removed spurious head tags in the simple-embed example ([view](https://github.com/videojs/video.js/pull/3438))
* @ntadej added a null check to errorDisplay usage ([view](https://github.com/videojs/video.js/pull/3440))
* @misteroneill fixed logging issues on IE by separating fn.apply and stringify checks ([view](https://github.com/videojs/video.js/pull/3444))
* @misteroneill fixed npm test from running coveralls locally ([view](https://github.com/videojs/video.js/pull/3449))
* @gkatsev added es6-shim to tests. Fixes Flash duration test ([view](https://github.com/videojs/video.js/pull/3453))
* @misteroneill corrects test assertions for older IEs in the log module ([view](https://github.com/videojs/video.js/pull/3454))
* @gkatsev fixed setting lang by looping through loop element variable and not constant tag ([view](https://github.com/videojs/video.js/pull/3455))
## 5.10.8 (2016-08-08)
* @gkatsev re-published to make sure that the audio button has css
## 5.10.7 (2016-06-27)
* @gkatsev pinned node-sass to 3.4 ([view](https://github.com/videojs/video.js/pull/3401))
* @mister-ben added try catch to volume and playbackrate checks. Fixes #3315 ([view](https://github.com/videojs/video.js/pull/3320))
* @m14t removed unused loadEvent property in ControlBar options ([view](https://github.com/videojs/video.js/pull/3363))
* @bklava updated pt-BR language file ([view](https://github.com/videojs/video.js/pull/3373))
* @mister-ben updated menus to use default videojs font-family ([view](https://github.com/videojs/video.js/pull/3384))
* @vdeshpande fixed chapters getting duplicated each time a track is loaded ([view](https://github.com/videojs/video.js/pull/3354))
## 5.10.6 (2016-06-20)
* @gkatsev fix not fully minified video.min.js file.
## 5.10.5 (2016-06-07)
* @gkatsev pinned dependencies to direct versions ([view](https://github.com/videojs/video.js/pull/3338))
* @gkatsev fixed minified vjs in ie8 when initialized with id string ([view](https://github.com/videojs/video.js/pull/3357))
* @IJsLauw fixed unhandled exception in deleting poster on ios7 ([view](https://github.com/videojs/video.js/pull/3337))
## 5.10.4 (2016-05-31)
* Patch release to fix dist on npm
## 5.10.3 (2016-05-27)
* @BrandonOCasey fixed source handlers being disposed multiple times when a video is put into the video element directly ([view](https://github.com/videojs/video.js/pull/3343))
## 5.10.2 (2016-05-12)
* @gkatsev nulled out currentSource_ in setSource ([view](https://github.com/videojs/video.js/pull/3314))
## 5.10.1 (2016-05-03)
* @nickygerritsen Pass tech options to source handlers ([view](https://github.com/videojs/video.js/pull/3245))
* @gkatsev Use fonts 2.0 that do not require wrapping codepoints ([view](https://github.com/videojs/video.js/pull/3252))
* @chrisauclair Make controls visible for accessibility reasons ([view](https://github.com/videojs/video.js/pull/3237))
* @gkatsev updated text track documentation and crossorigin warning. Fixes #1888, #1958, #2628, #3202 ([view](https://github.com/videojs/video.js/pull/3256))
* @BrandonOCasey added audio and video track support ([view](https://github.com/videojs/video.js/pull/3173))
* @OwenEdwards added language attribute in HTML files for accessibility ([view](https://github.com/videojs/video.js/pull/3257))
* @incompl clear currentSource_ after subsequent loadstarts ([view](https://github.com/videojs/video.js/pull/3285))
* @forbesjo add an audio track selector menu button ([view](https://github.com/videojs/video.js/pull/3223))
## 5.9.2 (2016-04-19)
* @gkatsev grouped text track errors in the console, if we can ([view](https://github.com/videojs/video.js/pull/3259))
+1 -1
Ver Arquivo
@@ -1,4 +1,4 @@
require('babel-register');
require('babel/register');
// Need to `require` a separate Grunt file so we can use ES6 syntax via
// Babel's require hook.
-2
Ver Arquivo
@@ -3,8 +3,6 @@
# [Video.js - HTML5 Video Player](http://videojs.com)
[![Build Status](https://travis-ci.org/videojs/video.js.svg?branch=master)](https://travis-ci.org/videojs/video.js)
[![Coverage Status](https://coveralls.io/repos/github/videojs/video.js/badge.svg?branch=master)](https://coveralls.io/github/videojs/video.js?branch=master)
[![Slack Status](http://slack.videojs.com/badge.svg)](http://slack.videojs.com)
[![NPM](https://nodei.co/npm/video.js.png?downloads=true&downloadRank=true)](https://nodei.co/npm/video.js/)
+70 -75
Ver Arquivo
@@ -1,6 +1,4 @@
import {gruntCustomizer, gruntOptionsMaker} from './options-customizer.js';
import chg from 'chg';
module.exports = function(grunt) {
require('time-grunt')(grunt);
@@ -18,10 +16,29 @@ module.exports = function(grunt) {
const browserifyGruntDefaults = {
browserifyOptions: {
debug: true,
standalone: 'videojs'
},
plugin: [
['browserify-derequire']
],
transform: [
require('babelify').configure({
sourceMapRelative: './',
loose: ['all']
}),
['browserify-versionify', {
placeholder: '__VERSION__',
version: pkg.version
}],
['browserify-versionify', {
placeholder: '__VERSION_NO_PATCH__',
version: version.majorMinor
}],
['browserify-versionify', {
placeholder: '__SWF_VERSION__',
version: pkg.dependencies['videojs-swf']
}]
]
};
@@ -30,7 +47,7 @@ module.exports = function(grunt) {
release: {
tag_name: 'v'+ version.full,
name: version.full,
body: chg.find(version.full).changesRaw
body: require('chg').find(version.full).changesRaw
},
},
files: {
@@ -94,11 +111,22 @@ module.exports = function(grunt) {
grunt.initConfig({
pkg,
clean: {
build: ['build/temp/*', 'es5'],
build: ['build/temp/*'],
dist: ['dist/*']
},
jshint: {
src: {
src: ['src/js/**/*.js', 'Gruntfile.js', 'test/unit/**/*.js'],
options: {
jshintrc: '.jshintrc'
}
}
},
uglify: {
options: {
sourceMap: true,
sourceMapIn: 'build/temp/video.js.map',
sourceMapRoot: '../../src/js',
preserveComments: 'some',
mangle: true,
compress: {
@@ -131,11 +159,7 @@ module.exports = function(grunt) {
},
skin: {
files: ['src/css/**/*'],
tasks: ['skin']
},
babel: {
files: ['src/js/**/*.js'],
tasks: ['babel:es5']
tasks: ['sass', 'wrapcodepoints']
},
jshint: {
files: ['src/**/*', 'test/unit/**/*.js', 'Gruntfile.js'],
@@ -301,21 +325,11 @@ module.exports = function(grunt) {
}
})
},
babel: {
es5: {
files: [{
expand: true,
cwd: 'src/js/',
src: ['**/*.js', '!base-styles.js'],
dest: 'es5/'
}]
}
},
browserify: {
options: browserifyGruntOptions(),
build: {
files: {
'build/temp/video.js': ['es5/video.js']
'build/temp/video.js': ['src/js/video.js']
}
},
dist: {
@@ -328,7 +342,7 @@ module.exports = function(grunt) {
]
}),
files: {
'build/temp/video.js': ['es5/video.js']
'build/temp/video.js': ['src/js/video.js']
}
},
watch: {
@@ -337,15 +351,14 @@ module.exports = function(grunt) {
keepAlive: true
},
files: {
'build/temp/video.js': ['es5/video.js']
'build/temp/video.js': ['src/js/video.js']
}
},
tests: {
options: {
browserifyOptions: {
verbose: true,
standalone: false,
transform: ['babelify']
debug: true,
standalone: false
},
plugin: [
['proxyquireify/plugin']
@@ -362,6 +375,14 @@ module.exports = function(grunt) {
}
}
},
exorcise: {
build: {
options: {},
files: {
'build/temp/video.js.map': ['build/temp/video.js'],
}
}
},
coveralls: {
options: {
// warn instead of failing when coveralls errors
@@ -373,30 +394,25 @@ module.exports = function(grunt) {
}
},
concat: {
options: {
separator: '\n'
},
novtt: {
options: {
separator: '\n'
},
src: ['build/temp/video.js'],
dest: 'build/temp/alt/video.novtt.js'
},
vtt: {
options: {
separator: '\n',
},
src: ['build/temp/video.js', 'node_modules/videojs-vtt.js/dist/vtt.js'],
dest: 'build/temp/video.js'
dest: 'build/temp/video.js',
},
ie8_addition: {
src: ['build/temp/video-js.css', 'src/css/ie8.css'],
dest: 'build/temp/video-js.css'
}
},
concurrent: {
options: {
logConcurrentOutput: true
},
tests: [
'watch:babel',
'browserify:tests'
],
// Run multiple watch tasks in parallel
// Needed so watchify can cache intelligently
watchAll: [
@@ -427,32 +443,6 @@ module.exports = function(grunt) {
src: ['build/temp/video.js']
}
}
},
shell: {
lint: {
command: 'npm run lint',
options: {
preferLocal: true
}
},
noderequire: {
command: 'node test/require/node.js',
options: {
failOnError: true
}
},
browserify: {
command: 'browserify test/require/browserify.js -o build/temp/browserify.js',
options: {
preferLocal: true
}
},
webpack: {
command: 'webpack test/require/webpack.js build/temp/webpack.js',
options: {
preferLocal: true
}
}
}
});
@@ -460,21 +450,21 @@ module.exports = function(grunt) {
require('load-grunt-tasks')(grunt);
grunt.loadNpmTasks('videojs-doc-generator');
grunt.loadNpmTasks('chg');
grunt.loadNpmTasks('gkatsev-grunt-sass');
const buildDependents = [
'shell:lint',
'clean:build',
'babel:es5',
'jshint',
'browserify:build',
'exorcise:build',
'concat:novtt',
'concat:vtt',
'usebanner:novtt',
'usebanner:vtt',
'uglify',
'skin',
'sass',
'wrapcodepoints',
'version:css',
'cssmin',
@@ -499,18 +489,23 @@ module.exports = function(grunt) {
'zip:dist'
]);
grunt.registerTask('skin', ['sass', 'concat:ie8_addition']);
// Sass turns unicode codepoints into utf8 characters.
// We don't want that so we unwrapped them in the templates/scss.hbs file.
// After sass has generated our css file, we need to wrap the codepoints
// in quotes for it to work.
grunt.registerTask('wrapcodepoints', function() {
const sassConfig = grunt.config.get('sass.build.files');
const cssPath = Object.keys(sassConfig)[0];
const css = grunt.file.read(cssPath);
grunt.file.write(cssPath, css.replace(/(\\f\w+);/g, "'$1';"));
});
grunt.registerTask('skin', ['sass', 'wrapcodepoints']);
// Default task - build and test
grunt.registerTask('default', ['test']);
// The test script includes coveralls only when the TRAVIS env var is set.
grunt.registerTask('test', [
'build',
'shell:noderequire',
'shell:browserify',
'shell:webpack',
'karma:defaults'].concat(process.env.TRAVIS && 'coveralls').filter(Boolean));
grunt.registerTask('test', ['build', 'karma:defaults']);
// Run while developing
grunt.registerTask('dev', ['build', 'connect:dev', 'concurrent:watchSandbox']);
+1 -1
Ver Arquivo
@@ -1,7 +1,7 @@
module.exports = function(grunt) {
grunt.registerTask('cdn-links', 'Update the version of CDN links in docs', function(){
let doc = grunt.file.read('docs/guides/setup.md');
let version = require('../../package.json').version;
let version = require('../package.json').version;
// remove the patch version to point to the latest patch
version = version.replace(/(\d+\.\d+)\.\d+/, '$1');
-35
Ver Arquivo
@@ -1,35 +0,0 @@
module.exports = function(grunt) {
grunt.registerTask('check-translations', 'Check that translations are up to date', function(){
const source = require('../../lang/en.json');
const table = require('markdown-table');
let doc = grunt.file.read('docs/translations-needed.md');
const tableRegex = /(<!-- START langtable -->)(.|\n)*(<!-- END langtable -->)/;
let tableData = [['Language file', 'Missing translations']];
grunt.file.recurse('lang', (abspath, rootdir, subdir, filename) => {
if (filename === 'en.json') {
return;
}
const target = require(`../../${abspath}`);
let missing = [];
for (const string in source) {
if (!target[string]) {
grunt.log.writeln(`${filename} missing "${string}"`);
missing.push(string);
}
}
if (missing.length > 0) {
grunt.log.error(`${filename} is missing ${missing.length} translations.`);
tableData.push([`${filename} (missing ${missing.length})`, missing[0]]);
for (var i = 1; i < missing.length; i++) {
tableData.push(['', missing[i]]);
}
} else {
grunt.log.ok(`${filename} is up to date.`);
tableData.push([`${filename} (Complete)`, '']);
}
});
doc = doc.replace(tableRegex, `$1\n` + table(tableData) + `\n$3`);
grunt.file.write('docs/translations-needed.md', doc);
});
};
+24
Ver Arquivo
@@ -0,0 +1,24 @@
module.exports = function(grunt) {
grunt.registerTask('saucelabs', function() {
const exec = require('child_process').exec;
const done = this.async();
if (this.args[0] == 'connect') {
exec('curl https://gist.githubusercontent.com/santiycr/5139565/raw/sauce_connect_setup.sh | bash',
function(error, stdout, stderr) {
if (error) {
grunt.log.error(error);
return done();
}
grunt.verbose.error(stderr.toString());
grunt.verbose.writeln(stdout.toString());
grunt.task.run(['karma:saucelabs']);
done();
});
} else {
grunt.task.run(['karma:saucelabs']);
done();
}
});
}
+1 -1
Ver Arquivo
@@ -1,7 +1,7 @@
{
"name": "video.js",
"description": "An HTML5 and Flash video player with a common API and skin for both.",
"version": "5.12.0",
"version": "5.9.2",
"keywords": [
"videojs",
"html5",
+45 -74
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+1 -1
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+18420 -20422
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+10 -13
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+1 -1
Ver Arquivo
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8" />
<title>Video.js Text Descriptions, Chapters &amp; Captions Example</title>
+4 -1
Ver Arquivo
@@ -1,13 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<head>
<title>Video.js | HTML5 Video Player</title>
<link href="http://vjs.zencdn.net/5.0.2/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/ie8/1.1.0/videojs-ie8.min.js"></script>
<script src="http://vjs.zencdn.net/5.0.2/video.js"></script>
</head>
</head>
<body>
BIN
Ver Arquivo
Arquivo binário não exibido.
-3
Ver Arquivo
@@ -94,9 +94,6 @@
<glyph glyph-name="audio-description"
unicode="&#xF11D;"
horiz-adv-x="1792" d=" M795.5138904615 457.270933L795.5138904615 1221.5248286325C971.84576475 1225.085121904 1107.39330415 1232.12360523 1207.223857 1161.5835220499998C1303.033991 1093.8857027 1377.7922305 962.20560625 1364.3373135 792.9476205000001C1350.102593 613.9029365000001 1219.6655764999998 463.4600215 1050.12389545 448.2843645000001C965.8259268 440.7398275000001 798.21890505 448.2843645000001 798.21890505 448.2843645000001C798.21890505 448.2843645000001 795.2791410655 453.016494 795.5138904615 457.270933M966.1564647 649.0863960000001C1076.16084135 644.6767075 1152.385591 707.3020429999999 1163.8910079999998 807.9351875C1179.2994744999999 942.71878505 1089.73043585 1030.3691748 960.74508635 1020.7227954L960.74508635 658.08043C960.6196169500002 652.9482330000001 962.7606933 650.3134680000001 966.1564647 649.0863960000001 M1343.2299685 457.3517725000002C1389.9059734 444.3690160000001 1404.0840274999998 496.0596970000001 1424.48294065 532.2791494999999C1469.0084255 611.2788500000001 1502.5101322 712.8584189999999 1503.0416912 828.9881705C1503.8147453000001 995.5680973 1438.8404296 1117.7973688000002 1378.4383305 1200.62456881045L1348.652139905 1200.62456881045C1346.6001063899998 1187.06858424 1356.44474056 1175.024791325 1362.18395859 1164.6588891000001C1408.2649952 1081.49431985 1450.96645015 966.7230041 1451.57490975 834.9817034999999C1452.27106325 683.8655425000002 1402.00636065 557.5072264999999 1343.2299685 457.3517725000002 M1488.0379675 457.3517725000002C1534.7139723999999 444.3690160000001 1548.8825828 496.0671625 1569.29093965 532.2791494999999C1613.8164245 611.2788500000001 1647.3113856500001 712.8584189999999 1647.8496902000002 828.9881705C1648.6227442999998 995.5680973 1583.6484286 1117.7973688000002 1523.2463295 1200.62456881045L1493.460138905 1200.62456881045C1491.40810539 1187.06858424 1501.250041305 1175.021805755 1506.9919575899999 1164.6588891000001C1553.0729942 1081.49431985 1595.7757984 966.7230041 1596.3829087499998 834.9817034999999C1597.07906225 683.8655425000002 1546.8143596500001 557.5072264999999 1488.0379675 457.3517725000002 M1631.9130380000001 457.3517725000002C1678.5890429 444.3690160000001 1692.7576533 496.0671625 1713.1660101500001 532.2791494999999C1757.691495 611.2788500000001 1791.1864561500001 712.8584189999999 1791.7247607000002 828.9881705C1792.4978148 995.5680973 1727.5234991000002 1117.7973688000002 1667.1214 1200.62456881045L1637.3352094050001 1200.62456881045C1635.28317589 1187.06858424 1645.1251118050002 1175.02329854 1650.86702809 1164.6588891000001C1696.9480647 1081.49431985 1739.64951965 966.7230041 1740.25797925 834.9817034999999C1740.95413275 683.8655425000002 1690.6894301500001 557.5072264999999 1631.9130380000001 457.3517725000002 M15.66796875 451.481947L254.03034755 451.481947L319.0356932 551.1747990000001L543.6261075 551.6487970000001C543.6261075 551.6487970000001 543.8541115 483.7032095 543.8541115 451.481947L714.4993835 451.481947L714.4993835 1230.9210795L508.643051 1230.9210795C488.8579955 1197.5411595 15.66796875 451.481947 15.66796875 451.481947L15.66796875 451.481947zM550.0048155000001 959.9708615L550.0048155000001 710.916297L408.4199 711.8642895L550.0048155000001 959.9708615L550.0048155000001 959.9708615z" />
<glyph glyph-name="audio"
unicode="&#xF11E;"
horiz-adv-x="1792" d=" M896 1717.3333333333333C524.9066666666668 1717.3333333333333 224 1416.4266666666667 224 1045.3333333333333V522.6666666666665C224 399.0933333333333 324.4266666666667 298.6666666666665 448 298.6666666666665H672V896H373.3333333333334V1045.3333333333333C373.3333333333334 1333.92 607.4133333333334 1568 896 1568S1418.6666666666667 1333.92 1418.6666666666667 1045.3333333333333V896H1120V298.6666666666665H1344C1467.5733333333335 298.6666666666665 1568 399.0933333333333 1568 522.6666666666665V1045.3333333333333C1568 1416.4266666666667 1267.0933333333332 1717.3333333333333 896 1717.3333333333333z" />
</font>
</defs>
</svg>

Antes

Largura:  |  Altura:  |  Tamanho: 26 KiB

Depois

Largura:  |  Altura:  |  Tamanho: 25 KiB

BIN
Ver Arquivo
Arquivo binário não exibido.
BIN
Ver Arquivo
Arquivo binário não exibido.
+1 -7
Ver Arquivo
@@ -30,11 +30,5 @@ videojs.addLanguage("de",{
"This modal can be closed by pressing the Escape key or activating the close button.": "Durch Drücken der Esc-Taste bzw. Betätigung der Schaltfläche \"Schließen\" wird dieses modale Fenster geschlossen.",
", opens captions settings dialog": ", öffnet Einstellungen für Untertitel",
", opens subtitles settings dialog": ", öffnet Einstellungen für Untertitel",
", selected": ", ausgewählt",
"Close Modal Dialog": "Modales Fenster schließen",
"Descriptions": "Beschreibungen",
"descriptions off": "Beschreibungen aus",
"The media is encrypted and we do not have the keys to decrypt it.": "Die Entschlüsselungsschlüssel für den verschlüsselten Medieninhalt sind nicht verfügbar.",
", opens descriptions settings dialog": ", öffnet Einstellungen für Beschreibungen",
"Audio Track": "Tonspur"
", selected": " (ausgewählt)"
});
-3
Ver Arquivo
@@ -18,16 +18,13 @@ videojs.addLanguage("en",{
"Captions": "Captions",
"captions off": "captions off",
"Chapters": "Chapters",
"Close Modal Dialog": "Close Modal Dialog",
"Descriptions": "Descriptions",
"descriptions off": "descriptions off",
"Audio Track": "Audio Track",
"You aborted the media playback": "You aborted the media playback",
"A network error caused the media download to fail part-way.": "A network error caused the media download to fail part-way.",
"The media could not be loaded, either because the server or network failed or because the format is not supported.": "The media could not be loaded, either because the server or network failed or because the format is not supported.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "The media playback was aborted due to a corruption problem or because the media used features your browser did not support.",
"No compatible source was found for this media.": "No compatible source was found for this media.",
"The media is encrypted and we do not have the keys to decrypt it.": "The media is encrypted and we do not have the keys to decrypt it.",
"Play Video": "Play Video",
"Close": "Close",
"Modal Window": "Modal Window",
+3 -16
Ver Arquivo
@@ -15,25 +15,12 @@ videojs.addLanguage("fr",{
"Playback Rate": "Vitesse de lecture",
"Subtitles": "Sous-titres",
"subtitles off": "Sous-titres désactivés",
"Captions": "Sous-titres transcrits",
"captions off": "Sous-titres transcrits désactivés",
"Captions": "Sous-titres",
"captions off": "Sous-titres désactivés",
"Chapters": "Chapitres",
"Close Modal Dialog": "Fermer la boîte de dialogue modale",
"Descriptions": "Descriptions",
"descriptions off": "descriptions désactivées",
"Audio Track": "Piste audio",
"You aborted the media playback": "Vous avez interrompu la lecture de la vidéo.",
"A network error caused the media download to fail part-way.": "Une erreur de réseau a interrompu le téléchargement de la vidéo.",
"The media could not be loaded, either because the server or network failed or because the format is not supported.": "Cette vidéo n'a pas pu être chargée, soit parce que le serveur ou le réseau a échoué ou parce que le format n'est pas reconnu.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "La lecture de la vidéo a été interrompue à cause d'un problème de corruption ou parce que la vidéo utilise des fonctionnalités non prises en charge par votre navigateur.",
"No compatible source was found for this media.": "Aucune source compatible n'a été trouvée pour cette vidéo.",
"Play Video": "Lire la vidéo",
"Close": "Fermer",
"Modal Window": "Fenêtre modale",
"This is a modal window": "Ceci est une fenêtre modale",
"This modal can be closed by pressing the Escape key or activating the close button.": "Ce modal peut être fermé en appuyant sur la touche Échap ou activer le bouton de fermeture.",
", opens captions settings dialog": ", ouvrir les paramètres des sous-titres transcrits",
", opens subtitles settings dialog": ", ouvrir les paramètres des sous-titres",
", opens descriptions settings dialog": ", ouvrir les paramètres des descriptions",
", selected": ", sélectionné"
"No compatible source was found for this media.": "Aucune source compatible n'a été trouvée pour cette vidéo."
});
+4 -15
Ver Arquivo
@@ -14,24 +14,13 @@ videojs.addLanguage("nl",{
"Unmute": "Geluid aan",
"Playback Rate": "Weergavesnelheid",
"Subtitles": "Ondertiteling",
"subtitles off": "ondertiteling uit",
"Captions": "Bijschriften",
"captions off": "bijschriften uit",
"subtitles off": "Ondertiteling uit",
"Captions": "Ondertiteling",
"captions off": "Ondertiteling uit",
"Chapters": "Hoofdstukken",
"Descriptions": "Beschrijvingen",
"descriptions off": "beschrijvingen off",
"You aborted the media playback": "U hebt de mediaweergave afgebroken.",
"A network error caused the media download to fail part-way.": "De mediadownload is mislukt door een netwerkfout.",
"The media could not be loaded, either because the server or network failed or because the format is not supported.": "De media kon niet worden geladen, vanwege een server- of netwerkfout of doordat het formaat niet wordt ondersteund.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "De mediaweergave is afgebroken vanwege beschadigde data of het mediabestand gebruikt functies die niet door uw browser worden ondersteund.",
"No compatible source was found for this media.": "Voor deze media is geen ondersteunde bron gevonden.",
"Play Video": "Video Afspelen",
"Close": "Sluiten",
"Modal Window": "Modal Venster",
"This is a modal window": "Dit is een modaal venster",
"This modal can be closed by pressing the Escape key or activating the close button.": "Dit modaal venster kan gesloten worden door op Escape te drukken of de 'sluiten' knop te activeren.",
", opens captions settings dialog": ", opent bijschriften instellingen venster",
", opens subtitles settings dialog": ", opent ondertiteling instellingen venster",
", opens descriptions settings dialog": ", opent beschrijvingen instellingen venster",
", selected": ", selected"
"No compatible source was found for this media.": "Voor deze media is geen ondersteunde bron gevonden."
});
+3 -3
Ver Arquivo
@@ -1,6 +1,6 @@
videojs.addLanguage("pt-BR",{
"Play": "Tocar",
"Pause": "Pausar",
"Pause": "Pause",
"Current Time": "Tempo",
"Duration Time": "Duração",
"Remaining Time": "Tempo Restante",
@@ -18,9 +18,9 @@ videojs.addLanguage("pt-BR",{
"Captions": "Anotações",
"captions off": "Sem Anotações",
"Chapters": "Capítulos",
"You aborted the media playback": "Você parou a execução do vídeo.",
"You aborted the media playback": "Você parou a execução de vídeo.",
"A network error caused the media download to fail part-way.": "Um erro na rede fez o vídeo parar parcialmente.",
"The media could not be loaded, either because the server or network failed or because the format is not supported.": "O vídeo não pode ser carregado, ou porque houve um problema com sua rede ou pelo formato do vídeo não ser suportado.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "A execução foi interrompida por um problema com o vídeo ou por seu navegador não dar suporte ao seu formato.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "A Execução foi interrompida por um problema com o vídeo ou por seu navegador não dar suporte ao seu formato.",
"No compatible source was found for this media.": "Não foi encontrada fonte de vídeo compatível."
});
BIN
Ver Arquivo
Arquivo binário não exibido.
BIN
Ver Arquivo
Arquivo binário não exibido.
+44 -105
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+1 -1
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
BIN
Ver Arquivo
Arquivo binário não exibido.
+18419 -20421
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+303
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+11 -15
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+1
Ver Arquivo
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+1 -1
Ver Arquivo
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8" />
<title>Video.js Text Descriptions, Chapters &amp; Captions Example</title>
+4 -1
Ver Arquivo
@@ -1,13 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<head>
<title>Video.js | HTML5 Video Player</title>
<link href="http://vjs.zencdn.net/5.0.2/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/ie8/1.1.0/videojs-ie8.min.js"></script>
<script src="http://vjs.zencdn.net/5.0.2/video.js"></script>
</head>
</head>
<body>
-69
Ver Arquivo
@@ -1,69 +0,0 @@
# Audio Tracks
Audio Tracks are a function of HTML5 video for providing alternative audio track selections to the user, so that a track other than the main track can be played. Video.js makes audio tracks work across all browsers. There are currently five types of tracks:
- **Alternative**: alternative audio for the main video track
- **Descriptions**: descriptions of what is happening in the video track
- **Main**: the main audio track for this video
- **Translation**: a translation of the main audio track
- **Commentary**: commentary on the video, usually the director of the content talking about design choices
## Missing Funtionality
- It is currently impossible to add AudioTracks in a non-programtic way
- Literal switching of AudioTracks for playback is not handled by video.js and must be handled by something else. video.js only stores the track representation
## Adding to Video.js
> Right now adding audio tracks in the HTML is unsupported. Audio Tracks must be added programatically.
You must add audio tracks [programatically](#api) for the time being.
## Attributes
Audio Track propertites and settings
### kind
One of the five track types listed above. Kind defaults to empty string if no kind is included, or an invalid kind is used.
### label
The label for the track that will be show to the user, for example in a menu that list the different languages available for audio tracks.
### language
The two-letter code (valid BCP 47 language tag) for the language of the audio track, for example "en" for English. A list of language codes is [available here](languages.md#language-codes).
### enabled
If this track should be playing or not. In video.js we only allow one track to be enabled at a time. so if you enable more than one the last one to be enabled will end up being the only one.
## Interacting with Audio Tracks
### Doing something when a track becomes enabled
When a new track is enabled (other than the main track) an event is fired on the `AudioTrackList` called `change` you can listen to that event and do something with it.
Here's an example:
```js
// get the current players AudioTrackList object
let tracks = player.audioTracks();
// listen to the change event
tracks.addEventListener('change', function() {
// print the currently enabled AudioTrack label
for (let i = 0; i < tracks.length; i++) {
let track = tracks[i];
if (track.enabled) {
console.log(track.label);
return;
}
}
});
```
## API
### `player.audioTracks() -> AudioTrackList`
This is the main interface into the audio tracks of the player.
It returns an AudioTrackList which is an array like object that contains all the `AudioTrack` on the player.
### `player.audioTracks().addTrack(AudioTrack)`
Add an existing AudioTrack to the players internal list of AudioTracks.
### `player.audioTracks().removeTrack(AudioTrack)`
Remove a track from the AudioTrackList currently on the player. if no track exists this will do nothing.
+181 -13
Ver Arquivo
@@ -32,7 +32,6 @@ A sample dictionary for Spanish `['es']` would look as follows:
"Captions": "Subtítulos especiales",
"captions off": "Subtítulos especiales desactivados",
"Chapters": "Capítulos",
"Close Modal Dialog": "Cerca de diálogo modal",
"You aborted the video playback": "Ha interrumpido la reproducción del vídeo.",
"A network error caused the video download to fail part-way.": "Un error de red ha interrumpido la descarga del vídeo.",
"The video could not be loaded, either because the server or network failed or because the format is not supported.": "No se ha podido cargar el vídeo debido a un fallo de red o del servidor o porque el formato es incompatible.",
@@ -81,7 +80,6 @@ NOTE: These need to be added after the core Video.js script.
"Captions": "Subtítulos especiales",
"captions off": "Subtítulos especiales desactivados",
"Chapters": "Capítulos",
"Close Modal Dialog": "Cerca de diálogo modal",
"You aborted the video playback": "Ha interrumpido la reproducción del vídeo.",
"A network error caused the video download to fail part-way.": "Un error de red ha interrumpido la descarga del vídeo.",
"The video could not be loaded, either because the server or network failed or because the format is not supported.": "No se ha podido cargar el vídeo debido a un fallo de red o del servidor o porque el formato es incompatible.",
@@ -110,10 +108,6 @@ NOTE: These need to be added after the core Video.js script.
Notes:
- This will add your language key/values to the Video.js player instances individually. If these values already exist in the global dictionary via the process above, those will be overridden for the player instance in question.
Updating default translations
-----------------------------
A list of the current translations and any strings that need translation are at [docs/translations-needed.md](../translations-needed.md). After updating the language files in /lang/ running `grunt check-languages` will update that list.
Setting Default Language in a Video.js Player
---------------------------------------------
@@ -135,14 +129,14 @@ During a Video.js player instantiation you can force it to localize to a specifi
Determining Player Language
---------------------------
The player language is set to one of the following in descending priority:
The player language is set to one of the following in descending priority
* The language specified in setup options as above
* The language specified by the closet element with a `lang` attribute. This could be the player itself or a parent element. Usually the document language is specified on the `html` tag.
* Browser language preference (the first language if more than one is configured)
* The language set in setup options as above
* The document language (`lang` attribute of the `html` element)
* Browser language preference
* 'en'
The player language can be change after instantiation with `language('fr')`. However localizable text will not be modified by doing this, for best results set the language beforehand.
That can be overridden after instantiation with `language('fr')`.
Language selection
------------------
@@ -161,7 +155,181 @@ var details = '<div class="vjs-errors-details">' + player.localize('Technical de
Language Codes
--------------
A list of languages codes can be found [here](http://www.iana.org/assignments/language-subtag-registry/language-subtag-registry)
The following is a list of official language codes.
For supported language translations, please see the [Languages Folder (/lang)](https://github.com/videojs/video.js/tree/master/lang) folder located in the project root.
**NOTE:** For supported language translations, please see the [Languages Folder (/lang)](https://github.com/videojs/video.js/tree/master/lang) folder located in the project root.
<table border="0" cellspacing="5" cellpadding="5">
<tr>
<td>
<table>
<tr><th>ab<th><td>Abkhazian</td></tr>
<tr><th>aa<th><td>Afar</td></tr>
<tr><th>af<th><td>Afrikaans</td></tr>
<tr><th>sq<th><td>Albanian</td></tr>
<tr><th>am<th><td>Amharic</td></tr>
<tr><th>ar<th><td>Arabic</td></tr>
<tr><th>an<th><td>Aragonese</td></tr>
<tr><th>hy<th><td>Armenian</td></tr>
<tr><th>as<th><td>Assamese</td></tr>
<tr><th>ay<th><td>Aymara</td></tr>
<tr><th>az<th><td>Azerbaijani</td></tr>
<tr><th>ba<th><td>Bashkir</td></tr>
<tr><th>eu<th><td>Basque</td></tr>
<tr><th>bn<th><td>Bengali (Bangla)</td></tr>
<tr><th>dz<th><td>Bhutani</td></tr>
<tr><th>bh<th><td>Bihari</td></tr>
<tr><th>bi<th><td>Bislama</td></tr>
<tr><th>br<th><td>Breton</td></tr>
<tr><th>bg<th><td>Bulgarian</td></tr>
<tr><th>my<th><td>Burmese</td></tr>
<tr><th>be<th><td>Byelorussian (Belarusian)</td></tr>
<tr><th>km<th><td>Cambodian</td></tr>
<tr><th>ca<th><td>Catalan</td></tr>
<tr><th>zh<th><td>Chinese (Simplified)</td></tr>
<tr><th>zh<th><td>Chinese (Traditional)</td></tr>
<tr><th>co<th><td>Corsican</td></tr>
<tr><th>hr<th><td>Croatian</td></tr>
<tr><th>cs<th><td>Czech</td></tr>
<tr><th>da<th><td>Danish</td></tr>
<tr><th>nl<th><td>Dutch</td></tr>
<tr><th>en<th><td>English</td></tr>
<tr><th>eo<th><td>Esperanto</td></tr>
<tr><th>et<th><td>Estonian</td></tr>
<tr><th>fo<th><td>Faeroese</td></tr>
<tr><th>fa<th><td>Farsi</td></tr>
<tr><th>fj<th><td>Fiji</td></tr>
<tr><th>fi<th><td>Finnish</td></tr>
</table>
</td>
<td>
<table>
<tr><th>fr<th><td>French</td></tr>
<tr><th>fy<th><td>Frisian</td></tr>
<tr><th>gl<th><td>Galician</td></tr>
<tr><th>gd<th><td>Gaelic (Scottish)</td></tr>
<tr><th>gv<th><td>Gaelic (Manx)</td></tr>
<tr><th>ka<th><td>Georgian</td></tr>
<tr><th>de<th><td>German</td></tr>
<tr><th>el<th><td>Greek</td></tr>
<tr><th>kl<th><td>Greenlandic</td></tr>
<tr><th>gn<th><td>Guarani</td></tr>
<tr><th>gu<th><td>Gujarati</td></tr>
<tr><th>ht<th><td>Haitian Creole</td></tr>
<tr><th>ha<th><td>Hausa</td></tr>
<tr><th>he<th><td>Hebrew</td></tr>
<tr><th>hi<th><td>Hindi</td></tr>
<tr><th>hu<th><td>Hungarian</td></tr>
<tr><th>is<th><td>Icelandic</td></tr>
<tr><th>io<th><td>Ido</td></tr>
<tr><th>id<th><td>Indonesian</td></tr>
<tr><th>ia<th><td>Interlingua</td></tr>
<tr><th>ie<th><td>Interlingue</td></tr>
<tr><th>iu<th><td>Inuktitut</td></tr>
<tr><th>ik<th><td>Inupiak</td></tr>
<tr><th>ga<th><td>Irish</td></tr>
<tr><th>it<th><td>Italian</td></tr>
<tr><th>ja<th><td>Japanese</td></tr>
<tr><th>jv<th><td>Javanese</td></tr>
<tr><th>kn<th><td>Kannada</td></tr>
<tr><th>ks<th><td>Kashmiri</td></tr>
<tr><th>kk<th><td>Kazakh</td></tr>
<tr><th>rw<th><td>Kinyarwanda (Ruanda)</td></tr>
<tr><th>ky<th><td>Kirghiz</td></tr>
<tr><th>rn<th><td>Kirundi (Rundi)</td></tr>
<tr><th>ko<th><td>Korean</td></tr>
<tr><th>ku<th><td>Kurdish</td></tr>
<tr><th>lo<th><td>Laothian</td></tr>
<tr><th>la<th><td>Latin</td></tr>
</table>
</td>
<td>
<table>
<tr><th>lv<th><td>Latvian (Lettish)</td></tr>
<tr><th>li<th><td>Limburgish ( Limburger)</td></tr>
<tr><th>ln<th><td>Lingala</td></tr>
<tr><th>lt<th><td>Lithuanian</td></tr>
<tr><th>mk<th><td>Macedonian</td></tr>
<tr><th>mg<th><td>Malagasy</td></tr>
<tr><th>ms<th><td>Malay</td></tr>
<tr><th>ml<th><td>Malayalam</td></tr>
<tr><th>mt<th><td>Maltese</td></tr>
<tr><th>mi<th><td>Maori</td></tr>
<tr><th>mr<th><td>Marathi</td></tr>
<tr><th>mo<th><td>Moldavian</td></tr>
<tr><th>mn<th><td>Mongolian</td></tr>
<tr><th>na<th><td>Nauru</td></tr>
<tr><th>ne<th><td>Nepali</td></tr>
<tr><th>no<th><td>Norwegian</td></tr>
<tr><th>oc<th><td>Occitan</td></tr>
<tr><th>or<th><td>Oriya</td></tr>
<tr><th>om<th><td>Oromo (Afan, Galla)</td></tr>
<tr><th>ps<th><td>Pashto (Pushto)</td></tr>
<tr><th>pl<th><td>Polish</td></tr>
<tr><th>pt<th><td>Portuguese</td></tr>
<tr><th>pa<th><td>Punjabi</td></tr>
<tr><th>qu<th><td>Quechua</td></tr>
<tr><th>rm<th><td>Rhaeto-Romance</td></tr>
<tr><th>ro<th><td>Romanian</td></tr>
<tr><th>ru<th><td>Russian</td></tr>
<tr><th>sm<th><td>Samoan</td></tr>
<tr><th>sg<th><td>Sangro</td></tr>
<tr><th>sa<th><td>Sanskrit</td></tr>
<tr><th>sr<th><td>Serbian</td></tr>
<tr><th>sh<th><td>Serbo-Croatian</td></tr>
<tr><th>st<th><td>Sesotho</td></tr>
<tr><th>tn<th><td>Setswana</td></tr>
<tr><th>sn<th><td>Shona</td></tr>
<tr><th>ii<th><td>Sichuan Yi</td></tr>
<tr><th>sd<th><td>Sindhi</td></tr>
</table>
</td>
<td>
<table>
<tr><th>si<th><td>Sinhalese</td></tr>
<tr><th>ss<th><td>Siswati</td></tr>
<tr><th>sk<th><td>Slovak</td></tr>
<tr><th>sl<th><td>Slovenian</td></tr>
<tr><th>so<th><td>Somali</td></tr>
<tr><th>es<th><td>Spanish</td></tr>
<tr><th>su<th><td>Sundanese</td></tr>
<tr><th>sw<th><td>Swahili (Kiswahili)</td></tr>
<tr><th>sv<th><td>Swedish</td></tr>
<tr><th>tl<th><td>Tagalog</td></tr>
<tr><th>tg<th><td>Tajik</td></tr>
<tr><th>ta<th><td>Tamil</td></tr>
<tr><th>tt<th><td>Tatar</td></tr>
<tr><th>te<th><td>Telugu</td></tr>
<tr><th>th<th><td>Thai</td></tr>
<tr><th>bo<th><td>Tibetan</td></tr>
<tr><th>ti<th><td>Tigrinya</td></tr>
<tr><th>to<th><td>Tonga</td></tr>
<tr><th>ts<th><td>Tsonga</td></tr>
<tr><th>tr<th><td>Turkish</td></tr>
<tr><th>tk<th><td>Turkmen</td></tr>
<tr><th>tw<th><td>Twi</td></tr>
<tr><th>ug<th><td>Uighur</td></tr>
<tr><th>uk<th><td>Ukrainian</td></tr>
<tr><th>ur<th><td>Urdu</td></tr>
<tr><th>uz<th><td>Uzbek</td></tr>
<tr><th>vi<th><td>Vietnamese</td></tr>
<tr><th>vo<th><td>Volapük</td></tr>
<tr><th>wa<th><td>Wallon</td></tr>
<tr><th>cy<th><td>Welsh</td></tr>
<tr><th>wo<th><td>Wolof</td></tr>
<tr><th>xh<th><td>Xhosa</td></tr>
<tr><th>yi<th><td>Yiddish</td></tr>
<tr><th>yo<th><td>Yoruba</td></tr>
<tr><th>zu<th><td>Zulu</td></tr>
</table>
</td>
</tr>
</table>
-184
Ver Arquivo
@@ -1,184 +0,0 @@
# Text Tracks
Text Tracks are a function of HTML5 video for providing time triggered text to the viewer. Video.js makes tracks work across all browsers. There are currently five types of tracks:
- **Subtitles**: Translations of the dialogue in the video for when audio is available but not understood. Subtitles are shown over the video.
- **Captions**: Transcription of the dialogue, sound effects, musical cues, and other audio information for when the viewer is deaf/hard of hearing, or the video is muted. Captions are also shown over the video.
- **Chapters**: Chapter titles that are used to create navigation within the video. Typically they're in the form of a list of chapters that the viewer can click on to go to a specific chapter.
- **Descriptions**: Text descriptions of what's happening in the video for when the video portion isn't available, because the viewer is blind, not using a screen, or driving and about to crash because they're trying to enjoy a video while driving. Descriptions are read by a screen reader or turned into a separate audio track.
- **Metadata**: Tracks that have data meant for javascript to parse and do something with. These aren't shown to the user.
## Creating the Text File
Timed text requires a text file in [WebVTT](http://dev.w3.org/html5/webvtt/) format. This format defines a list of "cues" that have a start time, and end time, and text to display. [Microsoft has a builder](https://dev.modern.ie/testdrive/demos/captionmaker/) that can help you get started on the file.
When creating captions, there's also additional [caption formatting techniques] (http://www.theneitherworld.com/mcpoodle/SCC_TOOLS/DOCS/SCC_FORMAT.HTML#style) that would be good to use, like brackets around sound effects: [ sound effect ]. If you'd like a more in depth style guide for captioning, you can reference the [Captioning Key](http://www.dcmp.org/captioningkey/), but keep in mind not all features are supported by WebVTT or (more likely) the Video.js WebVTT implementation.
## Adding to Video.js
Once you have your WebVTT file created, you can add it to Video.js using the track tag. Put your track tag after all the source elements, and before any fallback content.
```html
<video id="example_video_1" class="video-js"
controls preload="auto" width="640" height="264"
data-setup='{"example_option":true}'>
<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4" />
<source src="http://vjs.zencdn.net/v/oceans.webm" type="video/webm" />
<source src="http://vjs.zencdn.net/v/oceans.ogv" type="video/ogg" />
<track kind="captions" src="http://example.com/path/to/captions.vtt" srclang="en" label="English" default>
</video>
```
You can also add tracks [programatically](#api).
## Subtitles from Another Domain
Because we're pulling in the text track file via Javascript, the [same-origin policy](http://en.wikipedia.org/wiki/Same_origin_policy) applies. If you'd like to have a player served from one domain,
but the text track served from another, you'll need to [enable CORS](http://enable-cors.org/) in order to do so.
In addition to enabling CORS on the server serving the text tracks, you will need to add the [`crossorigin` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_settings_attributes) to the video element itself. This attribute has two values `anonymous` and `use-credentials`. Most users will want to use `anonymous` with cross-origin tracks.
It can be added to the video element like so:
```html
<video class="video-js" crossorigin="anonymous">
<source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4">
<track src="http://example.com/oceans.vtt" kind="captions" srclang="en" label="English">
</video>
```
One thing to be aware of is that in this case the video files themselves will *also* needs CORS headers applied to it. This is because some browsers apply the crossorigin attribute to the video source itself and not just the tracks and is considered a [security concern by the spec](https://html.spec.whatwg.org/multipage/embedded-content.html#security-and-privacy-considerations).
## Track Attributes
Additional settings for track tags.
### kind
One of the five track types listed above. Kind defaults to subtitles if no kind is included.
### label
The label for the track that will be show to the user, for example in a menu that list the different languages available for subtitles.
### default
The default attribute can be used to have a track default to showing. Otherwise the viewer would need to select their language from the captions or subtitles menu.
NOTE: For chapters, default is required if you want the chapters menu to show.
### srclang
The two-letter code (valid BCP 47 language tag) for the language of the text track, for example "en" for English. A list of language codes is [available here](languages.md#language-codes).
## Interacting with Text Tracks
### Showing tracks programmatically
Some of you would want to turn captions on and off programmatically rather than just forcing the user to do so themselves. This can be easily achieved by modifying the `mode` of the text tracks.
The `mode` can be one of three values `disabled`, `hidden`, and `showing`.
When a text track's `mode` is `disabled`, the track does not show on screen as the video is playing.
When the `mode` is set to `showing`, the track is visible to the viewer and updates while the video is playing.
You can change of a particular track like so:
```js
let tracks = player.textTracks();
for (let i = 0; i < tracks.length; i++) {
let track = tracks[i];
// find the captions track that's in english
if (track.kind === 'captions' && track.language === 'en') {
track.mode = 'showing';
}
}
```
### Doing something when a cue becomes active
Above, we mentioned that `mode` can also be `hidden`, what this means is that the track will update
as the video is playing but it won't be visible to the viewer. This is most useful for `metadata` text tracks.
One usecase for metadata text tracks is to have something happen when their cues become active, to do so, you listen to the `cuechange` event on the track. These events fire when the mode is `showing` as well.
Here's an example:
```js
let tracks = player.textTracks();
let metadataTrack;
for (let i = 0; i < tracks.length; i++) {
let track = tracks[i];
// find the metadata track that's labeled ads
if (track.kind === 'captions' && track.label === 'ads') {
track.mode = 'hidden';
// store it for usage outside of the loop
metadataTrack = track;
}
}
metadataTrack.addEventListener('cuechange', function() {
player.ads.startLinearAdMode();
});
```
## Emulated Text Tracks
By default, video.js will try and use native text tracks if possible and fall back to emulated text tracks if the native functionality is broken or incomplete or non-existent.
The Flash tech will always use the emulated text track functionality.
The video.js API and TextTrack objects were modeled after the w3c's specification.
video.js uses [Mozilla's vtt.js](https://github.com/mozilla/vtt.js) library to parse and display its emulated text tracks.
If you wanted to disable native text track functionality and force video.js to use emulated text tracks always, you can supply the `nativeTextTracks` option to the tech like so:
```js
let player = videojs('myvideo', {
html5: {
nativeTextTracks: false
}
});
```
### Text Track Settings
When using emulated Text Tracks, captions will have an additional item in the menu called "caption settings".
This allows the viewer of the player to change some styles of how the captions are displayed on screen.
If you don't want that, you can disable it by turning off the text track settings component and hiding the menu item like so:
```js
let player = videojs('myvideo', {
// make the text track settings dialog not initialize
textTrackSettings: false
});
```
```css
/* hide the captions settings item from the captions menu */
.vjs-texttrack-settings {
display: none;
}
```
## Text Track Precedence
In general, the Descriptions tracks is of lower precedence than captions and subtitles.
What this means for you?
* If you are using the `default` attribute, videojs will choose the first track that is marked as `default` and turn it on. If There are multiple tracks marked `default`, it will try and turn on the first `captions` or `subtitles` track *before* any `descriptions` tracks.
* This only applied to the emulated captions support, native text tracks behavior will change depending on the browser
* If you select a given track from the menu, videojs will turn off all the other tracks of the same kind. This may seem like you can have both subtitles and captions turned on at the same time but unfortuantely, at this time we only support one track being displayed at a time.
* This means that for emulated text tracks, we'll choose the first captions or subtitles track that is enabled to display.
* When native text tracks are supported, we will still disable the other tracks of the same kind but it is possible that multiple text tracks are shown.
* If a `descriptions` track is selected and subsequently a `subtitles` or `captions` track is selected, the `descriptions` track is disabled and its menu button is also disabled.
* When enabling a track programmatically, there's not much checking that videojs does.
* For emulated text tracks, when it's time to display the captions, video.js would choose the first track that's showing, again choosing `subtitles` or `captions` over `descriptions`, if necessary.
* For native text tracks, this behavior depends on the browser. Some browsers will let you have multiple text tracks but others will disable all other tracks when a new one is selected.
## API
### `player.textTracks() -> TextTrackList`
This is the main interface into the text tracks of the player.
It return a TextTrackList which lists all the tracks on the player.
### `player.remoteTextTracks() -> TextTrackList`
This is a helper method to get a list of all the tracks that were created from `track` elements or that were added to the player by the `addRemoteTextTrack` method. All these tracks are removeable from the player, where-as not all tracks from `player.textTracks()` are necessarily removeable.
### `player.remoteTextTrackEls() -> HTMLTrackElementList`
Another helper method, this is a list of all the `track` elements associated with the player. Both emulated or otherwise.
### `player.addTextTrack(String kind, [String label [, String language]]) -> TextTrack`
This is based on the [w3c spec API](http://www.w3.org/html/wg/drafts/html/master/embedded-content-0.html#dom-media-addtexttrack) and when given a kind and an optional label and language, will create a new text track for you to use.
This method is intended for purely programmatic usage of tracks and has one important limitation:
tracks created using this method *cannot* be removed. The native `addTextTrack` does not have a corresponding `removeTextTrack`, so, we actually discourage the usage of this method.
### `player.addRemoteTextTrack(Object options) -> HTMLTrackElement`
This function takes an options object that looks pretty similar to the track element and returns a HTMLTrackElement.
This object has a `track` property on it which is the actual TextTrack object.
This `TextTrack` object is equivalent to the one that can be returned from `player.addTextTrack` with the added bonus that it can be removed from the player.
Internally, video.js will either add a `<track>` element for you, or emulate that depending on whether native text tracks are supported or not.
The options available are:
* `kind`
* `label`
* `language` (also `srclang`)
* `id`
* `src`
### `player.removeRemoteTextTrack(HTMLTrackElement|TextTrack)`
This function takes either an HTMLTrackElement or a TextTrack object and removes it from the player.
+207 -5
Ver Arquivo
@@ -1,6 +1,208 @@
# Tracks
There are currently three types of tracks
Tracks
======
* [AudioTracks](./audio-tracks.md) - allows the selection of alternative AudioTracks for a video
* [VideoTracks](./video-tracks.md) - allows the selection of an alternative VideoTrack for a video
* [TextTracks](./text-tracks.md) - Text Tracks are used to display subtitles and captions, and add a menu for navigating between chapters in a video.
Text Tracks are a function of HTML5 video for providing time triggered text to the viewer. Video.js makes tracks work across all browsers. There are currently five types of tracks:
- **Subtitles**: Translations of the dialogue in the video for when audio is available but not understood. Subtitles are shown over the video.
- **Captions**: Transcription of the dialogue, sound effects, musical cues, and other audio information for when the viewer is deaf/hard of hearing, or the video is muted. Captions are also shown over the video.
- **Chapters**: Chapter titles that are used to create navigation within the video. Typically they're in the form of a list of chapters that the viewer can click on to go to a specific chapter.
- **Descriptions** (not supported yet): Text descriptions of what's happening in the video for when the video portion isn't available, because the viewer is blind, not using a screen, or driving and about to crash because they're trying to enjoy a video while driving. Descriptions are read by a screen reader or turned into a separate audio track.
- **Metadata** (not supported yet): Tracks that have data meant for javascript to parse and do something with. These aren't shown to the user.
Creating the Text File
----------------------
Timed text requires a text file in [WebVTT](http://dev.w3.org/html5/webvtt/) format. This format defines a list of "cues" that have a start time, and end time, and text to display. [Microsoft has a builder](https://dev.modern.ie/testdrive/demos/captionmaker/) that can help you get started on the file.
When creating captions, there's also additional [caption formatting techniques] (http://www.theneitherworld.com/mcpoodle/SCC_TOOLS/DOCS/SCC_FORMAT.HTML#style) that would be good to use, like brackets around sound effects: [ sound effect ]. If you'd like a more in depth style guide for captioning, you can reference the [Captioning Key](http://www.dcmp.org/captioningkey/), but keep in mind not all features are supported by WebVTT or (more likely) the Video.js WebVTT implementation.
Adding to Video.js
------------------
Once you have your WebVTT file created, you can add it to Video.js using the track tag. Put your track tag after all the source elements, and before any fallback content.
```html
<video id="example_video_1" class="video-js vjs-default-skin"
controls preload="auto" width="640" height="264"
data-setup='{"example_option":true}'>
<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="http://example.com/path/to/captions.vtt" srclang="en" label="English" default>
</video>
```
Subtitles from Another Domain
-----------------------------
Because we're pulling in the text track file via Javascript, the [same-origin policy](http://en.wikipedia.org/wiki/Same_origin_policy) applies. If you'd like to have a player served from one domain,
but the text track served from another, you'll need to [enable CORS](http://enable-cors.org/) in order to do so.
Track Attributes
----------------
Additional settings for track tags.
### kind
One of the five track types listed above. Kind defaults to subtitles if no kind is included.
### label
The label for the track that will be show to the user, for example in a menu that list the different languages available for subtitles.
### default
The default attribute can be used to have a track default to showing. Otherwise the viewer would need to select their language from the captions or subtitles menu.
NOTE: For chapters, default is required if you want the chapters menu to show.
### srclang
The two-letter code (valid BCP 47 language tag) for the language of the text track, for example "en" for English. Here's a list of available language codes.
<table border="0" cellspacing="5" cellpadding="5">
<tr>
<table>
<tr><th>ab<th><td>Abkhazian</td></tr>
<tr><th>aa<th><td>Afar</td></tr>
<tr><th>af<th><td>Afrikaans</td></tr>
<tr><th>sq<th><td>Albanian</td></tr>
<tr><th>am<th><td>Amharic</td></tr>
<tr><th>ar<th><td>Arabic</td></tr>
<tr><th>an<th><td>Aragonese</td></tr>
<tr><th>hy<th><td>Armenian</td></tr>
<tr><th>as<th><td>Assamese</td></tr>
<tr><th>ay<th><td>Aymara</td></tr>
<tr><th>az<th><td>Azerbaijani</td></tr>
<tr><th>ba<th><td>Bashkir</td></tr>
<tr><th>eu<th><td>Basque</td></tr>
<tr><th>bn<th><td>Bengali (Bangla)</td></tr>
<tr><th>dz<th><td>Bhutani</td></tr>
<tr><th>bh<th><td>Bihari</td></tr>
<tr><th>bi<th><td>Bislama</td></tr>
<tr><th>br<th><td>Breton</td></tr>
<tr><th>bg<th><td>Bulgarian</td></tr>
<tr><th>my<th><td>Burmese</td></tr>
<tr><th>be<th><td>Byelorussian (Belarusian)</td></tr>
<tr><th>km<th><td>Cambodian</td></tr>
<tr><th>ca<th><td>Catalan</td></tr>
<tr><th>zh<th><td>Chinese (Simplified)</td></tr>
<tr><th>zh<th><td>Chinese (Traditional)</td></tr>
<tr><th>co<th><td>Corsican</td></tr>
<tr><th>hr<th><td>Croatian</td></tr>
<tr><th>cs<th><td>Czech</td></tr>
<tr><th>da<th><td>Danish</td></tr>
<tr><th>nl<th><td>Dutch</td></tr>
<tr><th>en<th><td>English</td></tr>
<tr><th>eo<th><td>Esperanto</td></tr>
<tr><th>et<th><td>Estonian</td></tr>
<tr><th>fo<th><td>Faeroese</td></tr>
<tr><th>fa<th><td>Farsi</td></tr>
<tr><th>fj<th><td>Fiji</td></tr>
<tr><th>fi<th><td>Finnish</td></tr>
<tr><th>fr<th><td>French</td></tr>
<tr><th>fy<th><td>Frisian</td></tr>
<tr><th>gl<th><td>Galician</td></tr>
<tr><th>gd<th><td>Gaelic (Scottish)</td></tr>
<tr><th>gv<th><td>Gaelic (Manx)</td></tr>
<tr><th>ka<th><td>Georgian</td></tr>
<tr><th>de<th><td>German</td></tr>
<tr><th>el<th><td>Greek</td></tr>
<tr><th>kl<th><td>Greenlandic</td></tr>
<tr><th>gn<th><td>Guarani</td></tr>
<tr><th>gu<th><td>Gujarati</td></tr>
<tr><th>ht<th><td>Haitian Creole</td></tr>
<tr><th>ha<th><td>Hausa</td></tr>
<tr><th>he<th><td>Hebrew</td></tr>
<tr><th>hi<th><td>Hindi</td></tr>
<tr><th>hu<th><td>Hungarian</td></tr>
<tr><th>is<th><td>Icelandic</td></tr>
<tr><th>io<th><td>Ido</td></tr>
<tr><th>id<th><td>Indonesian</td></tr>
<tr><th>ia<th><td>Interlingua</td></tr>
<tr><th>ie<th><td>Interlingue</td></tr>
<tr><th>iu<th><td>Inuktitut</td></tr>
<tr><th>ik<th><td>Inupiak</td></tr>
<tr><th>ga<th><td>Irish</td></tr>
<tr><th>it<th><td>Italian</td></tr>
<tr><th>ja<th><td>Japanese</td></tr>
<tr><th>jv<th><td>Javanese</td></tr>
<tr><th>kn<th><td>Kannada</td></tr>
<tr><th>ks<th><td>Kashmiri</td></tr>
<tr><th>kk<th><td>Kazakh</td></tr>
<tr><th>rw<th><td>Kinyarwanda (Ruanda)</td></tr>
<tr><th>ky<th><td>Kirghiz</td></tr>
<tr><th>rn<th><td>Kirundi (Rundi)</td></tr>
<tr><th>ko<th><td>Korean</td></tr>
<tr><th>ku<th><td>Kurdish</td></tr>
<tr><th>lo<th><td>Laothian</td></tr>
<tr><th>la<th><td>Latin</td></tr>
<tr><th>lv<th><td>Latvian (Lettish)</td></tr>
<tr><th>li<th><td>Limburgish ( Limburger)</td></tr>
<tr><th>ln<th><td>Lingala</td></tr>
<tr><th>lt<th><td>Lithuanian</td></tr>
<tr><th>mk<th><td>Macedonian</td></tr>
<tr><th>mg<th><td>Malagasy</td></tr>
<tr><th>ms<th><td>Malay</td></tr>
<tr><th>ml<th><td>Malayalam</td></tr>
<tr><th>mt<th><td>Maltese</td></tr>
<tr><th>mi<th><td>Maori</td></tr>
<tr><th>mr<th><td>Marathi</td></tr>
<tr><th>mo<th><td>Moldavian</td></tr>
<tr><th>mn<th><td>Mongolian</td></tr>
<tr><th>na<th><td>Nauru</td></tr>
<tr><th>ne<th><td>Nepali</td></tr>
<tr><th>no<th><td>Norwegian</td></tr>
<tr><th>oc<th><td>Occitan</td></tr>
<tr><th>or<th><td>Oriya</td></tr>
<tr><th>om<th><td>Oromo (Afan, Galla)</td></tr>
<tr><th>ps<th><td>Pashto (Pushto)</td></tr>
<tr><th>pl<th><td>Polish</td></tr>
<tr><th>pt<th><td>Portuguese</td></tr>
<tr><th>pa<th><td>Punjabi</td></tr>
<tr><th>qu<th><td>Quechua</td></tr>
<tr><th>rm<th><td>Rhaeto-Romance</td></tr>
<tr><th>ro<th><td>Romanian</td></tr>
<tr><th>ru<th><td>Russian</td></tr>
<tr><th>sm<th><td>Samoan</td></tr>
<tr><th>sg<th><td>Sangro</td></tr>
<tr><th>sa<th><td>Sanskrit</td></tr>
<tr><th>sr<th><td>Serbian</td></tr>
<tr><th>sh<th><td>Serbo-Croatian</td></tr>
<tr><th>st<th><td>Sesotho</td></tr>
<tr><th>tn<th><td>Setswana</td></tr>
<tr><th>sn<th><td>Shona</td></tr>
<tr><th>ii<th><td>Sichuan Yi</td></tr>
<tr><th>sd<th><td>Sindhi</td></tr>
<tr><th>si<th><td>Sinhalese</td></tr>
<tr><th>ss<th><td>Siswati</td></tr>
<tr><th>sk<th><td>Slovak</td></tr>
<tr><th>sl<th><td>Slovenian</td></tr>
<tr><th>so<th><td>Somali</td></tr>
<tr><th>es<th><td>Spanish</td></tr>
<tr><th>su<th><td>Sundanese</td></tr>
<tr><th>sw<th><td>Swahili (Kiswahili)</td></tr>
<tr><th>sv<th><td>Swedish</td></tr>
<tr><th>tl<th><td>Tagalog</td></tr>
<tr><th>tg<th><td>Tajik</td></tr>
<tr><th>ta<th><td>Tamil</td></tr>
<tr><th>tt<th><td>Tatar</td></tr>
<tr><th>te<th><td>Telugu</td></tr>
<tr><th>th<th><td>Thai</td></tr>
<tr><th>bo<th><td>Tibetan</td></tr>
<tr><th>ti<th><td>Tigrinya</td></tr>
<tr><th>to<th><td>Tonga</td></tr>
<tr><th>ts<th><td>Tsonga</td></tr>
<tr><th>tr<th><td>Turkish</td></tr>
<tr><th>tk<th><td>Turkmen</td></tr>
<tr><th>tw<th><td>Twi</td></tr>
<tr><th>ug<th><td>Uighur</td></tr>
<tr><th>uk<th><td>Ukrainian</td></tr>
<tr><th>ur<th><td>Urdu</td></tr>
<tr><th>uz<th><td>Uzbek</td></tr>
<tr><th>vi<th><td>Vietnamese</td></tr>
<tr><th>vo<th><td>Volapük</td></tr>
<tr><th>wa<th><td>Wallon</td></tr>
<tr><th>cy<th><td>Welsh</td></tr>
<tr><th>wo<th><td>Wolof</td></tr>
<tr><th>xh<th><td>Xhosa</td></tr>
<tr><th>yi<th><td>Yiddish</td></tr>
<tr><th>yo<th><td>Yoruba</td></tr>
<tr><th>zu<th><td>Zulu</td></tr>
</table>
</tr>
</table>
-70
Ver Arquivo
@@ -1,70 +0,0 @@
# Video Tracks
Video Tracks are a function of HTML5 video for providing a selection of alternative video tracks to the user, so that they can change type of video they want to watch. Video.js makes video tracks work across all browsers. There are currently six types of tracks:
- **Alternative**: an alternative video representation of the main video track
- **Captions**: The main video track with burned in captions
- **Main**: the main video track
- **Sign**: the main video track with added sign language overlay
- **Subtitles**: the main video track with burned in subtitles
- **Commentary**: the main video track with burned in commentary
## Missing Funtionality
- It is currently impossible to add VideoTracks in a non-programtic way
- Literal switching of VideoTracks for playback is not handled by video.js and must be handled by something else. video.js only stores the track representation
- There is currently no UI implementation of VideoTracks
## Adding to Video.js
> Right now adding video tracks in the HTML is unsupported. Video Tracks must be added programatically.
You must add video tracks [programatically](#api) for the time being.
## Attributes
Video Track propertites and settings
### kind
One of the five track types listed above. Kind defaults to empty string if no kind is included, or an invalid kind is used.
### label
The label for the track that will be show to the user, for example in a menu that list the different languages available for video tracks.
### language
The two-letter code (valid BCP 47 language tag) for the language of the video track, for example "en" for English. A list of language codes is [available here](languages.md#language-codes).
### selected
If this track should be playing or not. Trying to select more than one track will cause other tracks to be deselected.
## Interacting with Video Tracks
### Doing something when a track becomes enabled
When a new track is enabled (other than the main track) an event is fired on the `VideoTrackList` called `change` you can listen to that event and do something with it.
Here's an example:
```js
// get the current players VideoTrackList object
let tracks = player.videoTracks();
// listen to the change event
tracks.addEventListener('change', function() {
// get the currently selected track
let index = tracks.selectedIndex;
let track = tracks[index];
// print the currently selected track
console.log(track.label);
});
```
## API
### `player.videoTracks() -> VideoTrackList`
This is the main interface into the video tracks of the player.
It returns an VideoTrackList which is an array like object that contains all the `VideoTrack` on the player.
### `player.videoTracks().addTrack(VideoTrack)`
Add an existing VideoTrack to the players internal list of VideoTracks.
### `player.videoTracks().removeTrack(VideoTrack)`
Remove a track from the VideoTrackList currently on the player. if no track exists this will do nothing.
### `player.videoTracks().selectedIndex`
The current index for the selected track
+1 -1
Ver Arquivo
@@ -14,7 +14,7 @@ There are two categories of docs: [Guides](./guides/) and [API docs](./api/). Gu
* [Options](./guides/options.md) - There are a number of options that can be used to change how the player behaves, starting with the HTML5 media options like autoplay and preload, and expanding to Video.js specific options.
* [Tracks](./guides/tracks.md) - Tracks are used for displaying text information over a video, selecting different audio tracks for a video, or selected different video tracks for a video.
* [Tracks](./guides/tracks.md) - Text Tracks are used to display subtitles and captions, and add a menu for navigating between chapters in a video.
### Customizing
-363
Ver Arquivo
@@ -1,363 +0,0 @@
# Translations needed
The currently available translations are in the lang dir. This table shows the completeness of those translations. Anything not listed does not exist yet, so go ahead and create it by copying `en.json`.
If you add or update a translation run `grunt check-translations` to update the list and include this modified doc in the pull request.
## Status of translations
<!-- START langtable -->
| Language file | Missing translations |
| ----------------------- | ----------------------------------------------------------------------------------- |
| ar.json (missing 6) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | , opens descriptions settings dialog |
| ba.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| bg.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| ca.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| cs.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| da.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| de.json (Complete) | |
| el.json (missing 7) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | , opens descriptions settings dialog |
| es.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| fa.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| fi.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| fr.json (missing 1) | The media is encrypted and we do not have the keys to decrypt it. |
| hr.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| hu.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| it.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| ja.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| ko.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| nb.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| nl.json (missing 3) | Close Modal Dialog |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| nn.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| pl.json (missing 7) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | , opens descriptions settings dialog |
| pt-BR.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| ru.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| sr.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| sv.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| tr.json (missing 6) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | , opens descriptions settings dialog |
| uk.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| vi.json (missing 14) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | The media is encrypted and we do not have the keys to decrypt it. |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| zh-CN.json (missing 13) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
| zh-TW.json (missing 13) | Close Modal Dialog |
| | Descriptions |
| | descriptions off |
| | Audio Track |
| | Play Video |
| | Close |
| | Modal Window |
| | This is a modal window |
| | This modal can be closed by pressing the Escape key or activating the close button. |
| | , opens captions settings dialog |
| | , opens subtitles settings dialog |
| | , opens descriptions settings dialog |
| | , selected |
<!-- END langtable -->
+1 -7
Ver Arquivo
@@ -30,11 +30,5 @@
"This modal can be closed by pressing the Escape key or activating the close button.": "Durch Drücken der Esc-Taste bzw. Betätigung der Schaltfläche \"Schließen\" wird dieses modale Fenster geschlossen.",
", opens captions settings dialog": ", öffnet Einstellungen für Untertitel",
", opens subtitles settings dialog": ", öffnet Einstellungen für Untertitel",
", selected": ", ausgewählt",
"Close Modal Dialog": "Modales Fenster schließen",
"Descriptions": "Beschreibungen",
"descriptions off": "Beschreibungen aus",
"The media is encrypted and we do not have the keys to decrypt it.": "Die Entschlüsselungsschlüssel für den verschlüsselten Medieninhalt sind nicht verfügbar.",
", opens descriptions settings dialog": ", öffnet Einstellungen für Beschreibungen",
"Audio Track": "Tonspur"
", selected": " (ausgewählt)"
}
-3
Ver Arquivo
@@ -18,16 +18,13 @@
"Captions": "Captions",
"captions off": "captions off",
"Chapters": "Chapters",
"Close Modal Dialog": "Close Modal Dialog",
"Descriptions": "Descriptions",
"descriptions off": "descriptions off",
"Audio Track": "Audio Track",
"You aborted the media playback": "You aborted the media playback",
"A network error caused the media download to fail part-way.": "A network error caused the media download to fail part-way.",
"The media could not be loaded, either because the server or network failed or because the format is not supported.": "The media could not be loaded, either because the server or network failed or because the format is not supported.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "The media playback was aborted due to a corruption problem or because the media used features your browser did not support.",
"No compatible source was found for this media.": "No compatible source was found for this media.",
"The media is encrypted and we do not have the keys to decrypt it.": "The media is encrypted and we do not have the keys to decrypt it.",
"Play Video": "Play Video",
"Close": "Close",
"Modal Window": "Modal Window",
+3 -16
Ver Arquivo
@@ -15,25 +15,12 @@
"Playback Rate": "Vitesse de lecture",
"Subtitles": "Sous-titres",
"subtitles off": "Sous-titres désactivés",
"Captions": "Sous-titres transcrits",
"captions off": "Sous-titres transcrits désactivés",
"Captions": "Sous-titres",
"captions off": "Sous-titres désactivés",
"Chapters": "Chapitres",
"Close Modal Dialog": "Fermer la boîte de dialogue modale",
"Descriptions": "Descriptions",
"descriptions off": "descriptions désactivées",
"Audio Track": "Piste audio",
"You aborted the media playback": "Vous avez interrompu la lecture de la vidéo.",
"A network error caused the media download to fail part-way.": "Une erreur de réseau a interrompu le téléchargement de la vidéo.",
"The media could not be loaded, either because the server or network failed or because the format is not supported.": "Cette vidéo n'a pas pu être chargée, soit parce que le serveur ou le réseau a échoué ou parce que le format n'est pas reconnu.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "La lecture de la vidéo a été interrompue à cause d'un problème de corruption ou parce que la vidéo utilise des fonctionnalités non prises en charge par votre navigateur.",
"No compatible source was found for this media.": "Aucune source compatible n'a été trouvée pour cette vidéo.",
"Play Video": "Lire la vidéo",
"Close": "Fermer",
"Modal Window": "Fenêtre modale",
"This is a modal window": "Ceci est une fenêtre modale",
"This modal can be closed by pressing the Escape key or activating the close button.": "Ce modal peut être fermé en appuyant sur la touche Échap ou activer le bouton de fermeture.",
", opens captions settings dialog": ", ouvrir les paramètres des sous-titres transcrits",
", opens subtitles settings dialog": ", ouvrir les paramètres des sous-titres",
", opens descriptions settings dialog": ", ouvrir les paramètres des descriptions",
", selected": ", sélectionné"
"No compatible source was found for this media.": "Aucune source compatible n'a été trouvée pour cette vidéo."
}
+4 -15
Ver Arquivo
@@ -14,24 +14,13 @@
"Unmute": "Geluid aan",
"Playback Rate": "Weergavesnelheid",
"Subtitles": "Ondertiteling",
"subtitles off": "ondertiteling uit",
"Captions": "Bijschriften",
"captions off": "bijschriften uit",
"subtitles off": "Ondertiteling uit",
"Captions": "Ondertiteling",
"captions off": "Ondertiteling uit",
"Chapters": "Hoofdstukken",
"Descriptions": "Beschrijvingen",
"descriptions off": "beschrijvingen off",
"You aborted the media playback": "U hebt de mediaweergave afgebroken.",
"A network error caused the media download to fail part-way.": "De mediadownload is mislukt door een netwerkfout.",
"The media could not be loaded, either because the server or network failed or because the format is not supported.": "De media kon niet worden geladen, vanwege een server- of netwerkfout of doordat het formaat niet wordt ondersteund.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "De mediaweergave is afgebroken vanwege beschadigde data of het mediabestand gebruikt functies die niet door uw browser worden ondersteund.",
"No compatible source was found for this media.": "Voor deze media is geen ondersteunde bron gevonden.",
"Play Video": "Video Afspelen",
"Close": "Sluiten",
"Modal Window": "Modal Venster",
"This is a modal window": "Dit is een modaal venster",
"This modal can be closed by pressing the Escape key or activating the close button.": "Dit modaal venster kan gesloten worden door op Escape te drukken of de 'sluiten' knop te activeren.",
", opens captions settings dialog": ", opent bijschriften instellingen venster",
", opens subtitles settings dialog": ", opent ondertiteling instellingen venster",
", opens descriptions settings dialog": ", opent beschrijvingen instellingen venster",
", selected": ", selected"
"No compatible source was found for this media.": "Voor deze media is geen ondersteunde bron gevonden."
}
+3 -3
Ver Arquivo
@@ -1,6 +1,6 @@
{
"Play": "Tocar",
"Pause": "Pausar",
"Pause": "Pause",
"Current Time": "Tempo",
"Duration Time": "Duração",
"Remaining Time": "Tempo Restante",
@@ -18,9 +18,9 @@
"Captions": "Anotações",
"captions off": "Sem Anotações",
"Chapters": "Capítulos",
"You aborted the media playback": "Você parou a execução do vídeo.",
"You aborted the media playback": "Você parou a execução de vídeo.",
"A network error caused the media download to fail part-way.": "Um erro na rede fez o vídeo parar parcialmente.",
"The media could not be loaded, either because the server or network failed or because the format is not supported.": "O vídeo não pode ser carregado, ou porque houve um problema com sua rede ou pelo formato do vídeo não ser suportado.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "A execução foi interrompida por um problema com o vídeo ou por seu navegador não dar suporte ao seu formato.",
"The media playback was aborted due to a corruption problem or because the media used features your browser did not support.": "A Execução foi interrompida por um problema com o vídeo ou por seu navegador não dar suporte ao seu formato.",
"No compatible source was found for this media.": "Não foi encontrada fonte de vídeo compatível."
}
+39 -62
Ver Arquivo
@@ -1,9 +1,7 @@
{
"name": "video.js",
"description": "An HTML5 and Flash video player with a common API and skin for both.",
"version": "5.12.0",
"main": "./es5/video.js",
"style": "./dist/video-js.css",
"version": "5.9.2",
"copyright": "Copyright Brightcove, Inc. <https://www.brightcove.com/>",
"license": "Apache-2.0",
"keywords": [
@@ -16,110 +14,89 @@
"homepage": "http://videojs.com",
"author": "Steve Heffernan",
"scripts": {
"build": "grunt dist",
"change": "grunt chg-add",
"clean": "grunt clean",
"lint": "vjsstandard",
"start": "grunt watchAll",
"test": "grunt test"
"test": "grunt test && if [ '$TRAVIS' ]; then grunt coveralls; fi;"
},
"repository": {
"type": "git",
"url": "https://github.com/videojs/video.js.git"
},
"main": "./dist/video.js",
"style": "./dist/video-js.css",
"dependencies": {
"babel-runtime": "^6.9.2",
"global": "4.3.0",
"lodash-compat": "3.10.2",
"object.assign": "4.0.3",
"safe-json-parse": "4.0.0",
"global": "^4.3.0",
"lodash-compat": "^3.9.3",
"object.assign": "^4.0.1",
"safe-json-parse": "^4.0.0",
"tsml": "1.0.1",
"videojs-font": "2.0.0",
"videojs-font": "1.5.1",
"videojs-ie8": "1.1.2",
"videojs-swf": "5.1.0",
"videojs-vtt.js": "0.12.1",
"xhr": "2.2.0"
"videojs-swf": "5.0.1",
"videojs-vtt.js": "^0.12.1",
"xhr": "~2.2.0"
},
"devDependencies": {
"babel-cli": "^6.11.4",
"babel-plugin-inline-json": "^1.1.1",
"babel-plugin-transform-es3-member-expression-literals": "^6.8.0",
"babel-plugin-transform-es3-property-literals": "^6.8.0",
"babel-plugin-transform-runtime": "^6.9.0",
"babel-preset-es2015": "^6.14.0",
"babel-preset-es2015-loose": "^7.0.0",
"babel-register": "^6.9.0",
"babelify": "^7.3.0",
"babel": "^5.2.2",
"babelify": "^6.0.1",
"blanket": "^1.1.6",
"browserify-derequire": "^0.9.4",
"browserify-istanbul": "^0.2.1",
"browserify-versionify": "^1.0.4",
"chg": "^0.3.2",
"css": "^2.2.0",
"es5-shim": "^4.1.3",
"es6-shim": "^0.35.1",
"ghooks": "^1.3.2",
"gkatsev-grunt-sass": "^1.1.1",
"grunt": "^0.4.4",
"grunt-babel": "^6.0.0",
"grunt-aws-s3": "^0.12.1",
"grunt-banner": "^0.4.0",
"grunt-browserify": "3.5.1",
"grunt-cli": "~0.1.13",
"grunt-concurrent": "^2.3.1",
"grunt-concurrent": "^1.0.0",
"grunt-contrib-clean": "~0.4.0a",
"grunt-contrib-concat": "^0.5.1",
"grunt-contrib-connect": "~0.7.1",
"grunt-contrib-copy": "^0.8.0",
"grunt-contrib-cssmin": "~0.6.0",
"grunt-contrib-jshint": "~0.11.3",
"grunt-contrib-less": "~0.6.4",
"grunt-contrib-uglify": "^0.8.0",
"grunt-contrib-watch": "~0.1.4",
"grunt-coveralls": "^1.0.0",
"grunt-exorcise": "^1.0.1",
"grunt-fastly": "^0.1.3",
"grunt-github-releaser": "^0.1.17",
"grunt-karma": "^2.0.0",
"grunt-shell": "^1.3.0",
"grunt-karma": "^0.8.3",
"grunt-sass": "^1.0.0",
"grunt-version": "~0.3.0",
"grunt-videojs-languages": "0.0.4",
"grunt-zip": "0.10.2",
"karma": "^1.2.0",
"karma-browserify": "^5.1.0",
"karma-browserstack-launcher": "^1.0.1",
"karma-chrome-launcher": "^2.0.0",
"karma-coverage": "^1.1.1",
"karma-detect-browsers": "^2.1.0",
"karma-firefox-launcher": "^1.0.0",
"karma-ie-launcher": "^1.0.0",
"karma-opera-launcher": "^1.0.0",
"karma-qunit": "^1.2.0",
"karma-safari-launcher": "^1.0.0",
"karma-sinon": "^1.0.5",
"karma": "^0.12.36",
"karma-browserify": "^4.0.0",
"karma-browserstack-launcher": "^0.1.4",
"karma-chrome-launcher": "^0.1.3",
"karma-coverage": "^0.4.0",
"karma-detect-browsers": "^2.0.2",
"karma-firefox-launcher": "^0.1.3",
"karma-ie-launcher": "^0.1.5",
"karma-opera-launcher": "~0.1.0",
"karma-qunit": "^0.1.2",
"karma-safari-launcher": "^0.1.1",
"karma-sinon": "^1.0.3",
"load-grunt-tasks": "^3.1.0",
"markdown-table": "^1.0.0",
"proxyquireify": "^3.0.0",
"qunitjs": "^1.23.1",
"qunitjs": "^1.18.0",
"sinon": "^1.16.1",
"time-grunt": "^1.1.1",
"uglify-js": "~2.7.3",
"videojs-doc-generator": "0.0.1",
"videojs-standard": "^5.2.0",
"webpack": "^1.13.2"
"uglify-js": "~2.3.6",
"videojs-doc-generator": "0.0.1"
},
"vjsstandard": {
"standard": {
"ignore": [
"**/Gruntfile.js",
"**/es5/**",
"**/build/**",
"**/dist/**",
"**/docs/**",
"**/lang/**",
"**/sandbox/**",
"**/test/api/**",
"**/test/coverage/**",
"**/test/karma.conf.js"
"**/test/**"
]
},
"config": {
"ghooks": {
"pre-push": "npm run lint -- --errors"
}
}
}
+1 -1
Ver Arquivo
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8" />
<title>Video.js Text Descriptions, Chapters &amp; Captions Example</title>
+1 -1
Ver Arquivo
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8" />
<title>Video.js Icons Sandbox</title>
+1 -1
Ver Arquivo
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8" />
<title>Video.js Sandbox</title>
+1 -1
Ver Arquivo
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html>
<head>
<meta charset="utf-8" />
<title>Video.js Plugin Example</title>
-5
Ver Arquivo
@@ -1,5 +0,0 @@
@media print {
.video-js > *:not(.vjs-tech):not(.vjs-poster) {
visibility:hidden;
}
}
+1 -1
Ver Arquivo
@@ -86,7 +86,7 @@
-webkit-user-select: $string;
-moz-user-select: $string;
-ms-user-select: $string;
user-select: $string;
user-select: $string
}
// https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow
+1
Ver Arquivo
@@ -1 +1,2 @@
$icon-font-path: 'font' !default;
$icon-codepoints: false !default;
+3 -6
Ver Arquivo
@@ -8,8 +8,7 @@
.vjs-current-time, .vjs-time-divider, .vjs-duration, .vjs-remaining-time,
.vjs-playback-rate, .vjs-progress-control,
.vjs-mute-control, .vjs-volume-control, .vjs-volume-menu-button,
.vjs-chapters-button, .vjs-descriptions-button, .vjs-captions-button,
.vjs-subtitles-button, .vjs-audio-button { display: none; }
.vjs-chapters-button, .vjs-captions-button, .vjs-subtitles-button { display: none; }
}
// When the player is x-small, display nothing but:
@@ -20,8 +19,7 @@
.vjs-current-time, .vjs-time-divider, .vjs-duration, .vjs-remaining-time,
.vjs-playback-rate,
.vjs-mute-control, .vjs-volume-control, .vjs-volume-menu-button,
.vjs-chapters-button, .vjs-descriptions-button, .vjs-captions-button,
.vjs-subtitles-button, .vjs-audio-button { display: none; }
.vjs-chapters-button, .vjs-captions-button, .vjs-subtitles-button { display: none; }
}
@@ -35,6 +33,5 @@
.vjs-current-time, .vjs-time-divider, .vjs-duration, .vjs-remaining-time,
.vjs-playback-rate,
.vjs-mute-control, .vjs-volume-control,
.vjs-chapters-button, .vjs-descriptions-button, .vjs-captions-button,
.vjs-subtitles-button .vjs-audio-button { display: none; }
.vjs-chapters-button, .vjs-captions-button, .vjs-subtitles-button { display: none; }
}
-3
Ver Arquivo
@@ -1,3 +0,0 @@
.video-js .vjs-audio-button {
@extend .vjs-icon-audio;
}
+3 -24
Ver Arquivo
@@ -6,14 +6,14 @@
color: $primary-foreground-color;
margin: 0 auto;
padding: 0.5em;
height: 16em;
height: 15em;
font-size: 12px;
width: 40em;
}
.vjs-caption-settings .vjs-tracksettings {
top: 0;
bottom: 1em;
bottom: 2em;
left: 0;
right: 0;
position: absolute;
@@ -40,10 +40,8 @@
margin: 5px;
padding: 3px;
min-height: 40px;
border: none;
}
.vjs-caption-settings .vjs-tracksetting label,
.vjs-caption-settings .vjs-tracksetting legend {
.vjs-caption-settings .vjs-tracksetting label {
display: block;
width: 100px;
margin-bottom: 5px;
@@ -52,8 +50,6 @@
.vjs-caption-settings .vjs-tracksetting span {
display: inline;
margin-left: 5px;
vertical-align: top;
float: right;
}
.vjs-caption-settings .vjs-tracksetting > div {
@@ -71,23 +67,6 @@
margin-right: 10px;
}
.vjs-caption-settings fieldset {
margin-top: 1em;
margin-left: .5em;
}
// Hide labels within fieldsets, so they are only for screen reader users
.vjs-caption-settings fieldset .vjs-label {
position: absolute;
clip: rect(1px 1px 1px 1px); /* for Internet Explorer */
clip: rect(1px, 1px, 1px, 1px);
padding: 0;
border: 0;
height: 1px;
width: 1px;
overflow: hidden;
}
.vjs-caption-settings input[type="button"] {
width: 40px;
height: 40px;
+10 -3
Ver Arquivo
@@ -22,13 +22,11 @@
// Video has started playing AND user is inactive
.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
// Remain visible for screen reader and keyboard users
visibility: visible;
visibility: hidden;
opacity: 0;
$trans: visibility 1.0s, opacity 1.0s;
@include transition($trans);
}
.vjs-controls-disabled .vjs-control-bar,
@@ -44,6 +42,15 @@
visibility: visible;
}
// IE8 is flakey with fonts, and you have to change the actual content to force
// fonts to show/hide properly.
// - "\9" IE8 hack didn't work for this
// Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
$ie8screen: "\\0screen";
.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
@media #{$ie8screen} { content: ""; }
}
// IE 8 + 9 Support
.vjs-has-started.vjs-no-flex .vjs-control-bar {
display: table;
+2
Ver Arquivo
@@ -1,6 +1,8 @@
.video-js .vjs-fullscreen-control {
cursor: pointer;
@include flex(none);
}
.video-js .vjs-fullscreen-control {
@extend .vjs-icon-fullscreen-enter;
}
// Switch to the exit icon when the player is in fullscreen
+2
Ver Arquivo
@@ -1,6 +1,8 @@
.video-js .vjs-play-control {
cursor: pointer;
@include flex(none);
}
.video-js .vjs-play-control {
@extend .vjs-icon-play;
}
.video-js .vjs-play-control.vjs-playing {
+1 -1
Ver Arquivo
@@ -31,7 +31,7 @@
// We need an increased hit area on hover
.video-js .vjs-progress-control:hover .vjs-progress-holder {
font-size: 1.666666666666666666em;
font-size: 1.666666666666666666em
}
/* If we let the font size grow as much as everything else, the current time tooltip ends up
+1 -3
Ver Arquivo
@@ -14,10 +14,8 @@
.vjs-menu .vjs-menu-content {
display: block;
padding: 0;
margin: 0;
padding: 0; margin: 0;
overflow: auto;
font-family: $text-font-family;
}
// prevent menus from opening while scrubbing (FF, IE)
-30
Ver Arquivo
@@ -1,30 +0,0 @@
/**
// IE 8 hack for media queries which the sass parser can encounter problems with
$ie8screen: "\\0screen";
// original home: css/components/_control-bar.scss
// IE8 is flakey with fonts, and you have to change the actual content to force
// fonts to show/hide properly.
// - "\9" IE8 hack didn't work for this
// Found in XP IE8 from http://modern.ie. Does not show up in "IE8 mode" in IE9
.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
@media #{$ie8screen} { content: ""; }
}
// Video has started playing AND user is inactive
.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
// Make controls hidden in IE8 for now
@media #{$ie8screen} {
visibility: hidden;
}
}
*/
@media \0screen {
.vjs-user-inactive.vjs-playing .vjs-control-bar :before {
content: ""; } }
@media \0screen {
.vjs-has-started.vjs-user-inactive.vjs-playing .vjs-control-bar {
visibility: hidden; } }
+5 -4
Ver Arquivo
@@ -2,7 +2,11 @@
@import "private-variables";
@import "utilities";
@import "node_modules/videojs-font/scss/icons";
@if $icon-codepoints {
@import "node_modules/videojs-font/scss/icons-codepoints";
} @else {
@import "node_modules/videojs-font/scss/icons";
}
@import "components/layout";
@import "components/big-play";
@@ -35,9 +39,6 @@
@import "components/chapters";
@import "components/descriptions";
@import "components/subtitles";
@import "components/audio";
@import "components/adaptive";
@import "components/captions-settings";
@import "components/modal-dialog";
@import "print";
+2
Ver Arquivo
@@ -1 +1,3 @@
$icon-codepoints: true;
@import "video-js";
+18
Ver Arquivo
@@ -0,0 +1,18 @@
/**
* @file base-styles.js
*
* This code injects the required base styles in the head of the document.
*/
import window from 'global/window';
import document from 'global/document';
if (window.VIDEOJS_NO_BASE_THEME) return;
const styles = '{{GENERATED_STYLES}}';
if (styles === '{{GENERATED'+'_STYLES}}');
const styleNode = document.createElement('style');
styleNode.innerHTML = styles;
document.head.insertBefore(styleNode, document.head.firstChild);
+12 -16
Ver Arquivo
@@ -3,7 +3,10 @@
*/
import ClickableComponent from './clickable-component.js';
import Component from './component';
import * as Events from './utils/events.js';
import * as Fn from './utils/fn.js';
import log from './utils/log.js';
import document from 'global/document';
import assign from 'object.assign';
/**
@@ -29,7 +32,7 @@ class Button extends ClickableComponent {
* @return {Element}
* @method createEl
*/
createEl(tag = 'button', props = {}, attributes = {}) {
createEl(tag='button', props={}, attributes={}) {
props = assign({
className: this.buildCSSClass()
}, props);
@@ -50,15 +53,11 @@ class Button extends ClickableComponent {
// Add attributes for button element
attributes = assign({
// Necessary since the default button type is "submit"
'type': 'button',
// let the screen reader user know that the text of the button may change
'aria-live': 'polite'
type: 'button', // Necessary since the default button type is "submit"
'aria-live': 'polite' // let the screen reader user know that the text of the button may change
}, attributes);
const el = Component.prototype.createEl.call(this, tag, props, attributes);
let el = Component.prototype.createEl.call(this, tag, props, attributes);
this.createControlTextEl(el);
@@ -74,9 +73,8 @@ class Button extends ClickableComponent {
* @deprecated
* @method addChild
*/
addChild(child, options = {}) {
const className = this.constructor.name;
addChild(child, options={}) {
let className = this.constructor.name;
log.warn(`Adding an actionable (user controllable) child to a Button (${className}) is not supported; use a ClickableComponent instead.`);
// Avoid the error message generated by ClickableComponent's addChild method
@@ -89,15 +87,13 @@ class Button extends ClickableComponent {
* @method handleKeyPress
*/
handleKeyPress(event) {
// Ignore Space (32) or Enter (13) key operation, which is handled by the browser for a button.
if (event.which === 32 || event.which === 13) {
return;
} else {
super.handleKeyPress(event); // Pass keypress handling up for unsupported keys
}
// Pass keypress handling up for unsupported keys
super.handleKeyPress(event);
}
}
Component.registerComponent('Button', Button);
+13 -24
Ver Arquivo
@@ -39,7 +39,7 @@ class ClickableComponent extends Component {
* @return {Element}
* @method createEl
*/
createEl(tag = 'div', props = {}, attributes = {}) {
createEl(tag='div', props={}, attributes={}) {
props = assign({
className: this.buildCSSClass(),
tabIndex: 0
@@ -51,13 +51,11 @@ class ClickableComponent extends Component {
// Add ARIA attributes for clickable element which is not a native HTML button
attributes = assign({
'role': 'button',
// let the screen reader user know that the text of the element may change
'aria-live': 'polite'
role: 'button',
'aria-live': 'polite' // let the screen reader user know that the text of the element may change
}, attributes);
const el = super.createEl(tag, props, attributes);
let el = super.createEl(tag, props, attributes);
this.createControlTextEl(el);
@@ -80,7 +78,7 @@ class ClickableComponent extends Component {
el.appendChild(this.controlTextEl_);
}
this.controlText(this.controlText_, el);
this.controlText(this.controlText_);
return this.controlTextEl_;
}
@@ -88,21 +86,15 @@ class ClickableComponent extends Component {
/**
* Controls text - both request and localize
*
* @param {String} text Text for element
* @param {Element=} el Element to set the title on
* @param {String} text Text for element
* @return {String}
* @method controlText
*/
controlText(text, el = this.el()) {
if (!text) {
return this.controlText_ || 'Need Text';
}
const localizedText = this.localize(text);
controlText(text) {
if (!text) return this.controlText_ || 'Need Text';
this.controlText_ = text;
this.controlTextEl_.innerHTML = localizedText;
el.setAttribute('title', localizedText);
this.controlTextEl_.innerHTML = this.localize(this.controlText_);
return this;
}
@@ -125,14 +117,14 @@ class ClickableComponent extends Component {
* @return {Component} The child component (created by this process if a string was used)
* @method addChild
*/
addChild(child, options = {}) {
addChild(child, options={}) {
// TODO: Fix adding an actionable child to a ClickableComponent; currently
// it will cause issues with assistive technology (e.g. screen readers)
// which support ARIA, since an element with role="button" cannot have
// actionable child elements.
// let className = this.constructor.name;
// log.warn(`Adding a child to a ClickableComponent (${className}) can cause issues with assistive technology which supports ARIA, since an element with role="button" cannot have actionable child elements.`);
//let className = this.constructor.name;
//log.warn(`Adding a child to a ClickableComponent (${className}) can cause issues with assistive technology which supports ARIA, since an element with role="button" cannot have actionable child elements.`);
return super.addChild(child, options);
}
@@ -183,15 +175,12 @@ class ClickableComponent extends Component {
* @method handleKeyPress
*/
handleKeyPress(event) {
// Support Space (32) or Enter (13) key operation to fire a click event
if (event.which === 32 || event.which === 13) {
event.preventDefault();
this.handleClick(event);
} else if (super.handleKeyPress) {
// Pass keypress handling up for unsupported keys
super.handleKeyPress(event);
super.handleKeyPress(event); // Pass keypress handling up for unsupported keys
}
}
+41 -46
Ver Arquivo
@@ -3,6 +3,7 @@
*
* Player Component - Base class for all UI objects
*/
import window from 'global/window';
import * as Dom from './utils/dom.js';
import * as Fn from './utils/fn.js';
@@ -10,8 +11,10 @@ import * as Guid from './utils/guid.js';
import * as Events from './utils/events.js';
import log from './utils/log.js';
import toTitleCase from './utils/to-title-case.js';
import assign from 'object.assign';
import mergeOptions from './utils/merge-options.js';
/**
* Base UI Component class
* Components are embeddable UI objects that are represented by both a
@@ -29,7 +32,7 @@ import mergeOptions from './utils/merge-options.js';
* ```
* Components are also event targets.
* ```js
* button.on('click', function() {
* button.on('click', function(){
* console.log('Button Clicked!');
* });
* button.trigger('customevent');
@@ -63,7 +66,7 @@ class Component {
// If there was no ID from the options, generate one
if (!this.id_) {
// Don't require the player ID function in the case of mock players
const id = player && player.id && player.id() || 'no_player';
let id = player && player.id && player.id() || 'no_player';
this.id_ = `${id}_component_${Guid.newGUID()}`;
}
@@ -216,21 +219,21 @@ class Component {
}
localize(string) {
const code = this.player_.language && this.player_.language();
const languages = this.player_.languages && this.player_.languages();
let code = this.player_.language && this.player_.language();
let languages = this.player_.languages && this.player_.languages();
if (!code || !languages) {
return string;
}
const language = languages[code];
let language = languages[code];
if (language && language[string]) {
return language[string];
}
const primaryCode = code.split('-')[0];
const primaryLang = languages[primaryCode];
let primaryCode = code.split('-')[0];
let primaryLang = languages[primaryCode];
if (primaryLang && primaryLang[string]) {
return primaryLang[string];
@@ -337,7 +340,7 @@ class Component {
* @return {Component} The child component (created by this process if a string was used)
* @method addChild
*/
addChild(child, options = {}, index = this.children_.length) {
addChild(child, options={}, index=this.children_.length) {
let component;
let componentName;
@@ -358,14 +361,14 @@ class Component {
// If no componentClass in options, assume componentClass is the name lowercased
// (e.g. playButton)
const componentClassName = options.componentClass || toTitleCase(componentName);
let componentClassName = options.componentClass || toTitleCase(componentName);
// Set name through options
options.name = componentName;
// Create a new object & element for this controls set
// If there's no .player_, this is a player
const ComponentClass = Component.getComponent(componentClassName);
let ComponentClass = Component.getComponent(componentClassName);
if (!ComponentClass) {
throw new Error(`Component ${componentClassName} does not exist`);
@@ -403,9 +406,8 @@ class Component {
// Add the UI object's element to the container div (box)
// Having an element is not required
if (typeof component.el === 'function' && component.el()) {
const childNodes = this.contentEl().children;
const refNode = childNodes[index] || null;
let childNodes = this.contentEl().children;
let refNode = childNodes[index] || null;
this.contentEl().insertBefore(component.el(), refNode);
}
@@ -446,7 +448,7 @@ class Component {
this.childIndex_[component.id()] = null;
this.childNameIndex_[component.name()] = null;
const compEl = component.el();
let compEl = component.el();
if (compEl && compEl.parentNode === this.contentEl()) {
this.contentEl().removeChild(component.el());
@@ -500,14 +502,14 @@ class Component {
* @method initChildren
*/
initChildren() {
const children = this.options_.children;
let children = this.options_.children;
if (children) {
// `this` is `parent`
const parentOptions = this.options_;
let parentOptions = this.options_;
const handleAdd = (child) => {
const name = child.name;
let handleAdd = (child) => {
let name = child.name;
let opts = child.opts;
// Allow options for children to be set at the parent options
@@ -537,8 +539,7 @@ class Component {
// Add a direct reference to the child by name on the parent instance.
// If two of the same component are used, different names should be supplied
// for each
const newChild = this.addChild(name, opts);
let newChild = this.addChild(name, opts);
if (newChild) {
this[name] = newChild;
}
@@ -546,7 +547,7 @@ class Component {
// Allow for an array of children details to passed in the options
let workingChildren;
const Tech = Component.getComponent('Tech');
let Tech = Component.getComponent('Tech');
if (Array.isArray(children)) {
workingChildren = children;
@@ -562,13 +563,13 @@ class Component {
return !workingChildren.some(function(wchild) {
if (typeof wchild === 'string') {
return child === wchild;
} else {
return child === wchild.name;
}
return child === wchild.name;
});
}))
.map((child) => {
let name;
let opts;
let name, opts;
if (typeof child === 'string') {
name = child;
@@ -584,9 +585,8 @@ class Component {
// we have to make sure that child.name isn't in the techOrder since
// techs are registerd as Components but can't aren't compatible
// See https://github.com/videojs/video.js/issues/2772
const c = Component.getComponent(child.opts.componentClass ||
let c = Component.getComponent(child.opts.componentClass ||
toTitleCase(child.name));
return c && !Tech.isTech(c);
})
.forEach(handleAdd);
@@ -608,7 +608,7 @@ class Component {
/**
* Add an event listener to this component's element
* ```js
* var myFunc = function() {
* var myFunc = function(){
* var myComponent = this;
* // Do something when the event is fired
* };
@@ -797,7 +797,7 @@ class Component {
* @return {Component}
* @method ready
*/
ready(fn, sync = false) {
ready(fn, sync=false) {
if (fn) {
if (this.isReady_) {
if (sync) {
@@ -824,14 +824,14 @@ class Component {
this.isReady_ = true;
// Ensure ready is triggerd asynchronously
this.setTimeout(function() {
const readyQueue = this.readyQueue_;
this.setTimeout(function(){
let readyQueue = this.readyQueue_;
// Reset Ready Queue
this.readyQueue_ = [];
if (readyQueue && readyQueue.length > 0) {
readyQueue.forEach(function(fn) {
readyQueue.forEach(function(fn){
fn.call(this);
}, this);
}
@@ -1077,8 +1077,8 @@ class Component {
}
// Get dimension value from style
const val = this.el_.style[widthOrHeight];
const pxIndex = val.indexOf('px');
let val = this.el_.style[widthOrHeight];
let pxIndex = val.indexOf('px');
if (pxIndex !== -1) {
// Return the pixel value with no 'px'
@@ -1106,13 +1106,11 @@ class Component {
if (typeof window.getComputedStyle === 'function') {
const computedStyle = window.getComputedStyle(this.el_);
computedWidthOrHeight = computedStyle.getPropertyValue(widthOrHeight) || computedStyle[widthOrHeight];
} else if (this.el_.currentStyle) {
// ie 8 doesn't support computed style, shim it
// return clientWidth or clientHeight instead for better accuracy
const rule = `offset${toTitleCase(widthOrHeight)}`;
computedWidthOrHeight = this.el_[rule];
}
@@ -1178,11 +1176,8 @@ class Component {
this.on('touchstart', function(event) {
// If more than one finger, don't consider treating this as a click
if (event.touches.length === 1) {
// Copy pageX/pageY from the object
firstTouch = {
pageX: event.touches[0].pageX,
pageY: event.touches[0].pageY
};
// Copy the touches object to prevent modifying the original
firstTouch = assign({}, event.touches[0]);
// Record start time so we can detect a tap vs. "touch and hold"
touchStart = new Date().getTime();
// Reset couldBeTap tracking
@@ -1199,7 +1194,7 @@ class Component {
// So, if we moved only a small distance, this could still be a tap
const xdiff = event.touches[0].pageX - firstTouch.pageX;
const ydiff = event.touches[0].pageY - firstTouch.pageY;
const touchDistance = Math.sqrt(xdiff * xdiff + ydiff * ydiff);
const touchDistance = Math.sqrt(xdiff * xdiff + ydiff * ydiff);
if (touchDistance > tapMovementThreshold) {
couldBeTap = false;
@@ -1302,7 +1297,7 @@ class Component {
fn = Fn.bind(this, fn);
// window.setTimeout would be preferable here, but due to some bizarre issue with Sinon and/or Phantomjs, we can't.
const timeoutId = window.setTimeout(fn, timeout);
let timeoutId = window.setTimeout(fn, timeout);
const disposeFn = function() {
this.clearTimeout(timeoutId);
@@ -1345,7 +1340,7 @@ class Component {
setInterval(fn, interval) {
fn = Fn.bind(this, fn);
const intervalId = window.setInterval(fn, interval);
let intervalId = window.setInterval(fn, interval);
const disposeFn = function() {
this.clearInterval(intervalId);
@@ -1430,7 +1425,7 @@ class Component {
// Set up the constructor using the supplied init method
// or using the init of the parent object
// Make sure to check the unobfuscated version for external libs
const init = props.init || props.init || this.prototype.init || this.prototype.init || function() {};
let init = props.init || props.init || this.prototype.init || this.prototype.init || function() {};
// In Resig's simple class inheritance (previously used) the constructor
// is a function that calls `this.init.apply(arguments)`
// However that would prevent us from using `ParentObject.call(this);`
@@ -1440,7 +1435,7 @@ class Component {
// `ParentObject.prototype.init.apply(this, arguments);`
// Bleh. We're not creating a _super() function, so it's good to keep
// the parent constructor reference simple.
const subObj = function() {
let subObj = function() {
init.apply(this, arguments);
};
@@ -1454,7 +1449,7 @@ class Component {
subObj.extend = Component.extend;
// Extend subObj's prototype with functions and other properties from props
for (const name in props) {
for (let name in props) {
if (props.hasOwnProperty(name)) {
subObj.prototype[name] = props[name];
}
@@ -1,63 +0,0 @@
/**
* @file audio-track-button.js
*/
import TrackButton from '../track-button.js';
import Component from '../../component.js';
import AudioTrackMenuItem from './audio-track-menu-item.js';
/**
* The base class for buttons that toggle specific text track types (e.g. subtitles)
*
* @param {Player|Object} player
* @param {Object=} options
* @extends TrackButton
* @class AudioTrackButton
*/
class AudioTrackButton extends TrackButton {
constructor(player, options = {}) {
options.tracks = player.audioTracks && player.audioTracks();
super(player, options);
this.el_.setAttribute('aria-label', 'Audio Menu');
}
/**
* Allow sub components to stack CSS class names
*
* @return {String} The constructed class name
* @method buildCSSClass
*/
buildCSSClass() {
return `vjs-audio-button ${super.buildCSSClass()}`;
}
/**
* Create a menu item for each audio track
*
* @return {Array} Array of menu items
* @method createItems
*/
createItems(items = []) {
const tracks = this.player_.audioTracks && this.player_.audioTracks();
if (!tracks) {
return items;
}
for (let i = 0; i < tracks.length; i++) {
const track = tracks[i];
items.push(new AudioTrackMenuItem(this.player_, {
track,
// MenuItem is selectable
selectable: true
}));
}
return items;
}
}
AudioTrackButton.prototype.controlText_ = 'Audio Track';
Component.registerComponent('AudioTrackButton', AudioTrackButton);
export default AudioTrackButton;
@@ -1,71 +0,0 @@
/**
* @file audio-track-menu-item.js
*/
import MenuItem from '../../menu/menu-item.js';
import Component from '../../component.js';
import * as Fn from '../../utils/fn.js';
/**
* The audio track menu item
*
* @param {Player|Object} player
* @param {Object=} options
* @extends MenuItem
* @class AudioTrackMenuItem
*/
class AudioTrackMenuItem extends MenuItem {
constructor(player, options) {
const track = options.track;
const tracks = player.audioTracks();
// Modify options for parent MenuItem class's init.
options.label = track.label || track.language || 'Unknown';
options.selected = track.enabled;
super(player, options);
this.track = track;
if (tracks) {
const changeHandler = Fn.bind(this, this.handleTracksChange);
tracks.addEventListener('change', changeHandler);
this.on('dispose', () => {
tracks.removeEventListener('change', changeHandler);
});
}
}
/**
* Handle click on audio track
*
* @method handleClick
*/
handleClick(event) {
const tracks = this.player_.audioTracks();
super.handleClick(event);
if (!tracks) {
return;
}
for (let i = 0; i < tracks.length; i++) {
const track = tracks[i];
track.enabled = track === this.track;
}
}
/**
* Handle audio track change
*
* @method handleTracksChange
*/
handleTracksChange(event) {
this.selected(this.track.enabled);
}
}
Component.registerComponent('AudioTrackMenuItem', AudioTrackMenuItem);
export default AudioTrackMenuItem;
+19 -21
Ver Arquivo
@@ -4,24 +4,23 @@
import Component from '../component.js';
// Required children
import './play-toggle.js';
import './time-controls/current-time-display.js';
import './time-controls/duration-display.js';
import './time-controls/time-divider.js';
import './time-controls/remaining-time-display.js';
import './live-display.js';
import './progress-control/progress-control.js';
import './fullscreen-toggle.js';
import './volume-control/volume-control.js';
import './volume-menu-button.js';
import './mute-toggle.js';
import './text-track-controls/chapters-button.js';
import './text-track-controls/descriptions-button.js';
import './text-track-controls/subtitles-button.js';
import './text-track-controls/captions-button.js';
import './audio-track-controls/audio-track-button.js';
import './playback-rate-menu/playback-rate-menu-button.js';
import './spacer-controls/custom-control-spacer.js';
import PlayToggle from './play-toggle.js';
import CurrentTimeDisplay from './time-controls/current-time-display.js';
import DurationDisplay from './time-controls/duration-display.js';
import TimeDivider from './time-controls/time-divider.js';
import RemainingTimeDisplay from './time-controls/remaining-time-display.js';
import LiveDisplay from './live-display.js';
import ProgressControl from './progress-control/progress-control.js';
import FullscreenToggle from './fullscreen-toggle.js';
import VolumeControl from './volume-control/volume-control.js';
import VolumeMenuButton from './volume-menu-button.js';
import MuteToggle from './mute-toggle.js';
import ChaptersButton from './text-track-controls/chapters-button.js';
import DescriptionsButton from './text-track-controls/descriptions-button.js';
import SubtitlesButton from './text-track-controls/subtitles-button.js';
import CaptionsButton from './text-track-controls/captions-button.js';
import PlaybackRateMenuButton from './playback-rate-menu/playback-rate-menu-button.js';
import CustomControlSpacer from './spacer-controls/custom-control-spacer.js';
/**
* Container of main controls
@@ -42,13 +41,13 @@ class ControlBar extends Component {
className: 'vjs-control-bar',
dir: 'ltr'
}, {
// The control bar is a group, so it can contain menuitems
role: 'group'
'role': 'group' // The control bar is a group, so it can contain menuitems
});
}
}
ControlBar.prototype.options_ = {
loadEvent: 'play',
children: [
'playToggle',
'volumeMenuButton',
@@ -64,7 +63,6 @@ ControlBar.prototype.options_ = {
'descriptionsButton',
'subtitlesButton',
'captionsButton',
'audioTrackButton',
'fullscreenToggle'
]
};
+3 -17
Ver Arquivo
@@ -12,11 +12,6 @@ import Component from '../component.js';
*/
class FullscreenToggle extends Button {
constructor(player, options) {
super(player, options);
this.on(player, 'fullscreenchange', this.handleFullscreenChange);
}
/**
* Allow sub components to stack CSS class names
*
@@ -26,18 +21,7 @@ class FullscreenToggle extends Button {
buildCSSClass() {
return `vjs-fullscreen-control ${super.buildCSSClass()}`;
}
/**
* Handles Fullscreenchange on the component and change control text accordingly
*
* @method handleFullscreenChange
*/
handleFullscreenChange() {
if (this.player_.isFullscreen()) {
this.controlText('Non-Fullscreen');
} else {
this.controlText('Fullscreen');
}
}
/**
* Handles click for full screen
*
@@ -46,8 +30,10 @@ class FullscreenToggle extends Button {
handleClick() {
if (!this.player_.isFullscreen()) {
this.player_.requestFullscreen();
this.controlText('Non-Fullscreen');
} else {
this.player_.exitFullscreen();
this.controlText('Fullscreen');
}
}
+1 -1
Ver Arquivo
@@ -27,7 +27,7 @@ class LiveDisplay extends Component {
* @method createEl
*/
createEl() {
const el = super.createEl('div', {
var el = super.createEl('div', {
className: 'vjs-live-control vjs-control'
});
+9 -11
Ver Arquivo
@@ -21,15 +21,14 @@ class MuteToggle extends Button {
this.on(player, 'volumechange', this.update);
// hide mute toggle if the current tech doesn't support volume control
if (player.tech_ && player.tech_.featuresVolumeControl === false) {
if (player.tech_ && player.tech_['featuresVolumeControl'] === false) {
this.addClass('vjs-hidden');
}
this.on(player, 'loadstart', function() {
// We need to update the button to account for a default muted state.
this.update();
this.update(); // We need to update the button to account for a default muted state.
if (player.tech_.featuresVolumeControl === false) {
if (player.tech_['featuresVolumeControl'] === false) {
this.addClass('vjs-hidden');
} else {
this.removeClass('vjs-hidden');
@@ -53,7 +52,7 @@ class MuteToggle extends Button {
* @method handleClick
*/
handleClick() {
this.player_.muted(this.player_.muted() ? false : true);
this.player_.muted( this.player_.muted() ? false : true );
}
/**
@@ -62,8 +61,8 @@ class MuteToggle extends Button {
* @method update
*/
update() {
const vol = this.player_.volume();
let level = 3;
var vol = this.player_.volume(),
level = 3;
if (vol === 0 || this.player_.muted()) {
level = 0;
@@ -76,14 +75,13 @@ class MuteToggle extends Button {
// Don't rewrite the button text if the actual text doesn't change.
// This causes unnecessary and confusing information for screen reader users.
// This check is needed because this function gets called every time the volume level is changed.
const toMute = this.player_.muted() ? 'Unmute' : 'Mute';
let toMute = this.player_.muted() ? 'Unmute' : 'Mute';
if (this.controlText() !== toMute) {
this.controlText(toMute);
}
// TODO improve muted icon classes
for (let i = 0; i < 4; i++) {
/* TODO improve muted icon classes */
for (var i = 0; i < 4; i++) {
Dom.removeElClass(this.el_, `vjs-vol-${i}`);
}
Dom.addElClass(this.el_, `vjs-vol-${level}`);
+3 -5
Ver Arquivo
@@ -14,7 +14,7 @@ import Component from '../component.js';
*/
class PlayToggle extends Button {
constructor(player, options) {
constructor(player, options){
super(player, options);
this.on(player, 'play', this.handlePlay);
@@ -52,8 +52,7 @@ class PlayToggle extends Button {
handlePlay() {
this.removeClass('vjs-paused');
this.addClass('vjs-playing');
// change the button text to "Pause"
this.controlText('Pause');
this.controlText('Pause'); // change the button text to "Pause"
}
/**
@@ -64,8 +63,7 @@ class PlayToggle extends Button {
handlePause() {
this.removeClass('vjs-playing');
this.addClass('vjs-paused');
// change the button text to "Play"
this.controlText('Play');
this.controlText('Play'); // change the button text to "Play"
}
}
@@ -17,7 +17,7 @@ import * as Dom from '../../utils/dom.js';
*/
class PlaybackRateMenuButton extends MenuButton {
constructor(player, options) {
constructor(player, options){
super(player, options);
this.updateVisibility();
@@ -34,7 +34,7 @@ class PlaybackRateMenuButton extends MenuButton {
* @method createEl
*/
createEl() {
const el = super.createEl();
let el = super.createEl();
this.labelEl_ = Dom.createEl('div', {
className: 'vjs-playback-rate-value',
@@ -63,13 +63,13 @@ class PlaybackRateMenuButton extends MenuButton {
* @method createMenu
*/
createMenu() {
const menu = new Menu(this.player());
const rates = this.playbackRates();
let menu = new Menu(this.player());
let rates = this.playbackRates();
if (rates) {
for (let i = rates.length - 1; i >= 0; i--) {
menu.addChild(
new PlaybackRateMenuItem(this.player(), {rate: rates[i] + 'x'})
new PlaybackRateMenuItem(this.player(), { 'rate': rates[i] + 'x'})
);
}
}
@@ -94,13 +94,12 @@ class PlaybackRateMenuButton extends MenuButton {
*/
handleClick() {
// select next rate option
const currentRate = this.player().playbackRate();
const rates = this.playbackRates();
let currentRate = this.player().playbackRate();
let rates = this.playbackRates();
// this will select first one if the last one currently selected
let newRate = rates[0];
for (let i = 0; i < rates.length; i++) {
for (let i = 0; i < rates.length ; i++) {
if (rates[i] > currentRate) {
newRate = rates[i];
break;
@@ -116,7 +115,7 @@ class PlaybackRateMenuButton extends MenuButton {
* @method playbackRates
*/
playbackRates() {
return this.options_.playbackRates || (this.options_.playerOptions && this.options_.playerOptions.playbackRates);
return this.options_['playbackRates'] || (this.options_.playerOptions && this.options_.playerOptions['playbackRates']);
}
/**
@@ -127,10 +126,10 @@ class PlaybackRateMenuButton extends MenuButton {
* @method playbackRateSupported
*/
playbackRateSupported() {
return this.player().tech_ &&
this.player().tech_.featuresPlaybackRate &&
this.playbackRates() &&
this.playbackRates().length > 0
return this.player().tech_
&& this.player().tech_['featuresPlaybackRate']
&& this.playbackRates()
&& this.playbackRates().length > 0
;
}
@@ -14,13 +14,13 @@ import Component from '../../component.js';
*/
class PlaybackRateMenuItem extends MenuItem {
constructor(player, options) {
const label = options.rate;
const rate = parseFloat(label, 10);
constructor(player, options){
let label = options['rate'];
let rate = parseFloat(label, 10);
// Modify options for parent MenuItem class's init.
options.label = label;
options.selected = rate === 1;
options['label'] = label;
options['selected'] = rate === 1;
super(player, options);
this.label = label;
@@ -14,7 +14,7 @@ import * as Dom from '../../utils/dom.js';
*/
class LoadProgressBar extends Component {
constructor(player, options) {
constructor(player, options){
super(player, options);
this.on(player, 'progress', this.update);
}
@@ -38,16 +38,14 @@ class LoadProgressBar extends Component {
* @method update
*/
update() {
const buffered = this.player_.buffered();
const duration = this.player_.duration();
const bufferedEnd = this.player_.bufferedEnd();
const children = this.el_.children;
let buffered = this.player_.buffered();
let duration = this.player_.duration();
let bufferedEnd = this.player_.bufferedEnd();
let children = this.el_.children;
// get the percent width of a time compared to the total end
const percentify = function(time, end) {
// no NaN
const percent = (time / end) || 0;
let percentify = function (time, end){
let percent = (time / end) || 0; // no NaN
return ((percent >= 1 ? 1 : percent) * 100) + '%';
};
@@ -56,8 +54,8 @@ class LoadProgressBar extends Component {
// add child elements to represent the individual buffered time ranges
for (let i = 0; i < buffered.length; i++) {
const start = buffered.start(i);
const end = buffered.end(i);
let start = buffered.start(i);
let end = buffered.end(i);
let part = children[i];
if (!part) {
@@ -71,7 +69,7 @@ class LoadProgressBar extends Component {
// remove unused buffered range elements
for (let i = children.length; i > buffered.length; i--) {
this.el_.removeChild(children[i - 1]);
this.el_.removeChild(children[i-1]);
}
}
@@ -55,24 +55,24 @@ class MouseTimeDisplay extends Component {
}
handleMouseMove(event) {
const duration = this.player_.duration();
const newTime = this.calculateDistance(event) * duration;
const position = event.pageX - Dom.findElPosition(this.el().parentNode).left;
let duration = this.player_.duration();
let newTime = this.calculateDistance(event) * duration;
let position = event.pageX - Dom.findElPosition(this.el().parentNode).left;
this.update(newTime, position);
}
update(newTime, position) {
const time = formatTime(newTime, this.player_.duration());
let time = formatTime(newTime, this.player_.duration());
this.el().style.left = position + 'px';
this.el().setAttribute('data-current-time', time);
if (this.keepTooltipsInside) {
const clampedPosition = this.clampPosition_(position);
const difference = position - clampedPosition + 1;
const tooltipWidth = parseFloat(window.getComputedStyle(this.tooltip).width);
const tooltipWidthHalf = tooltipWidth / 2;
let clampedPosition = this.clampPosition_(position);
let difference = position - clampedPosition + 1;
let tooltipWidth = parseFloat(window.getComputedStyle(this.tooltip).width);
let tooltipWidthHalf = tooltipWidth / 2;
this.tooltip.innerHTML = time;
this.tooltip.style.right = `-${tooltipWidthHalf - difference}px`;
@@ -98,9 +98,9 @@ class MouseTimeDisplay extends Component {
return position;
}
const playerWidth = parseFloat(window.getComputedStyle(this.player().el()).width);
const tooltipWidth = parseFloat(window.getComputedStyle(this.tooltip).width);
const tooltipWidthHalf = tooltipWidth / 2;
let playerWidth = parseFloat(window.getComputedStyle(this.player().el()).width);
let tooltipWidth = parseFloat(window.getComputedStyle(this.tooltip).width);
let tooltipWidthHalf = tooltipWidth / 2;
let actualPosition = position;
if (position < tooltipWidthHalf) {
@@ -3,6 +3,7 @@
*/
import Component from '../../component.js';
import * as Fn from '../../utils/fn.js';
import * as Dom from '../../utils/dom.js';
import formatTime from '../../utils/format-time.js';
/**
@@ -15,7 +16,7 @@ import formatTime from '../../utils/format-time.js';
*/
class PlayProgressBar extends Component {
constructor(player, options) {
constructor(player, options){
super(player, options);
this.updateDataAttr();
this.on(player, 'timeupdate', this.updateDataAttr);
@@ -47,8 +48,7 @@ class PlayProgressBar extends Component {
}
updateDataAttr() {
const time = (this.player_.scrubbing()) ? this.player_.getCache().currentTime : this.player_.currentTime();
let time = (this.player_.scrubbing()) ? this.player_.getCache().currentTime : this.player_.currentTime();
this.el_.setAttribute('data-current-time', formatTime(time, this.player_.duration()));
}
@@ -2,9 +2,8 @@
* @file progress-control.js
*/
import Component from '../../component.js';
import './seek-bar.js';
import './mouse-time-display.js';
import SeekBar from './seek-bar.js';
import MouseTimeDisplay from './mouse-time-display.js';
/**
* The Progress Control component contains the seek bar, load progress,
+16 -25
Ver Arquivo
@@ -4,12 +4,12 @@
import window from 'global/window';
import Slider from '../../slider/slider.js';
import Component from '../../component.js';
import LoadProgressBar from './load-progress-bar.js';
import PlayProgressBar from './play-progress-bar.js';
import TooltipProgressBar from './tooltip-progress-bar.js';
import * as Fn from '../../utils/fn.js';
import formatTime from '../../utils/format-time.js';
import './load-progress-bar.js';
import './play-progress-bar.js';
import './tooltip-progress-bar.js';
import assign from 'object.assign';
/**
* Seek Bar and holder for the progress bars
@@ -21,7 +21,7 @@ import './tooltip-progress-bar.js';
*/
class SeekBar extends Slider {
constructor(player, options) {
constructor(player, options){
super(player, options);
this.on(player, 'timeupdate', this.updateProgress);
this.on(player, 'ended', this.updateProgress);
@@ -65,10 +65,9 @@ class SeekBar extends Slider {
this.updateAriaAttributes(this.tooltipProgressBar.el_);
this.tooltipProgressBar.el_.style.width = this.bar.el_.style.width;
const playerWidth = parseFloat(window.getComputedStyle(this.player().el()).width);
const tooltipWidth = parseFloat(window.getComputedStyle(this.tooltipProgressBar.tooltip).width);
const tooltipStyle = this.tooltipProgressBar.el().style;
let playerWidth = parseFloat(window.getComputedStyle(this.player().el()).width);
let tooltipWidth = parseFloat(window.getComputedStyle(this.tooltipProgressBar.tooltip).width);
let tooltipStyle = this.tooltipProgressBar.el().style;
tooltipStyle.maxWidth = Math.floor(playerWidth - (tooltipWidth / 2)) + 'px';
tooltipStyle.minWidth = Math.ceil(tooltipWidth / 2) + 'px';
tooltipStyle.right = `-${tooltipWidth / 2}px`;
@@ -77,12 +76,9 @@ class SeekBar extends Slider {
updateAriaAttributes(el) {
// Allows for smooth scrubbing, when player can't keep up.
const time = (this.player_.scrubbing()) ? this.player_.getCache().currentTime : this.player_.currentTime();
// machine readable value of progress bar (percentage complete)
el.setAttribute('aria-valuenow', (this.getPercent() * 100).toFixed(2));
// human readable value of progress bar (time complete)
el.setAttribute('aria-valuetext', formatTime(time, this.player_.duration()));
let time = (this.player_.scrubbing()) ? this.player_.getCache().currentTime : this.player_.currentTime();
el.setAttribute('aria-valuenow', (this.getPercent() * 100).toFixed(2)); // machine readable value of progress bar (percentage complete)
el.setAttribute('aria-valuetext', formatTime(time, this.player_.duration())); // human readable value of progress bar (time complete)
}
/**
@@ -92,8 +88,7 @@ class SeekBar extends Slider {
* @method getPercent
*/
getPercent() {
const percent = this.player_.currentTime() / this.player_.duration();
let percent = this.player_.currentTime() / this.player_.duration();
return percent >= 1 ? 1 : percent;
}
@@ -120,9 +115,7 @@ class SeekBar extends Slider {
let newTime = this.calculateDistance(event) * this.player_.duration();
// Don't let video end while scrubbing.
if (newTime === this.player_.duration()) {
newTime = newTime - 0.1;
}
if (newTime === this.player_.duration()) { newTime = newTime - 0.1; }
// Set new time (tell player to seek to new time)
this.player_.currentTime(newTime);
@@ -148,8 +141,7 @@ class SeekBar extends Slider {
* @method stepForward
*/
stepForward() {
// more quickly fast forward for keyboard-only users
this.player_.currentTime(this.player_.currentTime() + 5);
this.player_.currentTime(this.player_.currentTime() + 5); // more quickly fast forward for keyboard-only users
}
/**
@@ -158,8 +150,7 @@ class SeekBar extends Slider {
* @method stepBack
*/
stepBack() {
// more quickly rewind for keyboard-only users
this.player_.currentTime(this.player_.currentTime() - 5);
this.player_.currentTime(this.player_.currentTime() - 5); // more quickly rewind for keyboard-only users
}
}
@@ -170,7 +161,7 @@ SeekBar.prototype.options_ = {
'mouseTimeDisplay',
'playProgressBar'
],
barName: 'playProgressBar'
'barName': 'playProgressBar'
};
SeekBar.prototype.playerEvent = 'timeupdate';
@@ -3,6 +3,7 @@
*/
import Component from '../../component.js';
import * as Fn from '../../utils/fn.js';
import * as Dom from '../../utils/dom.js';
import formatTime from '../../utils/format-time.js';
/**
@@ -15,7 +16,7 @@ import formatTime from '../../utils/format-time.js';
*/
class TooltipProgressBar extends Component {
constructor(player, options) {
constructor(player, options){
super(player, options);
this.updateDataAttr();
this.on(player, 'timeupdate', this.updateDataAttr);
@@ -29,7 +30,7 @@ class TooltipProgressBar extends Component {
* @method createEl
*/
createEl() {
const el = super.createEl('div', {
let el = super.createEl('div', {
className: 'vjs-tooltip-progress-bar vjs-slider-bar',
innerHTML: `<div class="vjs-time-tooltip"></div>
<span class="vjs-control-text"><span>${this.localize('Progress')}</span>: 0%</span>`
@@ -41,9 +42,8 @@ class TooltipProgressBar extends Component {
}
updateDataAttr() {
const time = (this.player_.scrubbing()) ? this.player_.getCache().currentTime : this.player_.currentTime();
const formattedTime = formatTime(time, this.player_.duration());
let time = (this.player_.scrubbing()) ? this.player_.getCache().currentTime : this.player_.currentTime();
let formattedTime = formatTime(time, this.player_.duration());
this.el_.setAttribute('data-current-time', formattedTime);
this.tooltip.innerHTML = formattedTime;
}
@@ -29,8 +29,8 @@ class CustomControlSpacer extends Spacer {
* @method createEl
*/
createEl() {
const el = super.createEl({
className: this.buildCSSClass()
let el = super.createEl({
className: this.buildCSSClass(),
});
// No-flex/table-cell mode requires there be some content
@@ -12,24 +12,24 @@ import Component from '../../component.js';
* @extends TextTrackMenuItem
* @class CaptionSettingsMenuItem
*/
class CaptionSettingsMenuItem extends TextTrackMenuItem {
class CaptionSettingsMenuItem extends TextTrackMenuItem {
constructor(player, options) {
options.track = {
player,
kind: options.kind,
label: options.kind + ' settings',
selectable: false,
default: false,
options['track'] = {
'kind': options['kind'],
'player': player,
'label': options['kind'] + ' settings',
'selectable': false,
'default': false,
mode: 'disabled'
};
// CaptionSettingsMenuItem has no concept of 'selected'
options.selectable = false;
options['selectable'] = false;
super(player, options);
this.addClass('vjs-texttrack-settings');
this.controlText(', opens ' + options.kind + ' settings dialog');
this.controlText(', opens ' + options['kind'] + ' settings dialog');
}
/**
@@ -16,9 +16,9 @@ import CaptionSettingsMenuItem from './caption-settings-menu-item.js';
*/
class CaptionsButton extends TextTrackButton {
constructor(player, options, ready) {
constructor(player, options, ready){
super(player, options, ready);
this.el_.setAttribute('aria-label', 'Captions Menu');
this.el_.setAttribute('aria-label','Captions Menu');
}
/**
@@ -38,11 +38,10 @@ class CaptionsButton extends TextTrackButton {
*/
update() {
let threshold = 2;
super.update();
// if native, then threshold is 1 because no settings button
if (this.player().tech_ && this.player().tech_.featuresNativeTextTracks) {
if (this.player().tech_ && this.player().tech_['featuresNativeTextTracks']) {
threshold = 1;
}
@@ -60,10 +59,10 @@ class CaptionsButton extends TextTrackButton {
* @method createItems
*/
createItems() {
const items = [];
let items = [];
if (!(this.player().tech_ && this.player().tech_.featuresNativeTextTracks)) {
items.push(new CaptionSettingsMenuItem(this.player_, {kind: this.kind_}));
if (!(this.player().tech_ && this.player().tech_['featuresNativeTextTracks'])) {
items.push(new CaptionSettingsMenuItem(this.player_, { 'kind': this.kind_ }));
}
return super.createItems(items);
@@ -7,7 +7,9 @@ import TextTrackMenuItem from './text-track-menu-item.js';
import ChaptersTrackMenuItem from './chapters-track-menu-item.js';
import Menu from '../../menu/menu.js';
import * as Dom from '../../utils/dom.js';
import * as Fn from '../../utils/fn.js';
import toTitleCase from '../../utils/to-title-case.js';
import window from 'global/window';
/**
* The button component for toggling and selecting chapters
@@ -22,9 +24,9 @@ import toTitleCase from '../../utils/to-title-case.js';
*/
class ChaptersButton extends TextTrackButton {
constructor(player, options, ready) {
constructor(player, options, ready){
super(player, options, ready);
this.el_.setAttribute('aria-label', 'Chapters Menu');
this.el_.setAttribute('aria-label','Chapters Menu');
}
/**
@@ -44,18 +46,20 @@ class ChaptersButton extends TextTrackButton {
* @method createItems
*/
createItems() {
const items = [];
const tracks = this.player_.textTracks();
let items = [];
let tracks = this.player_.textTracks();
if (!tracks) {
return items;
}
for (let i = 0; i < tracks.length; i++) {
const track = tracks[i];
if (track.kind === this.kind_) {
items.push(new TextTrackMenuItem(this.player_, {track}));
let track = tracks[i];
if (track['kind'] === this.kind_) {
items.push(new TextTrackMenuItem(this.player_, {
'track': track
}));
}
}
@@ -69,16 +73,14 @@ class ChaptersButton extends TextTrackButton {
* @method createMenu
*/
createMenu() {
const tracks = this.player_.textTracks() || [];
let tracks = this.player_.textTracks() || [];
let chaptersTrack;
let items = this.items || [];
let items = this.items = [];
for (let i = tracks.length - 1; i >= 0; i--) {
for (let i = 0, length = tracks.length; i < length; i++) {
let track = tracks[i];
// We will always choose the last track as our chaptersTrack
const track = tracks[i];
if (track.kind === this.kind_) {
if (track['kind'] === this.kind_) {
chaptersTrack = track;
break;
@@ -86,30 +88,21 @@ class ChaptersButton extends TextTrackButton {
}
let menu = this.menu;
if (menu === undefined) {
menu = new Menu(this.player_);
const title = Dom.createEl('li', {
let title = Dom.createEl('li', {
className: 'vjs-menu-title',
innerHTML: toTitleCase(this.kind_),
tabIndex: -1
});
menu.children_.unshift(title);
Dom.insertElFirst(title, menu.contentEl());
} else {
// We will empty out the menu children each time because we want a
// fresh new menu child list each time
items.forEach(item => menu.removeChild(item));
// Empty out the ChaptersButton menu items because we no longer need them
items = [];
}
if (chaptersTrack && (chaptersTrack.cues === null || chaptersTrack.cues === undefined)) {
chaptersTrack.mode = 'hidden';
if (chaptersTrack && chaptersTrack.cues == null) {
chaptersTrack['mode'] = 'hidden';
const remoteTextTrackEl = this.player_.remoteTextTrackEls().getTrackElementByTrack_(chaptersTrack);
let remoteTextTrackEl = this.player_.remoteTextTrackEls().getTrackElementByTrack_(chaptersTrack);
if (remoteTextTrackEl) {
remoteTextTrackEl.addEventListener('load', (event) => this.update());
@@ -117,29 +110,31 @@ class ChaptersButton extends TextTrackButton {
}
if (chaptersTrack && chaptersTrack.cues && chaptersTrack.cues.length > 0) {
const cues = chaptersTrack.cues;
let cues = chaptersTrack['cues'], cue;
for (let i = 0, l = cues.length; i < l; i++) {
const cue = cues[i];
cue = cues[i];
const mi = new ChaptersTrackMenuItem(this.player_, {
cue,
track: chaptersTrack
let mi = new ChaptersTrackMenuItem(this.player_, {
'track': chaptersTrack,
'cue': cue
});
items.push(mi);
menu.addChild(mi);
}
this.addChild(menu);
}
if (items.length > 0) {
if (this.items.length > 0) {
this.show();
}
// Assigning the value of items back to this.items for next iteration
this.items = items;
return menu;
}
}
ChaptersButton.prototype.kind_ = 'chapters';
@@ -15,14 +15,14 @@ import * as Fn from '../../utils/fn.js';
*/
class ChaptersTrackMenuItem extends MenuItem {
constructor(player, options) {
const track = options.track;
const cue = options.cue;
const currentTime = player.currentTime();
constructor(player, options){
let track = options['track'];
let cue = options['cue'];
let currentTime = player.currentTime();
// Modify options for parent MenuItem class's init.
options.label = cue.text;
options.selected = (cue.startTime <= currentTime && currentTime < cue.endTime);
options['label'] = cue.text;
options['selected'] = (cue['startTime'] <= currentTime && currentTime < cue['endTime']);
super(player, options);
this.track = track;
@@ -47,11 +47,11 @@ class ChaptersTrackMenuItem extends MenuItem {
* @method update
*/
update() {
const cue = this.cue;
const currentTime = this.player_.currentTime();
let cue = this.cue;
let currentTime = this.player_.currentTime();
// vjs.log(currentTime, cue.startTime);
this.selected(cue.startTime <= currentTime && currentTime < cue.endTime);
this.selected(cue['startTime'] <= currentTime && currentTime < cue['endTime']);
}
}
@@ -16,14 +16,14 @@ import * as Fn from '../../utils/fn.js';
*/
class DescriptionsButton extends TextTrackButton {
constructor(player, options, ready) {
constructor(player, options, ready){
super(player, options, ready);
this.el_.setAttribute('aria-label', 'Descriptions Menu');
const tracks = player.textTracks();
let tracks = player.textTracks();
if (tracks) {
const changeHandler = Fn.bind(this, this.handleTracksChange);
let changeHandler = Fn.bind(this, this.handleTracksChange);
tracks.addEventListener('change', changeHandler);
this.on('dispose', function() {
@@ -37,15 +37,14 @@ class DescriptionsButton extends TextTrackButton {
*
* @method handleTracksChange
*/
handleTracksChange(event) {
const tracks = this.player().textTracks();
handleTracksChange(event){
let tracks = this.player().textTracks();
let disabled = false;
// Check whether a track of a different kind is showing
for (let i = 0, l = tracks.length; i < l; i++) {
const track = tracks[i];
if (track.kind !== this.kind_ && track.mode === 'showing') {
let track = tracks[i];
if (track['kind'] !== this.kind_ && track['mode'] === 'showing') {
disabled = true;
break;
}
@@ -14,19 +14,19 @@ import Component from '../../component.js';
*/
class OffTextTrackMenuItem extends TextTrackMenuItem {
constructor(player, options) {
constructor(player, options){
// Create pseudo track info
// Requires options['kind']
options.track = {
player,
kind: options.kind,
label: options.kind + ' off',
default: false,
mode: 'disabled'
options['track'] = {
'kind': options['kind'],
'player': player,
'label': options['kind'] + ' off',
'default': false,
'mode': 'disabled'
};
// MenuItem is selectable
options.selectable = true;
options['selectable'] = true;
super(player, options);
this.selected(true);
@@ -38,14 +38,13 @@ class OffTextTrackMenuItem extends TextTrackMenuItem {
* @param {Object} event Event object
* @method handleTracksChange
*/
handleTracksChange(event) {
const tracks = this.player().textTracks();
handleTracksChange(event){
let tracks = this.player().textTracks();
let selected = true;
for (let i = 0, l = tracks.length; i < l; i++) {
const track = tracks[i];
if (track.kind === this.track.kind && track.mode === 'showing') {
let track = tracks[i];
if (track['kind'] === this.track['kind'] && track['mode'] === 'showing') {
selected = false;
break;
}
@@ -15,9 +15,9 @@ import Component from '../../component.js';
*/
class SubtitlesButton extends TextTrackButton {
constructor(player, options, ready) {
constructor(player, options, ready){
super(player, options, ready);
this.el_.setAttribute('aria-label', 'Subtitles Menu');
this.el_.setAttribute('aria-label','Subtitles Menu');
}
/**
@@ -1,8 +1,9 @@
/**
* @file text-track-button.js
*/
import TrackButton from '../track-button.js';
import MenuButton from '../../menu/menu-button.js';
import Component from '../../component.js';
import * as Fn from '../../utils/fn.js';
import TextTrackMenuItem from './text-track-menu-item.js';
import OffTextTrackMenuItem from './off-text-track-menu-item.js';
@@ -14,39 +15,51 @@ import OffTextTrackMenuItem from './off-text-track-menu-item.js';
* @extends MenuButton
* @class TextTrackButton
*/
class TextTrackButton extends TrackButton {
constructor(player, options = {}) {
options.tracks = player.textTracks();
class TextTrackButton extends MenuButton {
constructor(player, options){
super(player, options);
let tracks = this.player_.textTracks();
if (this.items.length <= 1) {
this.hide();
}
if (!tracks) {
return;
}
let updateHandler = Fn.bind(this, this.update);
tracks.addEventListener('removetrack', updateHandler);
tracks.addEventListener('addtrack', updateHandler);
this.player_.on('dispose', function() {
tracks.removeEventListener('removetrack', updateHandler);
tracks.removeEventListener('addtrack', updateHandler);
});
}
/**
* Create a menu item for each text track
*
* @return {Array} Array of menu items
* @method createItems
*/
createItems(items = []) {
// Create a menu item for each text track
createItems(items=[]) {
// Add an OFF menu item to turn all tracks off
items.push(new OffTextTrackMenuItem(this.player_, {kind: this.kind_}));
items.push(new OffTextTrackMenuItem(this.player_, { 'kind': this.kind_ }));
const tracks = this.player_.textTracks();
let tracks = this.player_.textTracks();
if (!tracks) {
return items;
}
for (let i = 0; i < tracks.length; i++) {
const track = tracks[i];
let track = tracks[i];
// only add tracks that are of the appropriate kind and have a label
if (track.kind === this.kind_) {
if (track['kind'] === this.kind_) {
items.push(new TextTrackMenuItem(this.player_, {
track,
// MenuItem is selectable
selectable: true
'selectable': true,
'track': track
}));
}
}
@@ -17,20 +17,20 @@ import document from 'global/document';
*/
class TextTrackMenuItem extends MenuItem {
constructor(player, options) {
const track = options.track;
const tracks = player.textTracks();
constructor(player, options){
let track = options['track'];
let tracks = player.textTracks();
// Modify options for parent MenuItem class's init.
options.label = track.label || track.language || 'Unknown';
options.selected = track.default || track.mode === 'showing';
options['label'] = track['label'] || track['language'] || 'Unknown';
options['selected'] = track['default'] || track['mode'] === 'showing';
super(player, options);
this.track = track;
if (tracks) {
const changeHandler = Fn.bind(this, this.handleTracksChange);
let changeHandler = Fn.bind(this, this.handleTracksChange);
tracks.addEventListener('change', changeHandler);
this.on('dispose', function() {
@@ -52,9 +52,7 @@ class TextTrackMenuItem extends MenuItem {
// Android 2.3 throws an Illegal Constructor error for window.Event
try {
event = new window.Event('change');
} catch (err) {
// continue regardless of error
}
} catch(err){}
}
if (!event) {
@@ -73,26 +71,24 @@ class TextTrackMenuItem extends MenuItem {
* @method handleClick
*/
handleClick(event) {
const kind = this.track.kind;
const tracks = this.player_.textTracks();
let kind = this.track['kind'];
let tracks = this.player_.textTracks();
super.handleClick(event);
if (!tracks) {
return;
}
if (!tracks) return;
for (let i = 0; i < tracks.length; i++) {
const track = tracks[i];
let track = tracks[i];
if (track.kind !== kind) {
if (track['kind'] !== kind) {
continue;
}
if (track === this.track) {
track.mode = 'showing';
track['mode'] = 'showing';
} else {
track.mode = 'disabled';
track['mode'] = 'disabled';
}
}
}
@@ -102,8 +98,8 @@ class TextTrackMenuItem extends MenuItem {
*
* @method handleTracksChange
*/
handleTracksChange(event) {
this.selected(this.track.mode === 'showing');
handleTracksChange(event){
this.selected(this.track['mode'] === 'showing');
}
}

Alguns arquivos não foram exibidos porque demasiados arquivos foram alterados neste diff Mostrar Mais