gulpfile.js

   1 'use strict';
   2
   3 // modules
   4 var browserSync = require('browser-sync');
   5 var csso = require('gulp-csso');
   6 var del = require('del');
   7 var fs = require('fs');
   8 var glob = require('glob');
   9 var gap = require('gulp-append-prepend');
  10 var replace = require('replace-in-file');
  11 var gulp = require('gulp');
  12 var argv = require('minimist')(process.argv.slice(2));
  13 var gulpif = require('gulp-if');
  14 var prefix = require('gulp-autoprefixer');
  15 var reload = browserSync.reload;
  16 var rename = require('gulp-rename');
  17 var runSequence = require('run-sequence');
  18 var sass = require('gulp-sass');
  19 var sourcemaps = require('gulp-sourcemaps');
  20 var watch = require('gulp-watch');
  21
  22
  23 var packages = require('./package.json');
  24
  25 // configuration
  26 var config = {
  27     all : [], // must always be empty
  28
  29     /* Command Line Arguments */
  30     dev: argv['dev'],
  31     build: argv['b'],
  32     syncOnly: argv['sync-only'],
  33     proxy: argv['p'],
  34     install: argv['i'],
  35
  36     /* Source file locations */
  37     src: {
  38         styles: {
  39             style_uni: 'interface/themes/style_*.scss',
  40             style_color: 'interface/themes/colors/*.scss',
  41             rtl: 'interface/themes/rtl.scss',
  42             directional: 'interface/themes/directional.scss',
  43             all: 'public/themes/**/*style_*.css',
  44         }
  45     },
  46     dist: {
  47         assets: './public/assets/', // vendor assets dir
  48         fonts: './public/fonts/',
  49         storybook: '.docs/.out/'
  50     },
  51     dest: {
  52         themes: 'public/themes'
  53     }
  54 };
  55
  56 /**
  57  * Clean up lingering static assets
  58  */
  59 gulp.task('clean', function () {
  60     if (config.dev) {
  61         let ignore = "!" + config.dist.storybook + '.gitignore';
  62         del.sync([config.dist.storybook + "*", ignore]);
  63     }
  64
  65     return del.sync([config.dest.themes + "/*"]);
  66 });
  67
  68
  69 /**
  70  * Parses command line arguments
  71  */
  72 gulp.task('ingest', function() {
  73     if (config.dev && typeof config.dev !== "boolean") {
  74         // allows for custom proxy to be passed into script
  75         config.proxy = config.dev;
  76         config.dev = true;
  77     }
  78 });
  79
  80
  81 /**
  82  * Will start browser sync and/or watch changes to scss
  83  * - Runs task(styles) first
  84  * - Includes hack to dump fontawesome to the storybook dist
  85  */
  86 gulp.task('sync', ['ingest', 'styles'], function() {
  87     if (config.proxy) {
  88         browserSync.init({
  89             proxy: "127.0.0.1:" + config.proxy
  90         });
  91     }
  92
  93     if (config.dev) {
  94         // if building storybook, grab the public folder
  95         gulp.src(['./public/**/*'], {"base" : "."})
  96             .pipe(gulp.dest(config.dist.storybook));
  97     }
  98     // copy all leftover root-level components to the theme directory
  99     // hoping this is only temporary
 100     gulp.src(['interface/themes/*.{css,php}'])
 101         .pipe(gulp.dest(config.dest.themes));
 102 });
 103
 104 // definition of header for all compiled css
 105 var autoGeneratedHeader = `
 106 /*! This style sheet was autogenerated using gulp + scss
 107  *  For usage instructions, see: https://github.com/openemr/openemr/blob/master/interface/README.md
 108  */
 109 `;
 110
 111
 112 // START style task definitions
 113
 114 /**
 115  * universal css compilcation
 116  */
 117 gulp.task('styles:style_uni', function () {
 118     return gulp.src(config.src.styles.style_uni)
 119         .pipe(sourcemaps.init())
 120         .pipe(sass().on('error', sass.logError))
 121         .pipe(prefix('last 1 version'))
 122         .pipe(gap.prependText(autoGeneratedHeader))
 123         .pipe(gulpif(!config.dev, csso()))
 124         .pipe(gulpif(!config.dev,sourcemaps.write()))
 125         .pipe(gulp.dest(config.dest.themes))
 126         .pipe(gulpif(config.dev && config.build, gulp.dest(config.dist.storybook + config.dest.themes)))
 127         .pipe(gulpif(config.dev, reload({stream:true})));
 128 });
 129
 130 gulp.task('rtl:style_uni', function() {
 131     return gulp.src(config.src.styles.style_uni)
 132         .pipe(gap.prependText('@import "./rtl.scss";\n')) // watch out for this relative path!
 133         .pipe(sourcemaps.init())
 134         .pipe(sass().on('error', sass.logError))
 135         .pipe(prefix('last 1 version'))
 136         .pipe(gap.prependText(autoGeneratedHeader))
 137         .pipe(gulpif(!config.dev, csso()))
 138         .pipe(gulpif(!config.dev,sourcemaps.write()))
 139         .pipe(rename({ prefix: "rtl_"}))
 140         .pipe(gulp.dest(config.dest.themes))
 141         .pipe(gulpif(config.dev && config.build, gulp.dest(config.dist.storybook + config.dest.themes)))
 142         .pipe(gulpif(config.dev, reload({stream:true})));
 143 })
 144
 145 /**
 146  * color compilation for colored themes
 147  */
 148 gulp.task('styles:style_color', function () {
 149     return gulp.src(config.src.styles.style_color)
 150         .pipe(sourcemaps.init())
 151         .pipe(sass().on('error', sass.logError))
 152         .pipe(prefix('last 1 version'))
 153         .pipe(gap.prependText(autoGeneratedHeader))
 154         .pipe(gulpif(!config.dev, csso()))
 155         .pipe(gulpif(!config.dev,sourcemaps.write()))
 156         .pipe(gulp.dest(config.dest.themes))
 157         .pipe(gulpif(config.dev && config.build, gulp.dest(config.dist.storybook + config.dest.themes)))
 158         .pipe(gulpif(config.dev, reload({stream:true})));
 159 });
 160
 161 gulp.task('rtl:style_color', function() {
 162     return gulp.src(config.src.styles.style_color)
 163         .pipe(gap.prependText('@import "../rtl.scss";\n')) // watch out for this relative path!
 164         .pipe(sourcemaps.init())
 165         .pipe(sass().on('error', sass.logError))
 166         .pipe(prefix('last 1 version'))
 167         .pipe(gap.prependText(autoGeneratedHeader))
 168         .pipe(gulpif(!config.dev, csso()))
 169         .pipe(gulpif(!config.dev,sourcemaps.write()))
 170         .pipe(rename({ prefix: "rtl_"}))
 171         .pipe(gulp.dest(config.dest.themes))
 172         .pipe(gulpif(config.dev && config.build, gulp.dest(config.dist.storybook + config.dest.themes)))
 173         .pipe(gulpif(config.dev, reload({stream:true})));
 174 })
 175
 176 gulp.task('styles', ['styles:style_uni', 'styles:style_color']);
 177
 178 gulp.task('rtl_styles', ['rtl:style_uni', 'rtl:style_color']);
 179
 180 /**
 181  * append rtl css to all style themes
 182  * also, create list of all themes for style_list to use
 183  */
 184 gulp.task('rtl:setup', function(callback) {
 185     var uni = glob.sync(config.src.styles.style_uni);
 186     var colors = glob.sync(config.src.styles.style_color);
 187     config.all = uni.concat(colors);
 188
 189     // backup and update directional file
 190     fs.copyFile(config.src.styles.directional, config.src.styles.directional + '.temp', (err) => {
 191         if (err) throw err;
 192         replace({
 193             files: config.src.styles.directional,
 194             from: /ltr \!default/g,
 195             to: 'rtl !default',
 196         }).then(callback());
 197     });
 198 });
 199
 200 gulp.task('rtl:teardown', function(callback) {
 201     replace({
 202         files: config.src.styles.directional,
 203         from: /rtl \!default/g,
 204         to: 'ltr !default',
 205     }).then(function () {
 206         fs.unlink(config.src.styles.directional + '.temp', (err) => {
 207             if (err) throw err;
 208             callback();
 209         });
 210     });
 211 })
 212
 213 // END style task definitions
 214
 215 /*
 216 * Create a JSON for storybook to use
 217 */
 218 gulp.task('style_list', function () {
 219     if (config.dev) {
 220         var style_list = [];
 221         for (var i=0; i<config.all.length; i++) {
 222             var theme_name = "style_" + config.all[i].split('style_')[1].slice(0,-5);
 223             style_list.push(theme_name);
 224             style_list.push('rtl_' + theme_name);
 225         }
 226         fs.writeFileSync('.storybook/themeOptions.json', JSON.stringify(style_list), 'utf8');
 227     }
 228 });
 229
 230
 231 /**
 232  * Copies node_modules to ./public
 233  */
 234 gulp.task('install', function() {
 235
 236     // combine dependencies and napa sources into one object
 237     var dependencies = packages.dependencies;
 238     for (var key in packages.napa) {
 239         if (packages.napa.hasOwnProperty(key)) {
 240             dependencies[key] = packages.napa[key];
 241         }
 242     }
 243
 244     for (var key in dependencies) {
 245         // check if the property/key is defined in the object itself, not in parent
 246         if (dependencies.hasOwnProperty(key)) {
 247             // only copy dist directory, if it exists
 248             // skip this if for dwv dependency
 249             if (key != 'dwv' && fs.existsSync('node_modules/' + key + '/dist')) {
 250                 gulp.src('node_modules/' + key + '/dist/**/*')
 251                     .pipe(gulp.dest(config.dist.assets + key + '/dist'));
 252             } else {
 253                 gulp.src('node_modules/' + key + '/**/*')
 254                     .pipe(gulp.dest(config.dist.assets + key));
 255             }
 256         }
 257     }
 258 });
 259
 260 gulp.task('watch', function() {
 261     // watch all changes and re-run styles
 262     gulp.watch('./interface/**/*.scss', {interval: 1000, mode: 'poll'}, ['styles']);
 263
 264     // watch all changes to css/php files in themes and copy to public
 265     return watch('./interface/themes/*.{css,php}', { ignoreInitial: false })
 266         .pipe(gulp.dest(config.dest.themes));
 267 });
 268
 269 gulp.task('sync-only', function () {
 270     browserSync.init({
 271         proxy: "127.0.0.1:" + config.proxy,
 272         open: false
 273     });
 274 })
 275
 276  /**
 277  * Default config
 278  * - runs by default when `gulp` is called from CLI
 279  */
 280 if (config.install) {
 281     gulp.task('default', [ 'install' ]);
 282 } else if (config.syncOnly && config.proxy) {
 283     gulp.task('default', ['sync-only', 'watch']);
 284 } else {
 285     gulp.task('default', function (callback) {
 286         runSequence('clean', ['sync'], 'rtl:setup', 'rtl_styles', 'rtl:teardown', 'style_list', callback);
 287     });
 288 }
 289