Merge cd0823d into e7eb7a9

conf/gulp-tasks/bundle/bundle.js

@@ -15,9 +15,10 @@ const {
 const TranslateCallParser = require('../../i18n/translatecallparser');
 
 /**
- * The Gulp task for producing the modern version of the SDK bundle.
+ * The Gulp task for producing the modern bundle of an SDK asset.
  *
  * @param {Function} callback
+ * @param {string} entryPoint The entry point for the asset.
  * @param {Object<string, ?>} outputConfig Any variant-specific configuration
  *                                         for the modern bundle.
  * @param {string} bundleName The name of the created bundle.
@@ -28,9 +29,17 @@ const TranslateCallParser = require('../../i18n/translatecallparser');
  * @returns {stream.Writable} A {@link Writable} stream containing the modern
  *                            SDK bundle.
  */
-exports.modernBundle = function (callback, outputConfig, bundleName, locale, libVersion, translationResolver) {
+exports.modernBundle = function (
+  callback,
+  entryPoint,
+  outputConfig, 
+  bundleName, 
+  locale, 
+  libVersion, 
+  translationResolver) 
+{
   const rollupConfig = {
-    input: './src/answers-umd.js',
+    input: entryPoint,
     output: outputConfig,
     plugins: [
       resolve({ browser: true }),
@@ -49,9 +58,10 @@ exports.modernBundle = function (callback, outputConfig, bundleName, locale, lib
 };
 
 /**
- * The Gulp task for producing either variant of the legacy SDK bundle.
+ * The Gulp task for producing any variant of a legacy SDK asset.
  *
  * @param {Function} callback
+ * @param {string} entryPoint The entry point for the asset.
  * @param {Object<string, ?>} outputConfig Any variant-specific configuration
  *                                         for the legacy bundle.
  * @param {string} bundleName The name of the created bundle.
@@ -61,9 +71,17 @@ exports.modernBundle = function (callback, outputConfig, bundleName, locale, lib
  * @returns {stream.Writable} A {@link Writable} stream containing the legacy
  *                            SDK bundle.
  */
-exports.legacyBundle = function (callback, outputConfig, bundleName, locale, libVersion, translationResolver) {
+exports.legacyBundle = function (
+  callback,
+  entryPoint,
+  outputConfig, 
+  bundleName, 
+  locale, 
+  libVersion,
+  translationResolver) 
+{
   const rollupConfig = {
-    input: './src/answers-umd.js',
+    input: entryPoint,
     output: outputConfig,
     plugins: [
       resolve({ browser: true }),

conf/gulp-tasks/bundle/bundletaskfactory.js

@@ -5,7 +5,10 @@ const { modernBundle, legacyBundle } = require('./bundle');
 const BundleType = {
   MODERN: 'answers-modern',
   LEGACY_IIFE: 'answers',
-  LEGACY_UMD: 'answers-umd'
+  LEGACY_UMD: 'answers-umd',
+  SEARCH_BAR_MODERN: 'answers-search-bar-modern',
+  SEARCH_BAR_LEGACY_IIFE: 'answers-search-bar',
+  SEARCH_BAR_LEGACY_UMD: 'answers-search-bar-umd'
 };
 Object.freeze(BundleType);
 
@@ -17,7 +20,6 @@ class BundleTaskFactory {
     this._libVersion = libVersion;
     this._locale = locale;
     this._translationResolver = translationResolver;
-    this._namespace = 'ANSWERS';
   }
 
   /**
@@ -28,90 +30,117 @@ class BundleTaskFactory {
    */
   create (bundleType) {
     let bundleFunction;
-    switch (bundleType) {
-      case BundleType.MODERN:
-        bundleFunction = (callback) => this._modernBundle(callback);
-        break;
-      case BundleType.LEGACY_IIFE:
-        bundleFunction = (callback) => this._legacyBundleIIFE(callback);
-        break;
-      case BundleType.LEGACY_UMD:
-        bundleFunction = (callback) => this._legacyBundleUMD(callback);
-        break;
-      default:
-        throw new Error('Unrecognized BundleType');
+
+    const modernBundleTypes = [BundleType.MODERN, BundleType.SEARCH_BAR_MODERN];
+    const iifeBundleTypes = [BundleType.LEGACY_IIFE, BundleType.SEARCH_BAR_LEGACY_IIFE];
+    const umdBundleTypes = [BundleType.LEGACY_UMD, BundleType.SEARCH_BAR_LEGACY_UMD];
+
+    if (modernBundleTypes.includes(bundleType)) {
+      bundleFunction = (callback) => this._modernBundle(callback, bundleType);
+    } else if (iifeBundleTypes.includes(bundleType)) {
+      bundleFunction = (callback) => this._legacyBundleIIFE(callback, bundleType);
+    } else if (umdBundleTypes.includes(bundleType)) {
+      bundleFunction = (callback) => this._legacyBundleUMD(callback, bundleType);
+    } else {
+      throw new Error('Unrecognized BundleType');
     }
+
     Object.defineProperty(bundleFunction, 'name', {
       value: `bundle ${getBundleName(bundleType, this._locale)}`
     });
     return bundleFunction;
   }
 
   /**
-   * The Gulp task for producing the modern version of the SDK bundle.
+   * The Gulp task for producing the modern bundle of an SDK asset. Moden implies
+   * the use of ES6 syntax and a lack of polyfills.
    *
-   * @param {function} callback function that will run after the Gulp task
-   * @returns {stream.Writable} A {@link Writable} stream containing the modern
-   *                            SDK bundle.
+   * @param {function} callback Function that will run after the Gulp task
+   * @param {BundleType} bundleType The type of SDK asset to generate the bundle for.
+   * @returns {stream.Writable} A {@link Writable} stream containing the modern,
+   *                            bundled asset.
    */
-  _modernBundle (callback) {
+  _modernBundle (callback, bundleType) {
+    let entryPoint = './src/answers-umd.js';
+
+    if (bundleType === BundleType.SEARCH_BAR_MODERN) {
+      entryPoint = './src/answers-search-bar.js';
+    }
+
     const modernBundleConfig = {
       format: 'umd',
-      name: this._namespace,
+      name: 'ANSWERS',
       exports: 'default',
       sourcemap: true
     };
     return modernBundle(
       callback,
+      entryPoint,
       modernBundleConfig,
-      getBundleName(BundleType.MODERN, this._locale),
+      getBundleName(bundleType, this._locale),
       this._locale,
       this._libVersion,
       this._translationResolver
     );
   }
 
   /**
-   * The Gulp task for producing the legacy, IIFE-style SDK bundle.
+   * The Gulp task for producing a legacy, IIFE-style bundle of an SDK asset.
    *
    * @param {function} callback function that will run after the Gulp task
+   * @param {BundleType} bundleType The type of SDK asset to generate the bundle for.
    * @returns {stream.Writable} A {@link Writable} stream containing the legacy,
    *                            IIFE-style SDK bundle.
    */
-  _legacyBundleIIFE (callback) {
+  _legacyBundleIIFE (callback, bundleType) {
+    let entryPoint = './src/answers-umd.js';
+
+    if (bundleType === BundleType.SEARCH_BAR_LEGACY_IIFE) {
+      entryPoint = './src/answers-search-bar.js';
+    }
+
     const legacyBundleConfig = {
       format: 'iife',
-      name: this._namespace,
+      name: 'ANSWERS',
       sourcemap: true
     };
     return legacyBundle(
       callback,
+      entryPoint,
       legacyBundleConfig,
-      getBundleName(BundleType.LEGACY_IIFE, this._locale),
+      getBundleName(bundleType, this._locale),
       this._locale,
       this._libVersion,
       this._translationResolver
     );
   }
 
   /**
-   * The Gulp task for producing the legacy, UMD-style SDK bundle.
+   * The Gulp task for producing the legacy, UMD-style bundle of an SDK asset.
    *
    * @param {function} callback function that will run after the Gulp task
+   * @param {BundleType} bundleType The type of SDK asset to generate the bundle for.
    * @returns {stream.Writable} A {@link Writable} stream containing the legacy,
    *                            UMD-style SDK bundle.
    */
-  _legacyBundleUMD (callback) {
+  _legacyBundleUMD (callback, bundleType) {
+    let entryPoint = './src/answers-umd.js';
+
+    if (bundleType === BundleType.SEARCH_BAR_LEGACY_UMD) {
+      entryPoint = './src/answers-search-bar.js';
+    }
+
     const legacyBundleConfig = {
       format: 'umd',
-      name: this._namespace,
+      name: 'ANSWERS',
       export: 'default',
       sourcemap: true
     };
     return legacyBundle(
       callback,
+      entryPoint,
       legacyBundleConfig,
-      getBundleName(BundleType.LEGACY_UMD, this._locale),
+      getBundleName(bundleType, this._locale),
       this._locale,
       this._libVersion,
       this._translationResolver

conf/gulp-tasks/library.gulpfile.js

@@ -63,6 +63,12 @@ exports.buildLocales = function allLocaleJSBundles () {
     'answers.min.js',
     'answers-modern.js',
     'answers-modern.min.js',
+    'answers-search-bar.js',
+    'answers-search-bar.min.js',
+    'answers-search-bar-umd.js',
+    'answers-search-bar-umd.min.js',
+    'answers-search-bar-modern.js',
+    'answers-search-bar-modern.min.js',
     'answers-umd.js',
     'answers-umd.min.js'];
 
@@ -90,6 +96,18 @@ function createBundles (bundleTaskFactory, minifyTaskFactory) {
     series(
       bundleTaskFactory.create(BundleType.LEGACY_UMD),
       minifyTaskFactory.minify(BundleType.LEGACY_UMD)
+    ),
+    series(
+      bundleTaskFactory.create(BundleType.SEARCH_BAR_MODERN),
+      minifyTaskFactory.minify(BundleType.SEARCH_BAR_MODERN)
+    ),
+    series(
+      bundleTaskFactory.create(BundleType.SEARCH_BAR_LEGACY_IIFE),
+      minifyTaskFactory.minify(BundleType.SEARCH_BAR_LEGACY_IIFE)
+    ),
+    series(
+      bundleTaskFactory.create(BundleType.SEARCH_BAR_LEGACY_UMD),
+      minifyTaskFactory.minify(BundleType.SEARCH_BAR_LEGACY_UMD)
     )
   );
 }

conf/gulp-tasks/template/bundletemplatestaskfactory.js

@@ -43,7 +43,8 @@ class BundleTemplatesTaskFactory {
   _createBundleFunction (templateType) {
     const bundleConfig = this._getOutputConfig(templateType);
     const outputFile = getFileName(templateType, this._locale);
-    const precompiledFile = getPrecompiledFileName(this._locale);
+    const precompiledFile =
+      getPrecompiledFileName(this._locale, templateType === TemplateType.SEARCH_BAR_UMD);
     return callback =>
       this._bundleTemplates(callback, bundleConfig, precompiledFile, outputFile);
   }
@@ -66,6 +67,9 @@ class BundleTemplatesTaskFactory {
         name: 'TemplateBundle'
       }
     };
+    typeToConfig[TemplateType.SEARCH_BAR_UMD] = typeToConfig[TemplateType.UMD];
+    typeToConfig[TemplateType.SEARCH_BAR_IIFE] = typeToConfig[TemplateType.IIFE];
+
     return typeToConfig[templateType];
   }
 
@@ -78,7 +82,9 @@ class BundleTemplatesTaskFactory {
   _getTaskName (templateType) {
     const typeToTaskName = {
       [TemplateType.UMD]: 'bundleTemplatesUMD',
-      [TemplateType.IIFE]: 'bundleTemplatesIIFE'
+      [TemplateType.SEARCH_BAR_UMD]: 'bundleSearchTemplatesUMD',
+      [TemplateType.IIFE]: 'bundleTemplatesIIFE',
+      [TemplateType.SEARCH_BAR_IIFE]: 'bundleSearchTemplatesIIFE'
     };
     const taskName = typeToTaskName[templateType];
     return addLocalePrefix(taskName, this._locale);

conf/gulp-tasks/template/createcleanfiles.js

@@ -26,8 +26,11 @@ function createCleanFilesTask (locale) {
  * @param {string} locale
  */
 function _cleanFiles (callback, locale) {
-  const precompiledFile = getPrecompiledFileName(locale);
-  del.sync([`./dist/${precompiledFile}`]);
+  const precompiledFiles =
+    [ getPrecompiledFileName(locale), getPrecompiledFileName(locale, true) ];
+  precompiledFiles.forEach(file => {
+    del.sync([ `./dist/${file}` ]);
+  });
   callback();
 }
 

conf/gulp-tasks/template/createprecompiletemplates.js

@@ -3,6 +3,7 @@ const handlebars = require('gulp-handlebars');
 const concat = require('gulp-concat');
 const declare = require('gulp-declare');
 const wrap = require('gulp-wrap');
+const filter = require('gulp-filter');
 
 const TranslateHelperVisitor = require('../../i18n/translatehelpervisitor');
 const { addLocalePrefix, getPrecompiledFileName } = require('./filenameutils');
@@ -11,11 +12,14 @@ const { addLocalePrefix, getPrecompiledFileName } = require('./filenameutils');
  * Creates the precompileTemplates task for a given locale and translator.
  *
  * @param {string} locale
+ * @param {boolean} isSearchBarOnly If only templates related to the SearchBar
+ *                                  should be included.
  * @param {Translator} translator
  * @returns {Function}
  */
-function createPrecompileTemplatesTask (locale, translator) {
-  const precompileTask = callback => _precompileTemplates(callback, locale, translator);
+function createPrecompileTemplatesTask (locale, isSearchBarOnly, translator) {
+  const precompileTask = callback =>
+    _precompileTemplates(callback, locale, isSearchBarOnly, translator);
   const taskName = addLocalePrefix('precompileTemplates', locale);
   Object.defineProperty(precompileTask, 'name', {
     value: taskName
@@ -28,25 +32,49 @@ function createPrecompileTemplatesTask (locale, translator) {
  *
  * @param {Function} callback called when the task is finished
  * @param {string} locale
+ * @param {boolean} isSearchBarOnly If only the templates related to the SearchBar
+ *                                  should be included.
  * @param {Translator} translator
  * @returns {stream.Readable}
  */
-function _precompileTemplates (callback, locale, translator) {
-  const precompiledFileName = getPrecompiledFileName(locale);
+function _precompileTemplates (callback, locale, isSearchBarOnly, translator) {
+  const precompiledFileName = getPrecompiledFileName(locale, isSearchBarOnly);
   const processAST = ast => new TranslateHelperVisitor(translator).accept(ast);
-  return precompileTemplates(callback, precompiledFileName, processAST);
+
+  return precompileTemplates(
+    callback, isSearchBarOnly, precompiledFileName, processAST);
 }
 
 /**
- * Precopmiles SDK templates to the given output file.
+ * Precopmiles the requested templates to the given output file.
  *
  * @param {Function} callback called when the task is finished
+ * @param {boolean} isSearchBarOnly A boolean indicating if only those templates for
+ *                                  the search-bar integration should be included.
  * @param {string} outputFile
  * @param {Function} processAST a function that takes in and mutates a handlebars AST
  * @returns {stream.Readable}
  */
-function precompileTemplates (callback, outputFile, processAST) {
-  return src('./src/ui/templates/**/*.hbs')
+function precompileTemplates (callback, isSearchBarOnly, outputFile, processAST) {
+  let templatesStream = src('./src/ui/templates/**/*.hbs');
+  let handlebarsWrapperData;
+
+  if (isSearchBarOnly) {
+    templatesStream =
+      templatesStream.pipe(filter(['**/search/**/*.hbs', '**/icons/**/*.hbs']));
+    handlebarsWrapperData = {
+      importStatements: "import Handlebars from 'handlebars/dist/handlebars.runtime.min.js';"
+    };
+  } else {
+    handlebarsWrapperData = {
+      importStatements: `import Handlebars from 'handlebars/dist/handlebars.min.js';\n` +
+                        `import templateHelpers from 'template-helpers';`,
+      handlebarsHelpers: `let handlebarsHelpers = templateHelpers();\n` +
+                         `parseHelper(handlebarsHelpers);`
+    };
+  }
+
+  return templatesStream
     .pipe(handlebars({ processAST: processAST }))
     .pipe(wrap(`Handlebars.template(<%= contents %>);
         Handlebars.registerPartial(<%= processPartialName(file.relative) %>, <%= customContext(file.relative) %> )`, {}, {
@@ -83,7 +111,8 @@ function precompileTemplates (callback, outputFile, processAST) {
       }
     }))
     .pipe(concat(outputFile))
-    .pipe(wrap({ src: './conf/templates/handlebarswrapper.txt' }))
+    .pipe(wrap(
+      { src: './conf/templates/handlebarswrapper.txt' }, handlebarsWrapperData, { variable: 'data' }))
     .pipe(dest('dist'))
     .on('end', callback);
 }