Use hexo renderer

.gitignore

@@ -12,6 +12,4 @@ website/node_modules/
 website/public/
 website/.deploy*/
 website/src/_drafts
-website/src/examples/**/static/js/app.js
-
 website/themes/uppy/source/js/uppy.js

package.json

@@ -19,7 +19,7 @@
     "watch:js": "nodemon --watch src -e js --ignore src/scss -x \"npm run build:lib\"",
     "web:build": "cd website && node update.js && ./node_modules/.bin/hexo generate",
     "web:deploy": "npm run web:install && npm run web:build && ./bin/web-deploy",
-    "web:install": "cd website && npm install",
+    "web:install": "cd website && rm -rf node_modules/hexo-uppyexamplebuilder && npm install",
     "web:preview": "cd website && ./node_modules/.bin/hexo server --debug",
     "web": "npm run web:install && npm run web:build && npm run web:preview"
   },

website/_config.yml

@@ -132,15 +132,3 @@ postcss:
     autoprefixer:
       browsers:
         - 'last 2 versions'
-
-
-# Deployment
-## Docs: https://hexo.io/docs/deployment.html
-# deploy:
-#   type: git
-#   branch: gh-pages
-#   repository: git@github.com:transloadit/uppy.git
-
-# Done by build-examples.js:
-skip_render:
-  - 'examples/**/*.js'

website/build-examples.js

@@ -1,8 +1,8 @@
 /**
  * build-examples.js
  * --------
- * Searches for each example's `src/js/app.js` file.
- * Creates a new watchify instance for each `app.js`.
+ * Searches for each example's `js/app.es6` file.
+ * Creates a new watchify instance for each `app.es6`.
  * Changes to Uppy's source will trigger rebundling.
  *
  * Note:
@@ -26,7 +26,7 @@ var watchify = require('watchify');
 var webRoot = __dirname;
 var uppyRoot = path.dirname(webRoot);
 
-var srcPattern = webRoot + '/src/examples/**/js/app.js';
+var srcPattern = webRoot + '/src/examples/**/js/app.es6';
 var dstPattern = webRoot + '/public/examples/**/js/app.js';
 
 var watchifyEnabled = process.argv[2] === 'watch';
@@ -35,7 +35,7 @@ if (watchifyEnabled) {
   browserifyPlugins.push(watchify);
 }
 
-// Find each app.js file with glob.
+// Find each app.es6 file with glob.
 glob(srcPattern, function(err, files) {
   if (err) throw new Error(err);
 

website/package.json

@@ -9,6 +9,7 @@
     "autoprefixer": "^6.1.2",
     "hexo": "^3.1.1",
     "hexo-browsersync": "^0.2.0",
+    "hexo-uppyexamplebuilder": "file:./private_modules/hexo-uppyexamplebuilder",
     "hexo-deployer-git": "0.0.4",
     "hexo-generator-archive": "^0.1.2",
     "hexo-generator-category": "^0.1.2",

website/private_modules/hexo-uppyexamplebuilder/index.js

@@ -0,0 +1,30 @@
+var exec             = require('child_process').exec;
+var path             = require('path');
+var webRoot          = path.dirname(path.dirname(__dirname));
+var browserifyScript = webRoot + '/build-examples.js'
+
+hexo.extend.renderer.register('es6', 'es6', function(data, options, callback) {
+  if (!data || !data.path) {
+    return callback(null);
+  }
+
+  console.dir({
+    data:data,
+    options:options
+  });
+
+  if (!data.path.match(/\/examples\//)) {
+    callback(null, data.text);
+  }
+
+  var cmd = 'node ' + browserifyScript + data.path;
+  hexo.log.i('uppyexamplebuilder: change detected in examples. running: ' + cmd);
+  exec(cmd , function(err, stdout, stderr) {
+    if (err) {
+      return callback(err);
+    }
+
+    hexo.log.i('uppyexamplebuilder: ' + stdout);
+    callback(null, data.text);
+  });
+});

website/private_modules/hexo-uppyexamplebuilder/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "hexo-uppyexamplebuilder",
+  "version": "0.0.1",
+  "private": true,
+  "main": "index"
+}

website/src/examples/cdn.ejs

@@ -28,4 +28,4 @@ This example showcases sourcing an UMD dist build straight from a CDN.
   Along with this JavaScript:
 </p>
 
-{% include_code lang:js cdn/js/app.js %}
+{% include_code lang:js cdn/js/app.es6 %}

website/src/examples/dragdrop.ejs

@@ -28,7 +28,7 @@ Here you'll see a demo of how you might set up Drag and Drop with Uppy:
   Along with this JavaScript:
 </p>
 
-{% include_code lang:js dragdrop/js/app.js %}
+{% include_code lang:js dragdrop/js/app.es6 %}
 
 <p>
   And the following CSS:

website/src/examples/dropbox.ejs

@@ -28,7 +28,7 @@ Here you'll see a demo of how you might set up Dropbox with Uppy:
   Along with this JavaScript:
 </p>
 
-{% include_code lang:js dropbox/js/app.js %}
+{% include_code lang:js dropbox/js/app.es6 %}
 
 <p>
   And the following CSS:

website/src/examples/dropbox/js/app.js → website/src/examples/dropbox/js/app.es6

@@ -1,3 +1,6 @@
 import { DropboxPlugin } from 'uppy/plugins';
 
 console.log(DropboxPlugin);
+
+console.log('enk');
+console.log('enk');