Use a custom script to copy resources (#2893)

All of those cpx invocations were getting unwieldy, and I suspect the exotic
quoting needed to run them under parallelshell was breaking things on windows.

Replace the unwieldy cpx invocations with an unwieldy custom script.

package.json

@@ -27,26 +27,22 @@
   "matrix-react-parent": "matrix-react-sdk",
   "scripts": {
     "reskindex": "reskindex -h src/header",
-    "build:res": "cpx \"{src/skins/vector/fonts,src/skins/vector/img}/**\" webapp/ && cpx \"{res/media,res/vector-icons}/**\" webapp/",
-    "build:config": "cpx config.json webapp/",
-    "build:emojione": "cpx \"node_modules/emojione/assets/svg/*\" webapp/emojione/svg/",
+    "build:res": "node scripts/copy-res.js",
     "build:modernizr": "modernizr -c .modernizr.json -d src/vector/modernizr.js",
     "build:css": "mkdirp build && catw \"src/skins/vector/css/**/*.css\" -o build/components.css --no-watch",
     "build:compile": "babel --source-maps -d lib src",
     "build:bundle": "NODE_ENV=production webpack -p --progress",
     "build:bundle:dev": "webpack --optimize-occurence-order --progress",
     "build:electron": "npm run clean && npm run build && build -wml --ia32 --x64",
-    "build": "node scripts/babelcheck.js && npm run build:res && npm run build:config && npm run build:emojione && npm run build:css && npm run build:bundle",
-    "build:dev": "node scripts/babelcheck.js && npm run build:res && npm run build:config && npm run build:emojione && npm run build:css && npm run build:bundle:dev",
+    "build": "node scripts/babelcheck.js && npm run build:res && npm run build:css && npm run build:bundle",
+    "build:dev": "node scripts/babelcheck.js && npm run build:res && npm run build:css && npm run build:bundle:dev",
     "dist": "scripts/package.sh",
-    "start:res": "parallelshell \"cpx -w \\\"{src/skins/vector/fonts,src/skins/vector/img}/**\\\" webapp/\" \"cpx -w \\\"{res/media,res/vector-icons}/**\\\" webapp/\"",
-    "start:config": "cpx -w config.json webapp/",
-    "start:emojione": "cpx \"node_modules/emojione/assets/svg/*\" webapp/emojione/svg/ -w",
+    "start:res": "node scripts/copy-res.js -w",
     "start:js": "webpack-dev-server -w --progress",
     "start:js:prod": "NODE_ENV=production webpack-dev-server -w --progress",
-    "start:skins:css": "mkdirp build && catw \"src/skins/vector/css/**/*.css\" -o build/components.css",
-    "start": "node scripts/babelcheck.js && parallelshell \"npm run start:emojione\" \"npm run start:res\" \"npm run start:config\" \"npm run start:js\" \"npm run start:skins:css\"",
-    "start:prod": "parallelshell \"npm run start:emojione\" \"npm run start:js:prod\" \"npm run start:skins:css\"",
+    "start:css": "mkdirp build && catw \"src/skins/vector/css/**/*.css\" -o build/components.css",
+    "start": "node scripts/babelcheck.js && parallelshell \"npm run start:res\" \"npm run start:js\" \"npm run start:css\"",
+    "start:prod": "parallelshell \"npm run start:res\" \"npm run start:js:prod\" \"npm run start:css\"",
     "clean": "rimraf build lib webapp electron/dist",
     "prepublish": "npm run build:compile",
     "test": "karma start --single-run=true --autoWatch=false --browsers PhantomJS --colors=false",
@@ -95,6 +91,7 @@
     "babel-preset-react": "^6.16.0",
     "babel-preset-stage-2": "^6.17.0",
     "catw": "^1.0.1",
+    "chokidar": "^1.6.1",
     "cpx": "^1.3.2",
     "css-raw-loader": "^0.1.1",
     "electron-builder": "^10.4.1",
@@ -111,6 +108,7 @@
     "karma-phantomjs-launcher": "^1.0.0",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-webpack": "^1.7.0",
+    "minimist": "^1.2.0",
     "mkdirp": "^0.5.1",
     "mocha": "^2.4.5",
     "parallelshell": "^1.2.0",

scripts/copy-res.js

@@ -0,0 +1,81 @@
+#!/usr/bin/env node
+
+// copies the resources into the webapp directory.
+//
+
+// cpx includes globbed parts of the filename in the destination, but excludes
+// common parents. Hence, "res/{a,b}/**": the output will be "dest/a/..." and
+// "dest/b/...".
+const COPY_LIST = [
+    ["res/{media,vector-icons}/**", "webapp"],
+    ["src/skins/vector/{fonts,img}/**", "webapp"],
+    ["node_modules/emojione/assets/svg/*", "webapp/emojione/svg/"],
+    ["./config.json", "webapp", {directwatch: 1}],
+];
+
+const parseArgs = require('minimist');
+const Cpx = require('cpx');
+const chokidar = require('chokidar');
+
+const argv = parseArgs(
+    process.argv.slice(2), {}
+);
+
+var watch = argv.w;
+var verbose = argv.v;
+
+function errCheck(err) {
+    if (err) {
+        console.error(err.message);
+        process.exit(1);
+    }
+}
+
+function next(i, err) {
+    errCheck(err);
+
+    if (i >= COPY_LIST.length) {
+        return;
+    }
+
+    const ent = COPY_LIST[i];
+    const source = ent[0];
+    const dest = ent[1];
+    const opts = ent[2] || {};
+
+    const cpx = new Cpx.Cpx(source, dest);
+
+    if (verbose) {
+        cpx.on("copy", (event) => {
+            console.log(`Copied: ${event.srcPath} --> ${event.dstPath}`);
+        });
+        cpx.on("remove", (event) => {
+            console.log(`Removed: ${event.path}`);
+        });
+    }
+
+    const cb = (err) => {next(i+1, err)};
+
+    if (watch) {
+        if (opts.directwatch) {
+            // cpx -w creates a watcher for the parent of any files specified,
+            // which in the case of config.json is '.', which inevitably takes
+            // ages to crawl. So we create our own watcher on the files
+            // instead.
+            const copy = () => {cpx.copy(errCheck)};
+            chokidar.watch(source)
+                .on('add', copy)
+                .on('change', copy)
+                .on('ready', cb)
+                .on('error', errCheck);
+        } else {
+            cpx.on('watch-ready', cb);
+            cpx.on("watch-error", cb);
+            cpx.watch();
+        }
+    } else {
+        cpx.copy(cb);
+    }
+}
+
+next(0);