Restructure build scripts for facilitate incorporate more apps.

gulpfile.js

@@ -8,6 +8,7 @@ const cssmin = require("gulp-cssmin");
 const rimraf = require("rimraf");
 const mustache = require("gulp-mustache");
 const rename = require("gulp-rename");
+const gulpif = require("gulp-if");
 
 const paths = {};
 paths.app = "./resources/";
@@ -16,103 +17,6 @@ paths.dist = "./dist/";
 paths.target = "./target/";
 paths.scss = paths.app + "styles/**/*.scss";
 
-/***********************************************
- * Styles
- ***********************************************/
-
-function makeAutoprefixer() {
-  return autoprefixer('last 2 version',
-                      'safari 5',
-                      'ios 6',
-                      'android 4');
-}
-
-function scssPipeline(options) {
-  const input = options.input;
-  const output = options.output;
-
-  return gulp.src(input)
-    .pipe(plumber())
-    .pipe(scss({style: "expanded"}))
-    .pipe(makeAutoprefixer())
-    .pipe(gulp.dest(output));
-}
-
-gulp.task("scss:main", function() {
-  return scssPipeline({
-    input: paths.app + "styles/main.scss",
-    output: paths.output + "css/"
-  });
-});
-
-gulp.task("scss:preview", function() {
-  return scssPipeline({
-    input: paths.app + "styles/preview.scss",
-    output: paths.output + "css/"
-  });
-});
-
-gulp.task("scss", ["scss:main", "scss:preview"]);
-
-/***********************************************
- * Templates
- ***********************************************/
-
-gulp.task("template:main", function() {
-  const ts = Math.floor(new Date());
-  const tmpl = mustache({
-    jsfile: "/js/main.js?v=" + ts,
-    cssfile: "/css/main.css?v=" + ts
-  });
-
-  return gulp.src(paths.app + "index.mustache")
-    .pipe(tmpl)
-    .pipe(rename("index.html"))
-    .pipe(gulp.dest(paths.output));
-});
-
-gulp.task("template:preview", function() {
-  const ts = Math.floor(new Date());
-  const tmpl = mustache({
-    jsfile: "/js/preview.js?v=" + ts,
-    cssfile: "/css/preview.css?v=" + ts
-  });
-
-  return gulp.src(paths.app + "preview.mustache")
-    .pipe(tmpl)
-    .pipe(rename("index.html"))
-    .pipe(gulp.dest(paths.output + "preview/"));
-});
-
-gulp.task("template", ["template:preview",
-                       "template:main"]);
-
-/***********************************************
- * Production Build
- ***********************************************/
-
-gulp.task("dist:cssmin:main", function() {
-  return gulp.src(paths.output + "css/main.css")
-    .pipe(cssmin())
-    .pipe(gulp.dest(paths.output + "css/"));
-});
-
-gulp.task("dist:cssmin:preview", function() {
-  return gulp.src(paths.output + "css/preview.css")
-    .pipe(cssmin())
-    .pipe(gulp.dest(paths.output + "css/"));
-});
-
-gulp.task("dist:cssmin", ["dist:cssmin:main",
-                          "dist:cssmin:preview"]);
-
-gulp.task("dist:scss", function(next) {
-  runseq("scss", "dist:cssmin", next);
-});
-
-gulp.task("dist:clean", function(next) {
-  rimraf(paths.dist, next);
-});
 
 /***********************************************
  * Helper Tasks
@@ -126,21 +30,157 @@ gulp.task("clean", function(next) {
   });
 });
 
-gulp.task("dist:copy", function() {
-  return gulp.src(paths.output + "/**/*.*")
-    .pipe(gulp.dest(paths.dist));
-});
+function makeAutoprefixer() {
+  return autoprefixer('last 2 version',
+                      'safari 5',
+                      'ios 6',
+                      'android 4');
+}
+
+
+function isProduction() {
+  return (process.env.NODE_ENV === 'production');
+}
 
 /***********************************************
- * Entry Points
+ * Development
  ***********************************************/
 
-// Default
-gulp.task("dist", function(next) {
-  runseq(["template", "dist:scss"], "dist:clean", "dist:copy", next);
-});
+// Styles
+
+function scssPipeline(options) {
+  return function() {
+    const input = options.input;
+    const output = options.output;
+
+    return gulp.src(input)
+      .pipe(plumber())
+      .pipe(scss({style: "expanded"}))
+      .pipe(makeAutoprefixer())
+      .pipe(gulpif(isProduction, cssmin()))
+      .pipe(gulp.dest(output));
+  };
+}
+
+gulp.task("scss:main", scssPipeline({
+  input: paths.app + "styles/main.scss",
+  output: paths.output + "css/"
+}));
+
+gulp.task("scss:view", scssPipeline({
+  input: paths.app + "styles/view.scss",
+  output: paths.output + "css/"
+}));
+
+gulp.task("scss", ["scss:main", "scss:view"]);
+
+// Templates
+
+function templatePipeline(options) {
+  return function() {
+    const input = options.input;
+    const output = options.output;
+    const jspath = options.jspath;
+    const csspath = options.csspath;
+
+    const ts = Math.floor(new Date());
+
+    const tmpl = mustache({
+      jsfile: `${jspath}?v=${ts}`,
+      cssfile: `${csspath}?v=${ts}`
+    });
+
+    return gulp.src(input)
+      .pipe(tmpl)
+      .pipe(rename("index.html"))
+      .pipe(gulp.dest(output));
+  };
+}
+
+gulp.task("template:main", templatePipeline({
+  input: paths.app + "index.mustache",
+  output: paths.output,
+  jspath: "/js/main.js",
+  csspath: "/css/main.css"
+}));
+
+gulp.task("template:view", templatePipeline({
+  input: paths.app + "view.mustache",
+  output: paths.output + "view/",
+  jspath: "/view/js/main.js",
+  csspath: "/view/css/main.css"
+}));
+
+gulp.task("template", ["template:view",
+                       "template:main"]);
+
+// Entry Point
 
-// Watch
 gulp.task("default", ["scss", "template"], function () {
   gulp.watch(paths.scss, ["scss"]);
 });
+
+/***********************************************
+ * Production
+ ***********************************************/
+
+gulp.task("dist:clean", function(next) {
+  rimraf(paths.dist, next);
+});
+
+// Templates
+
+gulp.task("dist:template:main", templatePipeline({
+  input: paths.app + "index.mustache",
+  output: paths.dist,
+  jspath: "/js/main.js",
+  csspath: "/css/main.css"
+}));
+
+gulp.task("dist:template:view", templatePipeline({
+  input: paths.app + "view.mustache",
+  output: paths.dist + "view/",
+  jspath: "/view/js/main.js",
+  csspath: "/view/css/main.css"
+}));
+
+gulp.task("dist:template", ["dist:template:view",
+                            "dist:template:main"]);
+
+// Styles
+
+gulp.task("dist:scss:main", scssPipeline({
+  input: paths.app + "styles/main.scss",
+  output: paths.dist + "css/"
+}));
+
+gulp.task("dist:scss:view", scssPipeline({
+  input: paths.app + "styles/view.scss",
+  output: paths.dist + "view/css/"
+}));
+
+gulp.task("dist:scss", ["dist:scss:main",
+                        "dist:scss:view"]);
+
+// Copy
+
+gulp.task("dist:copy:fonts", function() {
+  return gulp.src(paths.output + "/fonts/**/*")
+    .pipe(gulp.dest(paths.dist + "fonts/"));
+});
+
+gulp.task("dist:copy:images", function() {
+  return gulp.src(paths.output + "/images/**/*")
+    .pipe(gulp.dest(paths.dist + "images/"));
+});
+
+
+gulp.task("dist:copy", ["dist:copy:fonts",
+                        "dist:copy:images"]);
+
+// Entry Point
+
+gulp.task("dist", function(next) {
+  runseq("dist:clean", ["dist:template", "dist:scss", "dist:copy"], next);
+});
+

package.json

@@ -9,7 +9,7 @@
   },
   "scripts": {
     "watch": "gulp",
-    "dist": "gulp clean && ./scripts/dist && gulp dist",
+    "dist": "./scripts/dist",
     "clean": "gulp clean",
     "figwheel": "./scripts/build-worker && ./scripts/figwheel",
     "test-watch": "./scripts/watch",
@@ -20,6 +20,7 @@
     "gulp-autoprefixer": "3.1.0",
     "gulp-css-base64": "1.3.4",
     "gulp-cssmin": "0.1.7",
+    "gulp-if": "2.0.1",
     "gulp-mustache": "2.2.0",
     "gulp-plumber": "1.1.0",
     "gulp-rename": "1.2.2",

scripts/build-worker.clj

@@ -5,11 +5,11 @@
 (let [start (System/nanoTime)]
   (b/build
    (b/inputs "src" "vendor")
-   {:main 'uxbox-worker.main
+   {:main 'uxbox.worker
     :output-to "resources/public/js/worker.js"
     :output-dir "resources/public/js/worker"
     :asset-path "js"
-    :parallel-build false
+    :parallel-build true
     :optimizations :simple
     :static-fns true
     :language-in  :ecmascript6

scripts/dist

@@ -1,3 +1,8 @@
 #!/bin/sh
-lein trampoline run -m clojure.main scripts/build-worker.clj
-lein trampoline run -m clojure.main scripts/dist.clj
+
+SCRIPT=$(readlink -f $0)
+SCRIPTPATH=`dirname $SCRIPT`
+
+NODE_ENV=production gulp dist
+$SCRIPTPATH/dist-main
+$SCRIPTPATH/dist-worker

scripts/dist-main

@@ -0,0 +1,2 @@
+#!/bin/sh
+lein trampoline run -m clojure.main scripts/dist-main.clj

scripts/dist-main.clj

@@ -6,17 +6,17 @@
   (b/build
    (b/inputs "src" "vendor")
    {:main 'uxbox.main
-    :parallel-build false
+    :parallel-build true
     :warnings {:ns-var-clash false}
-    :output-to "resources/public/js/main.js"
-    :output-dir "resources/public/js"
-    :closure-defines {"uxbox.repo.core.url"
+    :output-to "dist/js/main.js"
+    :output-dir "dist/js"
+    :closure-defines {"uxbox.common.constants.url"
                       "https://test.uxbox.io/api"}
     :optimizations :simple
     :externs ["externs/main.js"]
-    :source-map "resources/public/js/main.js.map"
+    :source-map "dist/js/main.js.map"
     :static-fns true
-    :pretty-print true
+    :pretty-print false
     :language-in  :ecmascript6
     :language-out :ecmascript5
     :verbose true})

scripts/dist-worker

@@ -0,0 +1,2 @@
+#!/bin/sh
+lein trampoline run -m clojure.main scripts/dist-worker.clj

scripts/dist-worker.clj

@@ -0,0 +1,19 @@
+(require '[cljs.build.api :as b])
+
+(println "Building ...")
+
+(let [start (System/nanoTime)]
+  (b/build
+   (b/inputs "src" "vendor")
+   {:main 'uxbox.worker
+    :output-to "dist/js/worker.js"
+    :output-dir "dist/js/worker"
+    :source-map "dist/js/worker.js.map"
+    :asset-path "js"
+    :parallel-build true
+    :optimizations :simple
+    :static-fns true
+    :language-in  :ecmascript6
+    :language-out :ecmascript5
+    :verbose true})
+  (println "... done. Elapsed" (/ (- (System/nanoTime) start) 1e9) "seconds"))

scripts/figwheel.clj

@@ -8,45 +8,21 @@
    :build-ids ["main", "preview"]
    :all-builds
    [{:id "main"
-     :figwheel {:on-jsload "uxbox.ui/init"}
+     :figwheel {:on-jsload "uxbox.main.ui/init"}
      :source-paths ["src" "vendor"]
      :compiler
      {:main 'uxbox.main
       :asset-path "js"
       :parallel-build true
       :optimizations :none
-      ;; :closure-defines {"uxbox.repo.core.url"
-      ;;                   "https://test.uxbox.io/api"}
-      :closure-defines {"uxbox.repo.core.url"
-                        "http://localhost:6060/api"}
+      :closure-defines {"uxbox.common.constants.url"
+                        "https://test.uxbox.io/api"}
       :warnings {:ns-var-clash false}
-      :pretty-print true
       :language-in  :ecmascript6
       :language-out :ecmascript5
       :output-to "resources/public/js/main.js"
       :output-dir "resources/public/js"
       :verbose true}}
-    #_{:id "preview"
-     ;; :figwheel {:on-jsload "uxbox.ui/init"}
-     :source-paths ["src" "vendor"]
-     :compiler
-     {:main 'uxbox.core
-      :asset-path "js"
-      :parallel-build false
-      :optimizations :none
-      ;; :closure-defines {"uxbox.repo.core.url"
-      ;;                   "https://test.uxbox.io/api"}
-      :closure-defines {"uxbox.repo.core.url"
-                        "http://localhost:6060/api"}
-      :warnings {:ns-var-clash false}
-      :pretty-print true
-      :language-in  :ecmascript6
-      :language-out :ecmascript5
-      :output-to "resources/public/preview/js/main.js"
-      :output-dir "resources/public/preview/js"
-      :verbose true}}
-
-
-]})
+    ]})
 
 (ra/cljs-repl "main")

scripts/watch-worker.clj

@@ -2,7 +2,7 @@
 
 (b/watch
  (b/inputs "src" "vendor")
- {:main 'uxbox-worker.main
+ {:main 'uxbox.worker.main
   :output-to "resources/public/js/worker.js"
   :output-dir "resources/public/js/worker"
   :asset-path "js"