Comparar commits
1 Commits
| Autor | SHA1 | Data | |
|---|---|---|---|
| 326aa541c1 |
@@ -1,4 +0,0 @@
|
||||
{
|
||||
"presets": ["es2015-loose"],
|
||||
"plugins": ["transform-es3-property-literals", "transform-es3-member-expression-literals", "inline-json"]
|
||||
}
|
||||
@@ -28,6 +28,5 @@ test/coverage/*
|
||||
.sass-cache
|
||||
|
||||
dist/*
|
||||
es5/*
|
||||
|
||||
.idea/
|
||||
|
||||
+47
@@ -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,5 +1,4 @@
|
||||
# Exclude everything but the contents of the dist directory.
|
||||
**/*
|
||||
!dist/**
|
||||
!es5/**
|
||||
!src/css/**
|
||||
|
||||
+1
-1
@@ -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
@@ -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
@@ -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.
|
||||
|
||||
@@ -3,8 +3,6 @@
|
||||
# [Video.js - HTML5 Video Player](http://videojs.com)
|
||||
[](https://travis-ci.org/videojs/video.js)
|
||||
[](https://coveralls.io/github/videojs/video.js?branch=master)
|
||||
[](http://slack.videojs.com)
|
||||
|
||||
|
||||
[](https://nodei.co/npm/video.js/)
|
||||
|
||||
|
||||
+70
-75
@@ -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,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');
|
||||
|
||||
@@ -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);
|
||||
});
|
||||
};
|
||||
@@ -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
@@ -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",
|
||||
|
||||
externo
+45
-74
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
+1
-1
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
+18420
-20422
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
+10
-13
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
+1
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
+1
-1
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Video.js Text Descriptions, Chapters & Captions Example</title>
|
||||
|
||||
+4
-1
@@ -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>
|
||||
|
||||
externo
BIN
Arquivo binário não exibido.
externo
-3
@@ -94,9 +94,6 @@
|
||||
<glyph glyph-name="audio-description"
|
||||
unicode=""
|
||||
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=""
|
||||
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 |
externo
BIN
Arquivo binário não exibido.
externo
BIN
Arquivo binário não exibido.
externo
+1
-7
@@ -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)"
|
||||
});
|
||||
externo
-3
@@ -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",
|
||||
|
||||
externo
+3
-16
@@ -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."
|
||||
});
|
||||
externo
+4
-15
@@ -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."
|
||||
});
|
||||
externo
+3
-3
@@ -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."
|
||||
});
|
||||
externo
BIN
Arquivo binário não exibido.
externo
BIN
Arquivo binário não exibido.
externo
+44
-105
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
+1
-1
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
BIN
Arquivo binário não exibido.
externo
+18419
-20421
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
+303
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
+11
-15
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
externo
+1
Diff do arquivo suprimido porque uma ou mais linhas são muito longas
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Video.js Text Descriptions, Chapters & Captions Example</title>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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
@@ -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>
|
||||
|
||||
@@ -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
@@ -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>
|
||||
|
||||
@@ -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
@@ -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
|
||||
|
||||
|
||||
@@ -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
@@ -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)"
|
||||
}
|
||||
|
||||
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Video.js Text Descriptions, Chapters & Captions Example</title>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Video.js Icons Sandbox</title>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Video.js Sandbox</title>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Video.js Plugin Example</title>
|
||||
|
||||
@@ -1,5 +0,0 @@
|
||||
@media print {
|
||||
.video-js > *:not(.vjs-tech):not(.vjs-poster) {
|
||||
visibility:hidden;
|
||||
}
|
||||
}
|
||||
@@ -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 +1,2 @@
|
||||
$icon-font-path: 'font' !default;
|
||||
$icon-codepoints: false !default;
|
||||
|
||||
@@ -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; }
|
||||
}
|
||||
|
||||
@@ -1,3 +0,0 @@
|
||||
.video-js .vjs-audio-button {
|
||||
@extend .vjs-icon-audio;
|
||||
}
|
||||
@@ -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;
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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 {
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -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; } }
|
||||
@@ -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";
|
||||
|
||||
@@ -1 +1,3 @@
|
||||
$icon-codepoints: true;
|
||||
|
||||
@import "video-js";
|
||||
|
||||
@@ -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
@@ -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);
|
||||
|
||||
@@ -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
@@ -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;
|
||||
@@ -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'
|
||||
]
|
||||
};
|
||||
|
||||
@@ -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');
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -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'
|
||||
});
|
||||
|
||||
|
||||
@@ -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}`);
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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
Referência em uma Nova Issue
Bloquear um usuário