WIP: Working browserify. Not backwards compatible.

package.json

@@ -13,17 +13,19 @@
   "homepage": "http://videojs.com",
   "author": "Steve Heffernan",
   "scripts": {
-    "test": "grunt test"
+    "test": "grunt test",
+    "build": "browserify -d --standalone 'videojs' . -o bundle.js"
   },
   "repository": {
     "type": "git",
     "url": "https://github.com/videojs/video.js.git"
   },
-  "main": "./dist/video-js/video.js",
+  "main": "./src/js/video.js",
   "dependencies": {
     "videojs-swf": "4.4.2"
   },
   "devDependencies": {
+    "browserify": "^4.2.1",
     "calcdeps": "~0.1.7",
     "chg": "~0.1.8",
     "contribflow": "~0.2.0",

src/js/big-play-button.js

@@ -1,3 +1,7 @@
+var BigPlayButton, Button;
+
+Button = require('./button.js');
+
 /* Big Play Button
 ================================================================================ */
 /**
@@ -8,16 +12,18 @@
  * @class
  * @constructor
  */
-vjs.BigPlayButton = vjs.Button.extend();
+BigPlayButton = Button.extend();
 
-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: '<span aria-hidden="true"></span>',
     'aria-label': 'play video'
   });
 };
 
-vjs.BigPlayButton.prototype.onClick = function(){
+BigPlayButton.prototype.onClick = function(){
   this.player_.play();
 };
+
+module.exports = BigPlayButton;

src/js/button.js

@@ -1,3 +1,9 @@
+var Button, Component, vjslib, vjsevents;
+
+Component = require('./component.js');
+vjslib = require('./lib.js');
+vjsevents = require('./events.js');
+
 /* Button - Base class for all buttons
 ================================================================================ */
 /**
@@ -7,13 +13,13 @@
  * @class
  * @constructor
  */
-vjs.Button = vjs.Component.extend({
+Button = Component.extend({
   /**
    * @constructor
    * @inheritDoc
    */
   init: function(player, options){
-    vjs.Component.call(this, player, options);
+    Component.call(this, player, options);
 
     this.emitTapEvents();
 
@@ -24,26 +30,26 @@ vjs.Button = vjs.Component.extend({
   }
 });
 
-vjs.Button.prototype.createEl = function(type, props){
+Button.prototype.createEl = function(type, props){
   var el;
 
   // Add standard Aria and Tabindex info
-  props = vjs.obj.merge({
+  props = vjslib.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);
+  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_ = vjslib.createEl('div', {
       className: 'vjs-control-content'
     });
 
-    this.controlText_ = vjs.createEl('span', {
+    this.controlText_ = vjslib.createEl('span', {
       className: 'vjs-control-text',
       innerHTML: this.buttonText || 'Need Text'
     });
@@ -55,21 +61,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, 'keyup', vjs.bind(this, this.onKeyPress));
+Button.prototype.onFocus = function(){
+  vjsevents.on(document, 'keyup', vjslib.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 +84,8 @@ vjs.Button.prototype.onKeyPress = function(event){
 };
 
 // Blur - Remove keyboard triggers
-vjs.Button.prototype.onBlur = function(){
-  vjs.off(document, 'keyup', vjs.bind(this, this.onKeyPress));
+Button.prototype.onBlur = function(){
+  vjsevents.off(document, 'keyup', vjslib.bind(this, this.onKeyPress));
 };
+
+module.exports = Button;

src/js/cdn.js

@@ -1,3 +1,5 @@
+module.exports = function sendGAEvent() {
+
 /**
  * Google Analytics tracking pixel for the freely hosted version of Video.js
  * at vjs.zencdn.net. We'll use this data to develop a support matrix of
@@ -53,4 +55,6 @@
     // Custom Var: vjsv is the variable name and 1.0.0 is the VJS version
     +'&utme=8(vjsv)9(v0.0.0)'
   ;
-})(new Image(),window,navigator,encodeURIComponent);
+})(new Image(),window,navigator,encodeURIComponent);
+
+}