get browserify working; update build and minification tasks (fixes #29)

* create browserify bundles and minify those (instead of concatenating minified JS files)
* update `dist/` files

dist/js/gamepad-client.js

@@ -5,7 +5,7 @@
 // var peer = require('./lib/peer');
 // var Promise = require('./lib/promise-1.0.0');  // jshint ignore:line
 var settings = require('./settings');
-var utils = require('./lib/utils');
+var utils = require('./lib/utils')(window, document);
 var error = utils.error;
 var trace = utils.trace;
 

gulpfile.js

@@ -1,122 +1,163 @@
-var gulp = require('gulp');
-gulp.modules = {};
-[
-  'concat',
-  'jshint',
-  'minify-css',
-  'rename',
-  'serve',
-  'symlink',
-  'uglify'
-].forEach(function (name) {
-  gulp.modules[name] = require('gulp-' + name);
-});
-
 var browserify = require('browserify');
+var gulp = require('gulp');
 var stylish = require('jshint-stylish');
 var source = require('vinyl-source-stream');
 
+var concat = require('gulp-concat');
+var jshint = require('gulp-jshint');
+var minifyCSS = require('gulp-minify-css');
+var rename = require('gulp-rename');
+var serve = require('gulp-serve');
+var streamify = require('gulp-streamify');
+var symlink = require('gulp-symlink');
+var uglify = require('gulp-uglify');
 
+
+var src = 'src';
 var paths = {
+  src: src,
   build: {
     src: {
-      css: ['src/css/**/*.css'],
-      js: ['src/js/**/*.js'],
-      jsApp: ['./src/js/host.js'],
-      jsClient: ['./src/js/client.js']
+      css: [src + '/css/**/*.css'],
+      js: [src + '/js/**/*.js'],
+      jsHost: ['./js/host.js'],
+      jsClient: ['./js/client.js']
     },
     dest: {
-      css: './src/css',
-      js: './src/js',
-      jsApp: './host.bundle.js',
+      css: src + '/css',
+      js: src + '/js',
+      jsHost: './host.bundle.js',
       jsClient: './client.bundle.js'
     }
   },
-  minify: {
-    src: {
-      jsApp: './src/js/host.bundle.js',
-      jsClient: './src/js/client.bundle.js',
-    },
-    dest: {
+  dist: {
+    raw: {
       css: './dist/css',
       js: './dist/js',
-      jsAppBasename: 'gamepad-host',
-      jsClientBasename: 'gamepad-client'
+      jsHost: './gamepad-host.js',
+      jsClient: './gamepad-client.js'
+    },
+    min: {
+      css: './dist/css',
+      js: './dist/js',
+      jsHost: './gamepad-host.min.js',
+      jsClient: './gamepad-client.min.js'
     }
   }
 };
 
 
+function bundlify(files, standalone) {
+  return browserify({
+    basedir: src,
+    entries: files,
+    debug: process.env.NODE_ENV === 'development',
+    standalone: standalone
+  });
+}
+
+
 gulp.task('css-build', function () {
   // We're using vanilla CSS, so nothing to do here.
   // Someday we may use a CSS preprocessor (but we really shouldn't).
 });
 
 
-gulp.task('js-build', function () {
-  browserify({
-      entries: paths.build.src.jsApp,
-      debug: process.env.NODE_ENV === 'development',
-      standalone: 'gamepad'
-    })
-    .bundle()
-    .pipe(source(paths.build.dest.jsApp))
-    .pipe(gulp.dest(paths.build.dest.js));
+gulp.task('js-build', [
+  'js-build-host',
+  'js-build-client'
+]);
 
-  browserify({
-      entries: paths.build.src.jsClient,
-      debug: process.env.NODE_ENV === 'development'
-    })
+gulp.task('js-build-host', function () {
+  // Write to `src/js/host.bundle.js`.
+  return bundlify(paths.build.src.jsHost, 'gamepad')
+    .bundle()
+    .pipe(source(paths.build.dest.jsHost))
+    .pipe(gulp.dest(paths.build.dest.js));
+});
+
+gulp.task('js-build-client', function () {
+  // Write to `src/js/client.bundle.js`.
+  return bundlify(paths.build.src.jsClient)
     .bundle()
     .pipe(source(paths.build.dest.jsClient))
     .pipe(gulp.dest(paths.build.dest.js));
 });
 
 
-gulp.task('css-minify', ['css-build'], function () {
+gulp.task('css-dist', [], function () {
+  // TODO: concatenate multiple CSS files.
   return gulp.src(paths.build.src.css)
-    .pipe(gulp.modules['minify-css']())
-    .pipe(gulp.modules.rename(function (path) {
+    .pipe(minifyCSS())
+    .pipe(rename(function (path) {
       path.extname = '.min.css';
     }))
-    .pipe(gulp.dest(paths.minify.dest.css));
+    .pipe(gulp.dest(paths.dist.min.css));
 });
 
 
-gulp.task('js-minify', ['js-build'], function () {
-  gulp.src(paths.minify.src.jsApp)
-    .pipe(gulp.modules.rename(function (path) {
-      path.basename = paths.minify.dest.jsAppBasename;
-    }))
-    .pipe(gulp.dest(paths.minify.dest.js))  // uncompressed
-    .pipe(gulp.modules.uglify())
-    .pipe(gulp.modules.rename(function (path) {
-      path.extname = '.min.js';
-    }))
-    .pipe(gulp.dest(paths.minify.dest.js));  // minified
+gulp.task('js-dist', [
+  'js-dist-host-raw',
+  'js-dist-client-raw',
+  'js-dist-host-min',
+  'js-dist-client-min'
+]);
 
-  gulp.src(paths.minify.src.jsClient)
-    .pipe(gulp.modules.rename(function (path) {
-      path.basename = paths.minify.dest.jsClientBasename;
-    }))
-    .pipe(gulp.dest(paths.minify.dest.js))  // uncompressed
-    .pipe(gulp.modules.uglify())
-    .pipe(gulp.modules.rename(function (path) {
-      path.extname = '.min.js';
-    }))
-    .pipe(gulp.dest(paths.minify.dest.js));  // minified
+gulp.task('js-dist-host-raw', ['js-build'], function (jsBuild, _) {
+  // // Write to `dist/js/gamepad-host.js`.
+  return bundlify(paths.build.src.jsHost, 'gamepad')
+    .bundle()
+    .pipe(source(paths.dist.raw.jsHost))
+    .pipe(gulp.dest(paths.dist.raw.js));
+});
+
+gulp.task('js-dist-client-raw', [], function () {
+  // Write to `dist/js/gamepad-client.js`.
+  return bundlify(paths.build.src.jsClient)
+    .bundle()
+    .pipe(source(paths.dist.raw.jsClient))
+    .pipe(gulp.dest(paths.dist.raw.js));
+});
+
+gulp.task('js-dist-host-min', [], function () {
+  // Write to `dist/js/gamepad-host.min.js`.
+  var hostBundle = bundlify(paths.build.src.jsHost, 'gamepad');
+
+  // Let's uglify before we browserify.
+  hostBundle.transform({
+    global: true
+  }, 'uglifyify');
+
+  hostBundle.bundle()
+    .pipe(source(paths.dist.min.jsHost))
+    .pipe(streamify(uglify()))  // Uglify again to clean up after browserify.
+    .pipe(gulp.dest(paths.dist.min.js));
+});
+
+gulp.task('js-dist-client-min', [], function () {
+  // Write to `dist/js/gamepad-client.min.js`.
+  var clientBundle = bundlify(paths.build.src.jsClient);
+
+  clientBundle.transform({
+    global: true
+  }, 'uglifyify');
+
+  clientBundle.bundle()
+    .pipe(source(paths.dist.min.jsClient))
+    .pipe(streamify(uglify()))
+    .pipe(gulp.dest(paths.dist.min.js));
 });
 
 
 gulp.task('js-lint', function () {
   return gulp.src([
       '*.js',
-      './src/js/**/*.js',
-      '!./src/js/external/**/*.js',
+      src + '/js/**/*.js',
+      '!' + src + '/js/external/**/*.js',
       '!**/*.bundle.js'
     ])
-    .pipe(gulp.modules.jshint())
-    .pipe(gulp.modules.jshint.reporter(stylish));
+    .pipe(jshint())
+    .pipe(jshint.reporter(stylish));
 });
 
 gulp.task('js-hint', ['js-lint']);
@@ -124,36 +165,38 @@ gulp.task('js-hint', ['js-lint']);
 
 gulp.task('symlink-git-hooks', function () {
   return gulp.src('scripts/git_hooks/*')
-    .pipe(gulp.modules.symlink('.git/hooks/'))
+    .pipe(symlink('.git/hooks/'))
     .pipe(gulp.dest('.git/hooks/'));
 });
 
 
 gulp.task('dev', ['build'], function () {
   gulp.watch(paths.build.src.css, ['css-build']);
-  gulp.watch(paths.build.src.js, ['js-build']);
+  gulp.watch(paths.build.src.js, ['js-lint', 'js-build']);
 });
 
 gulp.task('prod', ['default']);
 
 
-gulp.task('serve', gulp.modules.serve({
+gulp.task('serve', serve({
   root: ['src', 'dist'],
   port: process.env.PORT
 }));
 
 gulp.task('serve-dev', ['serve']);
 
-gulp.task('serve-prod', gulp.modules.serve({
+gulp.task('serve-prod', serve({
   root: 'dist',
   port: process.env.PORT,
 }));
 
 
-gulp.task('build', ['js-lint', 'css-build', 'js-build']);
+// For local development (`src/js/`).
+gulp.task('build', ['css-build', 'js-lint', 'js-build']);
 
 
-gulp.task('minify', ['js-lint', 'css-minify', 'js-minify']);
+// For production (`dist/`).
+gulp.task('dist', ['css-dist', 'js-lint', 'js-dist']);
 
 
-gulp.task('default', ['minify']);
+gulp.task('default', ['dist']);

package.json

@@ -3,16 +3,17 @@
   "version": "0.0.1",
   "devDependencies": {
     "browserify": "^5.11.1",
-    "es6-promise": "latest",
     "gulp": "^3.8.6",
-    "gulp-concat": "^2.3.4",
     "gulp-jshint": "^1.8.4",
     "gulp-minify-css": "^0.3.8",
     "gulp-rename": "^1.2.0",
     "gulp-serve": "^0.2.0",
+    "gulp-streamify": "0.0.5",
     "gulp-symlink": "^1.1.0",
-    "gulp-uglify": "^0.3.2",
+    "gulp-uglify": "^1.0.1",
     "jshint-stylish": "^0.4.0",
+    "lazypipe": "^0.2.2",
+    "uglifyify": "^2.5.0",
     "vinyl-source-stream": "^1.0.0"
   },
   "engines": {

scripts/git_hooks/pre-commit

@@ -2,4 +2,4 @@
 
 ./node_modules/.bin/gulp symlink-git-hooks  # Update symlinks if necessary.
 
-./node_modules/.bin/gulp minify  # Minify code, build docs, etc.
+./node_modules/.bin/gulp dist  # Minify code, build docs, etc.

src/examples/FullScreenMario

@@ -1 +1 @@
-Subproject commit 407a760abdc29c42f2359bdb84be3e8f36407509
+Subproject commit cebeee0021f95544ac31d2c698c45e0bb0c1a1af