gulpfile.js

'use strict';

// Include Gulp & tools we'll use
var gulp = require('gulp');
var $ = require('gulp-load-plugins')();
var del = require('del');
var exec = require('child_process').exec;
var merge = require('merge-stream');
var path = require('path');

// Load tasks for web-component-tester
// Adds tasks for `gulp test:local` and `gulp test:remote`
require('web-component-tester').gulp.init(gulp);

// Clean output directory
gulp.task('clean', function() {
	return del(['.tmp', "dist"]);
});

// Compile Go down to JS
var buildGopherJS = function () {
	exec('mkdir -p .tmp && cd .tmp && gb wrap gopherjs build web/main/client && cd ..', function (err, stdout, stderr) {
		if(stdout.length != 0) {
			console.log(stdout);
		}
		if(stderr.length != 0) {
			console.log(stderr);
		}
	});
}

// Build for development
// Note: We don't need to run any global operations like vulcanize here, so we just copy stuff over directly to dist when possible
gulp.task('build-dev', ['clean'], function() {
	// Compile gopherJS
	buildGopherJS()

	// Prefix html
	var prefixHtml = gulp.src('client/**/*.html')
		.pipe($.htmlAutoprefixer())
		.pipe(gulp.dest('dist'));

	// Prefix css
	var prefixCss = gulp.src('client/**/*.css')
		.pipe($.autoprefixer())
		.pipe(gulp.dest('dist'));

	// Copy over javascript
	var copyJs = gulp.src('client/**/*.js')
		.pipe(gulp.dest('dist'));

	// Copy over bower components
	var copyBowerComponents = gulp.src('bower_components/**/*')
		.pipe(gulp.dest('dist/bower_components'));

	// Copy gopherJS output to dist as well
	var copyTmpToDist = gulp.src('.tmp/**/*.*')
		.pipe(gulp.dest('dist'));

	return merge(prefixHtml, prefixCss, copyJs, copyBowerComponents, copyTmpToDist)
});

// Build .tmp dir for production
gulp.task('build-prod-tmp', ['clean'], function() {
	// Compile gopherJS
	buildGopherJS()

	// Move all js, css and html files to .tmp
	// Process javascript, goes to .tmp, will get picked up by either vulcanize or useref if it needs to move to dist
	var processCode = gulp.src(['client/**/*.js', 'client/**/*.css', 'client/**/*.html'])
		.pipe(gulp.dest('.tmp'));

	// Copy over bower components, goes to .tmp, will get picked up by either vulcanize or useref if it needs to move to dist
	var copyBowerComponents = gulp.src('bower_components/**/*')
	.pipe(gulp.dest('.tmp/bower_components'));

	return merge(processCode, copyBowerComponents);
});

// Build for production
// Note: We use .tmp as an intermediary folder for all html/css/js
gulp.task('build-prod', ['clean', 'build-prod-tmp'], function() {
	// Optimize images
	var processImages = gulp.src(['client/**/*.png', 'client/**/*.jpg', 'client/**/*.gif', 'client/**/*.svg'])
		.pipe($.imagemin())
		.pipe(gulp.dest('dist'));

	// Process elements/elements.html
	var processElements = gulp.src('.tmp/elements/elements.html')
		.pipe($.vulcanize({
		  stripComments: true,
		  inlineCss: true,
		  inlineScripts: true
		}))
		.pipe($.htmlAutoprefixer())
		.pipe($.minifyHtml())
		.pipe($.minifyInline())
		.pipe($.rename('elements.min.html'))
		.pipe(gulp.dest('dist'));

	var processRootHtml = gulp.src('.tmp/*.html')
		.pipe($.replace('elements/elements.html', 'elements.min.html'))
		.pipe($.useref())
		.pipe($.if("*.js", $.uglify()))
		.pipe($.if("*.css", $.autoprefixer()))
		.pipe($.if("*.css", $.cssnano()))
		.pipe($.if("*.html", $.htmlAutoprefixer()))
		.pipe($.if("*.html", $.minifyHtml()))
		.pipe($.if("*.html", $.minifyInline()))
		.pipe(gulp.dest('dist'))
});