added BarChartDisplay sink

examples/sink-bar-chart-display/.babelrc

@@ -0,0 +1,5 @@
+{
+  "sourceMap": "inline",
+  "presets": ["latest"],
+  "plugins": ["transform-runtime", "transform-es2015-modules-commonjs"]
+}

examples/sink-bar-chart-display/.gitignore

@@ -0,0 +1,5 @@
+node_modules/
+dist/
+
+.DS_Store
+npm-debug.log

examples/sink-bar-chart-display/README.md

@@ -0,0 +1,34 @@
+ES6 Prototyping Boilerplate
+=======================================================
+
+> A client-side boilerplate for rapid prototyping with latest EcmaScript features (using [babel-latest](https://babeljs.io/docs/plugins/preset-latest/) preset)
+
+## Available Commands
+
+```
+npm run [command]
+```
+
+- `transpile`
+  * transpile all files from `src` folder to `dist` folder
+- `bundle`
+  * run `transpile` command
+  * create the browserified bundle
+- `watch`
+  * create a static file server
+  * transpile files in `src` folder when changed
+  * rebundle application on page load
+- `serve`
+  * run the static file server only _(presentation mode)_
+
+## Usage
+
+```sh
+git clone --depth=1 https://github.com/Ircam-RnD/es6-prototyping-boilerplate.git dest_directory
+cd dest_directory
+rm -rf .git  # remove git history
+npm install
+```
+
+This boilerplate uses [https://babeljs.io/](https://babeljs.io/) and [http://browserify.org/](http://browserify.org/).
+

examples/sink-bar-chart-display/bin/javascripts

@@ -0,0 +1,132 @@
+#!/usr/bin/env node
+var babel = require('babel-core');
+var browserify = require('browserify');
+var fse = require('fs-extra');
+var log = require('./log');
+var path = require('path');
+
+'use strict';
+
+/**
+ * Create a transpiler object binded to a `srcDirectory` and a `distDirectory`
+ */
+function getTranspiler(srcDirectory, distDirectory, isAllowed, babelOptions, browserifyOptions) {
+
+  /**
+   * Returns the name of the target transpiled file
+   */
+  function getTarget(filename) {
+    var relFilename = path.relative(srcDirectory, filename);
+    var outFilename = path.join(distDirectory, relFilename);
+    return outFilename;
+  }
+
+  /**
+   * returns the transpiler to be consumed.
+   */
+  var transpiler = {
+    /**
+     * Transpile the given file from es6 to es5. If the given stack is not empty
+     * call the method recursively till its empty. When the stack is empty,
+     * execute the callback.
+     */
+    transpile: function(filename, stack, callback) {
+      /**
+       * If stack is not empty transpile the next entry, else execute the
+       * callback if any.
+       */
+      function next() {
+        if (stack && stack.length > 0)
+          transpiler.transpile(stack.shift(), stack, callback);
+        else if (stack.length === 0 && callback)
+          callback();
+      }
+
+      if (filename === undefined || !isAllowed(filename))
+        return next();
+
+      var outFilename = getTarget(filename);
+      var startTime = new Date().getTime();
+
+      babel.transformFile(filename, babelOptions, function(err, result) {
+        if (err)
+          return log.transpileError(err);
+
+        fse.outputFile(outFilename, result.code, function(err) {
+          if (err)
+            return console.error(err.message);
+
+          log.transpileSuccess(filename, outFilename, startTime);
+          next();
+        });
+      });
+    },
+
+    /**
+     * Transform a given file to it's browserified version, client only.
+     * Only clients have their browserified counterparts, each folder in `src/client`
+     * is considered has a separate browserified client file. The `index.js` in each
+     * folder defines the entry point of the particular client. The browserified
+     * file is name after the name of the folder.
+     */
+    bundle: function(entryPoint, outFilename, callback) {
+      if (entryPoint === undefined || !isAllowed(entryPoint))
+        return;
+
+      var bundler = browserify(entryPoint, browserifyOptions);
+      var startTime = new Date().getTime();
+
+      log.bundleStart(outFilename);
+      fse.ensureFileSync(outFilename); // ensure file exists
+
+      var writeStream = fse.createWriteStream(outFilename);
+
+      bundler
+        .bundle()
+        .on('error', function(err) {
+          log.bundleError(outFilename, err);
+        })
+        .on('end', function() {
+          log.bundleSuccess(outFilename, startTime);
+        })
+        .pipe(writeStream);
+
+      writeStream.on('finish', function() {
+        if (callback)
+          callback();
+      });
+    },
+
+    /**
+     * Delete the transpiled file.
+     */
+    delete: function(filename, callback) {
+      var outFilename = getTarget(filename);
+
+      fse.stat(outFilename, function(err, stats) {
+        if (err)
+          return console.log(err.message);
+
+        if (stats.isFile()) {
+          fse.remove(outFilename, function(err) {
+            if (err)
+              return console.log(err.message);
+
+            log.deleteFile(outFilename);
+
+            if (callback)
+              callback();
+          });
+        } else {
+          callback();
+        }
+      });
+    },
+  };
+
+  return transpiler;
+}
+
+module.exports = {
+  getTranspiler: getTranspiler
+};

examples/sink-bar-chart-display/bin/log

@@ -0,0 +1,81 @@
+#!/usr/bin/env node
+var pkg = require('../package.json');
+var colors = require('colors');
+var ora = require('ora');
+var path = require('path');
+
+'use strict';
+
+var prefix = '[' + pkg.name + ']\t';
+var cwd = process.cwd();
+
+function toRel(target) {
+  return path.relative(cwd, target);
+}
+
+function getDeltaTime(time) {
+  return new Date().getTime() - time;
+}
+
+var spinners = {};
+
+var log = {
+  bundleStart: function(dest) {
+    var msg = prefix + (toRel(dest) + ': bundle start').yellow;
+    var spinner = ora({ color: 'white', text: msg });
+    spinner.start();
+
+    spinners[dest] = spinner;
+  },
+
+  bundleSuccess: function(dest, startTime) {
+    var spinner = spinners[dest];
+    var time = getDeltaTime(startTime);
+    var msg = prefix + '%s: successfully created (%sms)'.green;
+
+    spinner.stop();
+    console.log(msg, toRel(dest), time);
+  },
+
+  bundleError: function(dest, err) {
+    var spinner = spinners[dest];
+    var msg = prefix + '%s: bundle error'.red;
+
+    spinner.stop();
+    console.log(msg, toRel(dest));
+    console.log('> ' + err.message);
+  },
+
+  transpileSuccess: function(src, dest, startTime) {
+    var time = getDeltaTime(startTime);
+    var msg = prefix + '%s: successfully transpiled to "%s" (%sms)'.green;
+
+    console.log(msg, toRel(src), toRel(dest), time);
+  },
+
+  transpileError: function(err) {
+    var parts = err.message.split(':');
+    var msg = prefix + '%s'.red;
+
+    console.log(msg, toRel(err.message));
+    console.log(err.codeFrame);
+  },
+
+  uglifySuccess: function(src, dest, startTime) {
+    var time = getDeltaTime(startTime);
+    var msg = prefix + '%s: successfully uglified to "%s" (%sms)'.green;
+    console.log(msg, toRel(src), toRel(dest), time);
+  },
+
+  deleteFile: function(filename) {
+    var msg = prefix + '%s: successfully removed'.yellow;
+    console.log(msg, toRel(filename));
+  },
+
+  serverStart: function(port) {
+    var msg = prefix + 'server listen on http://127.0.0.1:%s'.blue;
+    console.log(msg, port);
+  }
+};
+
+module.exports = log;