Switch build pipeline to Gulp

5 files changed, 191 insertions, 0 deletions

diff --git a/gui/tasks/assets.js b/gui/tasks/assets.js
new file mode 100644
index 0000000000..ee53363a6a
--- /dev/null
+++ b/gui/tasks/assets.js
@@ -0,0 +1,33 @@
+const { parallel, src, dest } = require('gulp');
+
+function copyStaticAssets() {
+  return src('assets/**').pipe(dest('build/assets'));
+}
+
+function copyConfig() {
+  return src('src/config.json').pipe(dest('build/src'));
+}
+
+function copyCss() {
+  return src('src/renderer/**/*.css').pipe(dest('build/src/renderer'));
+}
+
+function copyHtml() {
+  return src('src/renderer/index.html').pipe(dest('build/src/renderer'));
+}
+
+function copyLocales() {
+  return src('locales/**/*.po').pipe(dest('build/locales'));
+}
+
+copyStaticAssets.displayName = 'copy-static-assets';
+copyConfig.displayName = 'copy-config';
+copyCss.displayName = 'copy-css';
+copyHtml.displayName = 'copy-html';
+copyLocales.displayName = 'copy-locales';
+
+exports.copyAll = parallel(copyStaticAssets, copyConfig, copyCss, copyHtml, copyLocales);
+exports.copyStaticAssets = copyStaticAssets;
+exports.copyCss = copyCss;
+exports.copyHtml = copyHtml;
+exports.copyConfig = copyConfig;
diff --git a/gui/tasks/electron.js b/gui/tasks/electron.js
new file mode 100644
index 0000000000..4b24e815ac
--- /dev/null
+++ b/gui/tasks/electron.js
@@ -0,0 +1,23 @@
+const { spawn } = require('child_process');
+const electron = require('electron');
+
+let subprocess;
+
+function startElectron(done) {
+  subprocess = spawn(electron, ['.'], {
+    env: { ...process.env, NODE_ENV: 'development' },
+    stdio: 'inherit',
+  });
+  done();
+}
+
+function stopElectron() {
+  subprocess.kill();
+  return subprocess;
+}
+
+startElectron.displayName = 'start-electron';
+stopElectron.displayName = 'stop-electron';
+
+exports.start = startElectron;
+exports.stop = stopElectron;
diff --git a/gui/tasks/hotreload.js b/gui/tasks/hotreload.js
new file mode 100644
index 0000000000..22119dd990
--- /dev/null
+++ b/gui/tasks/hotreload.js
@@ -0,0 +1,41 @@
+const { series, src, dest, watch } = require('gulp');
+const inject = require('gulp-inject-string');
+
+const browserSync = require('browser-sync').create();
+
+function startBrowserSync(done) {
+  browserSync.init(
+    {
+      ui: false,
+      localOnly: true,
+      port: 35829,
+      ghostMode: false,
+      open: false,
+      notify: false,
+      logSnippet: false,
+    },
+    function(error, bs) {
+      done(error);
+    },
+  );
+}
+
+function injectBrowserSync() {
+  return src('src/renderer/index.html')
+    .pipe(inject.before('</body>', browserSync.getOption('snippet')))
+    .pipe(inject.after('script-src', ' ' + browserSync.getOption('urls').get('local')))
+    .pipe(dest('build/src/renderer'));
+}
+
+function reloadBrowser(done) {
+  browserSync.reload();
+  done();
+}
+
+startBrowserSync.displayName = 'start-hotreload';
+injectBrowserSync.displayName = 'inject-hotreload';
+reloadBrowser.displayName = 'reload-hotreload';
+
+exports.start = series(startBrowserSync, injectBrowserSync);
+exports.inject = injectBrowserSync;
+exports.reload = reloadBrowser;
diff --git a/gui/tasks/scripts.js b/gui/tasks/scripts.js
new file mode 100644
index 0000000000..8fc7155d4b
--- /dev/null
+++ b/gui/tasks/scripts.js
@@ -0,0 +1,32 @@
+const { parallel, series, src, dest } = require('gulp');
+const envify = require('gulp-envify');
+const ts = require('gulp-typescript');
+
+const TscWatchClient = require('tsc-watch/client');
+
+function makeWatchCompiler(onFirstSuccess) {
+  const compileScripts = function() {
+    const watch = new TscWatchClient();
+    watch.on('first_success', onFirstSuccess);
+    watch.start('--noClear', '--sourceMap', '--project', '.');
+    return watch.tsc;
+  };
+  compileScripts.displayName = 'compile-scripts-watch';
+
+  return compileScripts;
+}
+
+function compileScripts() {
+  const tsProject = ts.createProject('tsconfig.json');
+
+  return tsProject
+    .src()
+    .pipe(tsProject())
+    .pipe(envify({ NODE_ENV: 'production' }))
+    .pipe(dest('build'));
+}
+
+compileScripts.displayName = 'compile-scripts';
+
+exports.build = compileScripts;
+exports.makeWatchCompiler = makeWatchCompiler;
diff --git a/gui/tasks/watch.js b/gui/tasks/watch.js
new file mode 100644
index 0000000000..00d00e4990
--- /dev/null
+++ b/gui/tasks/watch.js
@@ -0,0 +1,62 @@
+const { parallel, series, watch } = require('gulp');
+const electron = require('./electron');
+const hotreload = require('./hotreload');
+const assets = require('./assets');
+const scripts = require('./scripts');
+
+function watchMainScripts() {
+  return watch(['build/src/main/**/*.js'], series(electron.stop, electron.start));
+}
+
+function watchRendererScripts() {
+  return watch(['build/src/renderer/**/*.js'], series(hotreload.reload));
+}
+
+function watchCss() {
+  return watch(['src/renderer/**/*.css'], series(assets.copyCss, hotreload.reload));
+}
+
+function watchConfig() {
+  return watch(['src/config.json'], series(assets.copyConfig, hotreload.reload));
+}
+
+function watchHtml() {
+  return watch(
+    ['src/renderer/index.html'],
+    series(assets.copyHtml, hotreload.inject, hotreload.reload),
+  );
+}
+
+function watchStaticAssets() {
+  return watch(['assets/**'], series(assets.copyStaticAssets, hotreload.reload));
+}
+
+watchMainScripts.displayName = 'watch-main-scripts';
+watchRendererScripts.displayName = 'watch-renderer-scripts';
+watchCss.displayName = 'watch-css';
+watchConfig.displayName = 'watch-config';
+watchHtml.displayName = 'watch-html';
+watchStaticAssets.displayName = 'watch-static-assets';
+
+exports.start = series(
+  // copy all assets first
+  assets.copyAll,
+
+  // make an incremental script compiler running in watch mode
+  scripts.makeWatchCompiler(
+    // set up hotreload, run electron and begin watching filesystem for changes, after the first
+    // successful build
+    series(
+      hotreload.start,
+      electron.start,
+      parallel(
+        watchMainScripts,
+        watchRendererScripts,
+        watchCss,
+        watchConfig,
+        watchHtml,
+        watchStaticAssets,
+      ),
+    ),
+  ),
+);