@gkatsev updated build system to open es5 folder for bundles and dist folder other users. closes #3445

.babelrc

@@ -0,0 +1,4 @@
+{
+  "presets": ["es2015-loose"],
+  "plugins": ["transform-es3-property-literals", "transform-es3-member-expression-literals", "inline-json"]
+}

.gitignore

@@ -28,5 +28,6 @@ test/coverage/*
 .sass-cache
 
 dist/*
+es5/*
 
 .idea/

.npmignore

@@ -1,4 +1,5 @@
 # Exclude everything but the contents of the dist directory.
 **/*
 !dist/**
+!es5/**
 !src/css/**

CHANGELOG.md

@@ -14,6 +14,7 @@ CHANGELOG
 * @misteroneill updated tests to qunit 2.0 ([view](https://github.com/videojs/video.js/pull/3509))
 * @gkatsev added slack badge to README ([view](https://github.com/videojs/video.js/pull/3527))
 * @gkatsev reverted back to qunitjs 1.x to unbreak IE8. Added es5-shim to tests ([view](https://github.com/videojs/video.js/pull/3533))
+* @gkatsev updated build system to open es5 folder for bundles and dist folder other users ([view](https://github.com/videojs/video.js/pull/3445))
 
 --------------------
 

Gruntfile.js

@@ -1,4 +1,4 @@
-require('babel/register');
+require('babel-register');
 
 // Need to `require` a separate Grunt file so we can use ES6 syntax via
 // Babel's require hook.

build/grunt.js

@@ -1,4 +1,6 @@
 import {gruntCustomizer, gruntOptionsMaker} from './options-customizer.js';
+import chg from 'chg';
+
 module.exports = function(grunt) {
   require('time-grunt')(grunt);
 
@@ -16,29 +18,10 @@ module.exports = function(grunt) {
 
   const browserifyGruntDefaults = {
     browserifyOptions: {
-      debug: true,
       standalone: 'videojs'
     },
     plugin: [
       ['browserify-derequire']
-    ],
-    transform: [
-      require('babelify').configure({
-        sourceMapRelative: './',
-        loose: ['all']
-      }),
-      ['browserify-versionify', {
-        placeholder: '__VERSION__',
-        version: pkg.version
-      }],
-      ['browserify-versionify', {
-        placeholder: '__VERSION_NO_PATCH__',
-        version: version.majorMinor
-      }],
-      ['browserify-versionify', {
-        placeholder: '__SWF_VERSION__',
-        version: pkg.dependencies['videojs-swf']
-      }]
     ]
   };
 
@@ -47,7 +30,7 @@ module.exports = function(grunt) {
       release: {
         tag_name: 'v'+ version.full,
         name: version.full,
-        body: require('chg').find(version.full).changesRaw
+        body: chg.find(version.full).changesRaw
       },
     },
     files: {
@@ -111,14 +94,11 @@ module.exports = function(grunt) {
   grunt.initConfig({
     pkg,
     clean: {
-      build: ['build/temp/*'],
+      build: ['build/temp/*', 'es5'],
       dist: ['dist/*']
     },
     uglify: {
       options: {
-        sourceMap: true,
-        sourceMapIn: 'build/temp/video.js.map',
-        sourceMapRoot: '../../src/js',
         preserveComments: 'some',
         mangle: true,
         compress: {
@@ -153,6 +133,10 @@ module.exports = function(grunt) {
         files: ['src/css/**/*'],
         tasks: ['skin']
       },
+      babel: {
+        files: ['src/js/**/*.js'],
+        tasks: ['babel:es5']
+      },
       jshint: {
         files: ['src/**/*', 'test/unit/**/*.js', 'Gruntfile.js'],
         tasks: 'jshint'
@@ -317,11 +301,21 @@ module.exports = function(grunt) {
         }
       })
     },
+    babel: {
+      es5: {
+        files: [{
+          expand: true,
+          cwd: 'src/js/',
+          src: ['**/*.js', '!base-styles.js'],
+          dest: 'es5/'
+        }]
+      }
+    },
     browserify: {
       options: browserifyGruntOptions(),
       build: {
         files: {
-          'build/temp/video.js': ['src/js/video.js']
+          'build/temp/video.js': ['es5/video.js']
         }
       },
       dist: {
@@ -334,7 +328,7 @@ module.exports = function(grunt) {
           ]
         }),
         files: {
-          'build/temp/video.js': ['src/js/video.js']
+          'build/temp/video.js': ['es5/video.js']
         }
       },
       watch: {
@@ -343,14 +337,15 @@ module.exports = function(grunt) {
           keepAlive: true
         },
         files: {
-          'build/temp/video.js': ['src/js/video.js']
+          'build/temp/video.js': ['es5/video.js']
         }
       },
       tests: {
         options: {
           browserifyOptions: {
-            debug: true,
+            verbose: true,
-            standalone: false
+            standalone: false,
+            transform: ['babelify']
           },
           plugin: [
             ['proxyquireify/plugin']
@@ -367,14 +362,6 @@ module.exports = function(grunt) {
         }
       }
     },
-    exorcise: {
-      build: {
-        options: {},
-        files: {
-          'build/temp/video.js.map': ['build/temp/video.js'],
-        }
-      }
-    },
     coveralls: {
       options: {
         // warn instead of failing when coveralls errors
@@ -406,6 +393,10 @@ module.exports = function(grunt) {
       options: {
         logConcurrentOutput: true
       },
+      tests: [
+        'watch:babel',
+        'browserify:tests'
+      ],
       // Run multiple watch tasks in parallel
       // Needed so watchify can cache intelligently
       watchAll: [
@@ -439,7 +430,7 @@ module.exports = function(grunt) {
     },
     shell: {
       lint: {
-        command: 'vjsstandard',
+        command: 'npm run lint',
         options: {
           preferLocal: true
         }
@@ -457,8 +448,8 @@ module.exports = function(grunt) {
     'shell:lint',
     'clean:build',
 
+    'babel:es5',
     'browserify:build',
-    'exorcise:build',
     'concat:novtt',
     'concat:vtt',
     'usebanner:novtt',

build/tasks/cdn-links.js

@@ -1,7 +1,7 @@
 module.exports = function(grunt) {
   grunt.registerTask('cdn-links', 'Update the version of CDN links in docs', function(){
     let doc = grunt.file.read('docs/guides/setup.md');
-    let version = require('../package.json').version;
+    let version = require('../../package.json').version;
 
     // remove the patch version to point to the latest patch
     version = version.replace(/(\d+\.\d+)\.\d+/, '$1');

build/tasks/saucelabs.js

@@ -1,24 +0,0 @@
-module.exports = function(grunt) {
-  grunt.registerTask('saucelabs', function() {
-    const exec = require('child_process').exec;
-    const done = this.async();
-
-    if (this.args[0] == 'connect') {
-      exec('curl https://gist.githubusercontent.com/santiycr/5139565/raw/sauce_connect_setup.sh | bash',
-      function(error, stdout, stderr) {
-        if (error) {
-          grunt.log.error(error);
-          return done();
-        }
-
-        grunt.verbose.error(stderr.toString());
-        grunt.verbose.writeln(stdout.toString());
-        grunt.task.run(['karma:saucelabs']);
-        done();
-      });
-    } else {
-      grunt.task.run(['karma:saucelabs']);
-      done();
-    }
-  });
-}

package.json

@@ -2,6 +2,8 @@
   "name": "video.js",
   "description": "An HTML5 and Flash video player with a common API and skin for both.",
   "version": "5.11.4",
+  "main": "./es5/video.js",
+  "style": "./dist/video-js.css",
   "copyright": "Copyright Brightcove, Inc. <https://www.brightcove.com/>",
   "license": "Apache-2.0",
   "keywords": [
@@ -21,9 +23,8 @@
     "type": "git",
     "url": "https://github.com/videojs/video.js.git"
   },
-  "main": "./dist/video.js",
-  "style": "./dist/video-js.css",
   "dependencies": {
+    "babel-runtime": "^6.9.2",
     "global": "4.3.0",
     "lodash-compat": "3.10.2",
     "object.assign": "4.0.3",
@@ -36,8 +37,14 @@
     "xhr": "2.2.0"
   },
   "devDependencies": {
-    "babel": "^5.2.2",
+    "babel-cli": "^6.11.4",
-    "babelify": "^6.0.1",
+    "babel-plugin-inline-json": "^1.1.1",
+    "babel-plugin-transform-es3-member-expression-literals": "^6.8.0",
+    "babel-plugin-transform-es3-property-literals": "^6.8.0",
+    "babel-plugin-transform-runtime": "^6.9.0",
+    "babel-preset-es2015-loose": "^7.0.0",
+    "babel-register": "^6.9.0",
+    "babelify": "^7.3.0",
     "blanket": "^1.1.6",
     "browserify-derequire": "^0.9.4",
     "browserify-istanbul": "^0.2.1",
@@ -48,6 +55,7 @@
     "ghooks": "^1.3.2",
     "gkatsev-grunt-sass": "^1.1.1",
     "grunt": "^0.4.4",
+    "grunt-babel": "^6.0.0",
     "grunt-banner": "^0.4.0",
     "grunt-browserify": "3.5.1",
     "grunt-cli": "~0.1.13",
@@ -60,7 +68,6 @@
     "grunt-contrib-uglify": "^0.8.0",
     "grunt-contrib-watch": "~0.1.4",
     "grunt-coveralls": "^1.0.0",
-    "grunt-exorcise": "^1.0.1",
     "grunt-fastly": "^0.1.3",
     "grunt-github-releaser": "^0.1.17",
     "grunt-karma": "^2.0.0",
@@ -92,6 +99,7 @@
   "vjsstandard": {
     "ignore": [
       "**/Gruntfile.js",
+      "**/es5/**",
       "**/build/**",
       "**/dist/**",
       "**/docs/**",
@@ -104,7 +112,7 @@
   },
   "config": {
     "ghooks": {
-      "pre-push": "npm run lint"
+      "pre-push": "npm run lint -- --errors"
     }
   }
 }

src/js/player.js

@@ -31,10 +31,12 @@ import VideoTrackList from './tracks/video-track-list.js';
 // are always included in the video.js package. Importing the modules will
 // execute them and they will register themselves with video.js.
 import './tech/loader.js';
+import './tech/flash.js';
 import './poster-image.js';
 import './tracks/text-track-display.js';
 import './loading-spinner.js';
 import './big-play-button.js';
+import './close-button.js';
 import './control-bar/control-bar.js';
 import './error-display.js';
 import './tracks/text-track-settings.js';

src/js/tech/flash.js

@@ -75,7 +75,9 @@ class Flash extends Tech {
     // Otherwise this adds a CDN url.
     // The CDN also auto-adds a swf URL for that specific version.
     if (!options.swf) {
-      options.swf = '//vjs.zencdn.net/swf/__SWF_VERSION__/video-js.swf';
+      const ver = require('videojs-swf/package.json').version;
+
+      options.swf = `//vjs.zencdn.net/swf/${ver}/video-js.swf`;
     }
 
     // Generate ID for swf object

src/js/tracks/track-enums.js

@@ -15,7 +15,7 @@
  *   "",
  * };
  */
-const VideoTrackKind = {
+export const VideoTrackKind = {
   alternative: 'alternative',
   captions: 'captions',
   main: 'main',
@@ -37,7 +37,7 @@ const VideoTrackKind = {
  *   "",
  * };
  */
-const AudioTrackKind = {
+export const AudioTrackKind = {
   'alternative': 'alternative',
   'descriptions': 'descriptions',
   'main': 'main',
@@ -57,7 +57,7 @@ const AudioTrackKind = {
  *   "metadata"
  * };
  */
-const TextTrackKind = {
+export const TextTrackKind = {
   subtitles: 'subtitles',
   captions: 'captions',
   descriptions: 'descriptions',
@@ -70,10 +70,8 @@ const TextTrackKind = {
  *
  * enum TextTrackMode { "disabled",  "hidden",  "showing" };
  */
-const TextTrackMode = {
+export const TextTrackMode = {
   disabled: 'disabled',
   hidden: 'hidden',
   showing: 'showing'
 };
-
-export default { VideoTrackKind, AudioTrackKind, TextTrackKind, TextTrackMode };

src/js/video.js

@@ -13,7 +13,7 @@ import EventTarget from './event-target';
 import * as Events from './utils/events.js';
 import Player from './player';
 import plugin from './plugins.js';
-import mergeOptions from '../../src/js/utils/merge-options.js';
+import mergeOptions from './utils/merge-options.js';
 import * as Fn from './utils/fn.js';
 import TextTrack from './tracks/text-track.js';
 import AudioTrack from './tracks/audio-track.js';
@@ -132,7 +132,7 @@ setup.autoSetupTimeout(1, videojs);
  *
  * @type {String}
  */
-videojs.VERSION = '__VERSION__';
+videojs.VERSION = require('../../package.json').version;
 
 /**
  * The global options object. These are the settings that take effect

test/karma.conf.js

@@ -29,12 +29,7 @@ module.exports = function(config) {
     browserify: {
       debug: true,
       plugin: ['proxyquireify/plugin'],
-      transform: [
+      transform: ['babelify']
-        require('babelify').configure({
-          sourceMapRelative: './',
-          loose: ['all']
-        })
-      ]
     },
 
     plugins: [

test/unit/tracks/text-track.test.js

@@ -266,7 +266,7 @@ QUnit.test('tracks are parsed if vttjs is loaded', function(assert) {
     xhr(options, fn) {
       xhrHandler = fn;
     }
-  });
+  }).default;
 
   /* eslint-disable no-unused-vars */
   const tt = new TextTrack_({
@@ -294,7 +294,7 @@ QUnit.test('tracks are parsed once vttjs is loaded', function(assert) {
     xhr(options, fn) {
       xhrHandler = fn;
     }
-  });
+  }).default;
 
   window.WebVTT = true;
 
@@ -356,7 +356,7 @@ QUnit.test('stops processing if vttjs loading errored out', function(assert) {
         error: errorSpy
       }
     }
-  });
+  }).default;
 
   const testTech = new EventTarget();