gulpfile.js

'use strict';

//
// imports
//
var gulp = require('gulp');
var gutil = require('gulp-util');
var templateCache = require('gulp-angular-templatecache');
var fs = require('fs');
var glob = require('glob');
var path = require('path');
var _ = require('lodash');

//
// constants
//
var CONFIG_FILE = '../../config/patterns.json';
var COMMON_HEADER = 'AUTO-GENERATED BY GULP';
var COMMON_HEADER_JS = '/*** ' + COMMON_HEADER + ' ***/';
var COMMON_HEADER_HTML = '<!-- ' + COMMON_HEADER + ' -->';
var TEMPLATE_CACHE_HEADER = COMMON_HEADER_JS + '\n\n' + 'angular.module("lnPatterns").run(["$templateCache", function($templateCache) {';
var PATTERNS_TEMPLATE = 'templates/patterns/template';
var PATTERNS_TEMPLATE_PAGE = PATTERNS_TEMPLATE + '.html';
var EXAMPLES_TEMPLATE = 'templates/examples/template';
var EXAMPLES_TEMPLATE_PAGE = EXAMPLES_TEMPLATE + '.html';
var ENCODING = 'utf8';
var HEADER_REGEX = /\/\*\*\*.*\*\*\*\//;
var COMPONENT_REGEX = /{COMPONENT}[\s\S]*{END_COMPONENT}/m;
var EXAMPLE_REGEX = /{EXAMPLE}[\s\S]*{END_EXAMPLE}/m;
var CONTROLLER_REGEX = /{CONTROLLER}[\s\S]*{END_CONTROLLER}/m;
var ATOM_LINK_REGEX = /{ATOM_LINK}[\s\S]*{END_ATOM_LINK}/m;
var MOLECULE_LINK_REGEX = /{MOLECULE_LINK}[\s\S]*{END_MOLECULE_LINK}/m;
var ORGANISM_LINK_REGEX = /{ORGANISM_LINK}[\s\S]*{END_ORGANISM_LINK}/m;
var TEMPLATE_LINK_REGEX = /{TEMPLATE_LINK}[\s\S]*{END_TEMPLATE_LINK}/m;
var DEFAULT_PATTERNS_ROUTE = '#/patterns';
var DEFAULT_EXAMPLES_ROUTE = '#/examples';
var DEFAULT_EXAMPLES_BG_COLOR = '#FFFFFF';

//
// global variables
//
var appConfig = null;
var enabledTemplates = [];

//
// tasks
//
gulp.task('lnPatternsLoadConfig', function (cb) {
  //load application config file
  try {
    appConfig = require(CONFIG_FILE);
  }
  catch (e) {
    gutil.log('Application config file not found. All components will be included.');
  }

  cb();
});

gulp.task('lnPatternsComponents', ['lnPatternsLoadConfig'], function (cb) {
  var molecules = '';
  var organisms = '';
  var templates = '';
  var controllers = '';
  var patterns = '';
  var atomLinks = '';
  var moleculeLinks = '';
  var organismLinks = '';
  var templateLinks = '';
  var examplesPage = '';
  var count = 0;

  //read tpl files
  var componentsTpl = fs.readFileSync('./lib/ngComponents.tpl', ENCODING);
  componentsTpl = componentsTpl.replace(HEADER_REGEX, COMMON_HEADER_JS);

  var controllersTpl = fs.readFileSync('./lib/ngControllers.tpl', ENCODING);
  controllersTpl = controllersTpl.replace(HEADER_REGEX, COMMON_HEADER_JS);

  var patternsTpl = fs.readFileSync('./lib/' + PATTERNS_TEMPLATE + '.tpl', ENCODING);
  patternsTpl = patternsTpl.replace(HEADER_REGEX, COMMON_HEADER_HTML);

  var examplesPageTpl = fs.readFileSync('./lib/' + EXAMPLES_TEMPLATE + '.tpl', ENCODING);
  examplesPageTpl = examplesPageTpl.replace(HEADER_REGEX, COMMON_HEADER_HTML);

  //get component and example htmls and controller js from tpls
  var componentHtml = COMPONENT_REGEX.exec(patternsTpl)[0];
  componentHtml = componentHtml.replace('{COMPONENT}', '').replace('{END_COMPONENT}', '');

  var exampleHtml = EXAMPLE_REGEX.exec(componentHtml)[0];
  exampleHtml = exampleHtml.replace('{EXAMPLE}', '').replace('{END_EXAMPLE}', '');

  var controllerJs = CONTROLLER_REGEX.exec(controllersTpl)[0];
  controllerJs = controllerJs.replace('{CONTROLLER}', '').replace('{END_CONTROLLER}', '');

  var atomLinkTpl = ATOM_LINK_REGEX.exec(patternsTpl)[0];
  atomLinkTpl = atomLinkTpl.replace('{ATOM_LINK}', '').replace('{END_ATOM_LINK}', '');

  var moleculeLinkTpl = MOLECULE_LINK_REGEX.exec(patternsTpl)[0];
  moleculeLinkTpl = moleculeLinkTpl.replace('{MOLECULE_LINK}', '').replace('{END_MOLECULE_LINK}', '');

  var organismLinkTpl = ORGANISM_LINK_REGEX.exec(patternsTpl)[0];
  organismLinkTpl = organismLinkTpl.replace('{ORGANISM_LINK}', '').replace('{END_ORGANISM_LINK}', '');

  var templateLinkTpl = TEMPLATE_LINK_REGEX.exec(patternsTpl)[0];
  templateLinkTpl = templateLinkTpl.replace('{TEMPLATE_LINK}', '').replace('{END_TEMPLATE_LINK}', '');

  var exampleTpl = EXAMPLE_REGEX.exec(examplesPageTpl)[0];
  exampleTpl = exampleTpl.replace('{EXAMPLE}', '').replace('{END_EXAMPLE}', '');

  var include = function (file, collection, compCustom) {
    var splitted = file.split('/');
    var folder = splitted.slice(0, -1).join('/');
    var filename = splitted.pop().replace('.json', '').replace('.js', '');
    var compEnabled = true;
    var compConfig = null;
    var baseDir = './lib/';
    var compName = folder.replace(baseDir, '');
    var patternsRoute = DEFAULT_PATTERNS_ROUTE;

    //check if the component is enabled in the application config file
    if (appConfig) {
      if (compCustom) {
        baseDir = appConfig.customComponentsLocation;
        compName = folder.replace(baseDir, '');
      }

      if (_.has(appConfig, 'patternsRoute') && appConfig.patternsRoute != '') {
        patternsRoute = appConfig.patternsRoute;
      }

      if (!_.has(appConfig, 'enabledComponents')) {
        compEnabled = false;
      }
      else if (_.isArray(appConfig.enabledComponents)) {
        compConfig = _.find(appConfig.enabledComponents, {'component': compName, 'custom': compCustom});

        if (!compConfig) {
          compEnabled = false;
        }
      }
      else if (appConfig.enabledComponents != '*') {
        compEnabled = false;
      }
    }

    if (compEnabled && baseDir != '') {
      var linkTpl = '';

      //get component metadata
      var metadata = require(baseDir + compName + '/metadata.json');

      //include import string and link into the corresponding atomic type
      var reqStr = "require('./" + compName + "/" + filename + "');\n";

      if (collection == 'atoms') {
        linkTpl = atomLinkTpl;
      }
      else if (collection == 'molecules') {
        molecules += compCustom ? '' : reqStr;
        linkTpl = moleculeLinkTpl;
      }
      else if (collection == 'organisms') {
        organisms += compCustom ? '' : reqStr;
        linkTpl = organismLinkTpl;
      }
      else if (collection == 'templates') {
        templates += compCustom ? '' : reqStr;
        linkTpl = templateLinkTpl;
      }

      if (collection == 'atoms' || filename.indexOf('directive') >= 0 || filename.indexOf('component') >= 0) {
        count += 1;

        var componentId = 'component_' + count;

        var linkHtml = linkTpl
          .replace(/{PATTERNS_ROUTE}/g, patternsRoute)
          .replace(/{LINK_ID}/g, componentId)
          .replace(/{LINK_NAME}/g, metadata.name);

        if (collection == 'atoms') {
          atomLinks += linkHtml;
        }
        else if (collection == 'molecules') {
          moleculeLinks += linkHtml;
        }
        else if (collection == 'organisms') {
          organismLinks += linkHtml;
        }
        else if (collection == 'templates') {
          templateLinks += linkHtml;
        }

        //get component example instance html
        var exampleInstanceHtml = fs.readFileSync(baseDir + compName + '/example.html', ENCODING);

        //generate examples with instantiated parameters
        var examples = '';

        if (compConfig && _.has(compConfig, 'examples') && _.isArray(compConfig.examples)) {
          for (var i = 0; i < compConfig.examples.length; i++) {
            var exampleInstance = compConfig.examples[i];
            var exampleId = count + '_' + i;
            var controllerName = 'lnController_' + exampleId;
            var controllerAttrs = JSON.stringify(exampleInstance.params);
            var controllerAttrsPretty = JSON.stringify(exampleInstance.params, null, 2);

            examples += exampleHtml
              .replace(/{EXAMPLE_ID}/g, exampleId)
              .replace(/{EXAMPLE_NAME}/g, exampleInstance.name)
              .replace(/{EXAMPLE_PARAMS}/g, _.escape(controllerAttrsPretty));

            controllers += controllerJs
              .replace(/{CONTROLLER_NAME}/g, controllerName)
              .replace(/{CONTROLLER_ATTRIBUTES}/g, controllerAttrs)
              .replace(/{EXAMPLE_ID}/g, exampleId);

            examplesPage += exampleTpl
              .replace(/{EXAMPLE_CONTROLLER}/g, controllerName)
              .replace(/{EXAMPLE_INSTANCE}/g, exampleInstanceHtml);
          }
        }

        var examplesTitleDisplay = (examples == '') ? 'display: none;' : '';

        //instantiate component html and include into patterns tpl
        patterns += componentHtml
          .replace(/{COMPONENT_ID}/g, componentId)
          .replace(/{COMPONENT_NAME}/g, metadata.name)
          .replace(/{COMPONENT_DESCRIPTION}/g, metadata.description)
          .replace(/{COMPONENT_PARAMS}/g, JSON.stringify(metadata.params, null, 2))
          .replace(/{COMPONENT_EXAMPLE}/g, _.escape(exampleInstanceHtml))
          .replace(/{EXAMPLES_TITLE_DISPLAY}/g, examplesTitleDisplay)
          .replace(EXAMPLE_REGEX, examples);

        if (collection != 'atoms' && !compCustom) {
          //add component path to the enabled templates list
          enabledTemplates.push(baseDir + compName + '/template.html');
        }
      }
    }
  };

  var customSearch = false;

  var includeAtom = function(file) {
    include(file, 'atoms', customSearch);
  };

  var includeMolecule = function(file) {
    include(file, 'molecules', customSearch);
  };

  var includeOrganism = function(file) {
    include(file, 'organisms', customSearch);
  };

  var includeTemplate = function(file) {
    include(file, 'templates', customSearch);
  };

  glob.sync('./lib/atoms/**/metadata.json').forEach(includeAtom);
  glob.sync('./lib/molecules/**/*.js').forEach(includeMolecule);
  glob.sync('./lib/organisms/**/*.js').forEach(includeOrganism);
  glob.sync('./lib/templates/**/*.js').forEach(includeTemplate);

  if (appConfig && appConfig.customComponentsLocation != '') {
    customSearch = true;

    glob.sync(appConfig.customComponentsLocation + '/atoms/**/metadata.json').forEach(includeAtom);
    glob.sync(appConfig.customComponentsLocation + '/molecules/**/*.js').forEach(includeMolecule);
    glob.sync(appConfig.customComponentsLocation + '/organisms/**/*.js').forEach(includeOrganism);
    glob.sync(appConfig.customComponentsLocation + '/templates/**/*.js').forEach(includeTemplate);
  }

  //instantiate components imports and generate ngComponents.js
  componentsTpl = componentsTpl
    .replace('{MOLECULES}', molecules)
    .replace('{ORGANISMS}', organisms)
    .replace('{TEMPLATES}', templates);

  fs.writeFileSync('./lib/ngComponents.js', componentsTpl);

  //generate controllers, patterns and examples pages
  var templatesFilePath = './lib/' + PATTERNS_TEMPLATE_PAGE;
  var examplesFilePath = './lib/' + EXAMPLES_TEMPLATE_PAGE;

  if (!appConfig || appConfig.generatePatternsPage) {
    enabledTemplates.push(templatesFilePath);
    enabledTemplates.push(examplesFilePath);

    //instantiate patterns and generate patterns page
    patternsTpl = patternsTpl
      .replace(ATOM_LINK_REGEX, atomLinks)
      .replace(MOLECULE_LINK_REGEX, moleculeLinks)
      .replace(ORGANISM_LINK_REGEX, organismLinks)
      .replace(TEMPLATE_LINK_REGEX, templateLinks)
      .replace(COMPONENT_REGEX, patterns);

    fs.writeFileSync(templatesFilePath, patternsTpl);

    //instantiate examples and generate examples page
    examplesPageTpl = examplesPageTpl.replace(EXAMPLE_REGEX, examplesPage);
    fs.writeFileSync(examplesFilePath, examplesPageTpl);
  }
  else {
    //delete patterns page if exists
    try {
      fs.unlinkSync(templatesFilePath);
      fs.unlinkSync(examplesFilePath);
    } catch (e) {}

    //clean controllers
    controllers = '';
  }

  //instantiate controllers and generate ngControllers.js
  var examplesRoute = (appConfig && appConfig.examplesRoute) ? appConfig.examplesRoute : DEFAULT_EXAMPLES_ROUTE;
  var examplesBgColor = (appConfig && appConfig.examplesBackgroundColor) ? appConfig.examplesBackgroundColor : DEFAULT_EXAMPLES_BG_COLOR;

  controllersTpl = controllersTpl
    .replace(/{EXAMPLES_ROUTE}/g, examplesRoute)
    .replace(/{EXAMPLES_BG_COLOR}/g, examplesBgColor)
    .replace(CONTROLLER_REGEX, controllers);

  fs.writeFileSync('./lib/ngControllers.js', controllersTpl);

  cb();
});

gulp.task('lnPatternsTemplates', ['lnPatternsComponents'], function () {
  return gulp.src(enabledTemplates, {base: path.resolve(__dirname + '/lib/')})
    //generate templates cache into ngTemplates.js
    .pipe(templateCache('ngTemplates.js', {
      transformUrl: function (url) {
        if (url.indexOf(PATTERNS_TEMPLATE_PAGE) >= 0) {
          return PATTERNS_TEMPLATE_PAGE;
        }
        else if (url.indexOf(EXAMPLES_TEMPLATE_PAGE) >= 0) {
          return EXAMPLES_TEMPLATE_PAGE;
        }
        else {
          return 'lnPatterns' + url;
        }
      },
      templateHeader: TEMPLATE_CACHE_HEADER
    }))
    //write ngTemplates.js into lib folder
    .pipe(gulp.dest('./lib'));
});

gulp.task('lnPatterns', ['lnPatternsTemplates']);