diff --git a/gulpfile.babel.js b/gulpfile.babel.js
index 0300c6c..a8fa113 100644
--- a/gulpfile.babel.js
+++ b/gulpfile.babel.js
@@ -15,16 +15,45 @@ import colors from 'colors';
const $ = plugins();
+/* Enable/disable prefix workflow - allows for layouts to have different css references
+ but page names prefix must match css file name
+ e.g.
+ > scss/__invite.scss
+ .invite { background-color:#333333; ... }
+ ...
+
+ > scss/invite.scss
+ @import 'settings';
+ @import 'foundation-emails';
+ @import '_invite';
+ ...
+
+ > layouts/invite.html
+ ...
+
+ ...
+
+ > pages/invite.html, invite2.html, invite_audience1.html
+ ---
+ layout: invite
+ ---
+ ...
+
+ //So all the pages with the prefix "invite" will be inlined with the css from invite.css
+*/
+var PREFIX_WORKFLOW=true;
+var PREFIX_BUILD_INDEX=true; //prefix/true | alpha | false
+
// Look for the --production flag
const PRODUCTION = !!(yargs.argv.production);
const EMAIL = yargs.argv.to;
-// Declar var so that both AWS and Litmus task can use it.
+// Declare var so that both AWS and Litmus task can use it.
var CONFIG;
// Build the "dist" folder by running all of the above tasks
gulp.task('build',
- gulp.series(clean, pages, sass, images, inline));
+ gulp.series(clean, pages, sass, images, inline, prefixIndex));
// Build emails, run the server, and watch for file changes
gulp.task('default',
@@ -70,7 +99,7 @@ function resetPages(done) {
// Compile Sass into CSS
function sass() {
- return gulp.src('src/assets/scss/app.scss')
+ return gulp.src('src/assets/scss/*.scss')
.pipe($.if(!PRODUCTION, $.sourcemaps.init()))
.pipe($.sass({
includePaths: ['node_modules/foundation-emails/scss']
@@ -91,16 +120,139 @@ function images() {
}
// Inline CSS and minify HTML
-function inline() {
- return gulp.src('dist/**/*.html')
- .pipe($.if(PRODUCTION, inliner('dist/css/app.css')))
+function inline(done) {
+
+ if (PREFIX_WORKFLOW) {
+ var files = fs.readdirSync('./dist/css');
+ var prefix = '';
+ var result = done();
+ for(var i in files) {
+ prefix = files[i].slice(0, -4);
+ result = gulp.src('dist/**/' + prefix + '*.html')
+ .pipe($.if(PRODUCTION, inliner('dist/css/' + prefix + '.css')))
+ .pipe($.if(PRODUCTION, $.replace(/]*>/, '')))
+ .pipe(gulp.dest('dist'));
+ }
+ return result;
+ } else {
+ return gulp.src('dist/**/*.html')
+ .pipe($.if(PRODUCTION, inliner('dist/css/app.css')))
+ .pipe($.replace(/]*>/, ''))
+ .pipe(gulp.dest('dist'));
+ }
+}
+
+//generate list of links to template previews
+function prefixIndex(done) {
+
+ if (PREFIX_WORKFLOW && PREFIX_BUILD_INDEX) {
+
+ var pages = fs.readdirSync('./src/pages');
+ var files = fs.readdirSync('./dist/css');
+ var groups = [];
+ var prefixes = [];
+ var index = [];
+ for(var i in files) {
+ prefix = files[i].slice(0, -4);
+
+ prefixes.push(prefix);
+ }
+
+ var page = '';
+ var prefix = '';
+ var i = null, j = null;
+ for(i in pages) {
+
+ page = pages[i];
+ index.push(page);
+ for (j in prefixes) {
+
+ prefix = prefixes[j];
+
+ if (page.indexOf(prefix) != -1) {
+
+ if (groups[prefix] === undefined) {
+ groups[prefix] = [];
+ }
+ groups[prefix].push(page);
+ break;
+ }
+ }
+ }
+
+ var content = '';
+ content += '';
+ content += ' ';
+ content += ' ';
+
+ switch(PREFIX_BUILD_INDEX) {
+ case 'alpha':
+ i = null, j = null;
+ var title = '';
+ content += 'Index
';
+ content += '';
+ break;
+ case 'prefix':
+ case 'true':
+ case true:
+ i = null, j = null;
+ var title = '';
+ for(i in groups) {
+
+ title = i.replace(/_/g, ' ');
+ title = title.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
+ content += '' + title + '
';
+ content += '';
+ }
+ break;
+ }
+
+ content += ' ';
+ content += '
';
+ content += '';
+
+ fs.writeFile("./src/pages/prefix_index.html", content, function(err) {
+ if(err) {
+ console.log('Error writing index');
+ done();
+ }
+ });
+
+ return gulp.src('src/pages/prefix_index.html')
+ .pipe(panini({
+ root: 'src/pages',
+ layouts: 'src/layouts',
+ partials: 'src/partials',
+ helpers: 'src/helpers'
+ }))
+ .pipe(inky())
.pipe(gulp.dest('dist'));
+
+ } else {
+ done();
+ }
+
}
// Start a server with LiveReload to preview the site in
function server(done) {
browser.init({
- server: 'dist'
+ server: {
+ baseDir: 'dist',
+ index: (PREFIX_BUILD_INDEX != false) ? "prefix_index.html" : "index.html"
+ }
});
done();
}