mod-build 3.6.21--beta.2 → 3.6.21--a11y.beta.5

package/gulp-tasks/build.js

@@ -10,7 +10,7 @@ module.exports = function(gulp, gulpPlugins, siteSettings, siteData) {
 			if (siteData.isQSPage) {
 				sequenceOpts = ['clean', 'grab-cdn', 'grab-shared-components', 'grab-shared-scripts', 'templates', 'styles', 'grab-theme-json', 'combine-files', 'grab-images', 'copy-json', 'js-lint', 'html-min', 'css-min', 'js-min', 'img-min', 'extras', 'brand', 'copy-files-to-build-path', 'cache-bust', 'grab-tooltips-json', 'build-stat'];
 			} else {
-				sequenceOpts = ['clean', 'grab-cdn', 'grab-shared-components', 'grab-shared-scripts', 'templates', 'styles', 'combine-files', 'grab-images', 'js-lint', 'html-min', 'css-min', 'js-min', 'img-min', 'extras', 'brand', 'cache-bust', 'grab-tooltips-json', 'build-stat'];
+				sequenceOpts = ['clean', 'grab-cdn', 'grab-shared-components', 'grab-shared-scripts', 'templates', 'styles', 'combine-files', 'grab-images', 'js-lint', 'html-min','grab-global-images', 'css-min', 'js-min', 'img-min', 'extras', 'brand', 'cache-bust', 'grab-tooltips-json', 'build-stat'];
 			}
 		} else {
 			sequenceOpts = ['clean', 'grab-cdn', 'grab-shared-components', 'grab-shared-scripts', 'templates', 'styles', 'js-lint', 'html-min', 'css-min', 'js-min', 'img-min', 'extras', 'brand', 'cache-bust', 'build-stat'];

package/gulp-tasks/grab-global-images.js

@@ -0,0 +1,102 @@
+var fs = require('fs');
+var request = require('request');
+var source = require('vinyl-source-stream');
+var replace = require('gulp-replace');
+
+var images = [];
+
+function streamToDestination(gulp, siteSettings, url, fileName) {
+	var finalDestination;
+
+	if (!fs.existsSync(siteSettings.distFolder)) {
+		finalDestination = siteSettings.srcFolder;
+	} else {
+		finalDestination = siteSettings.distFolder;
+	}
+
+	return new Promise(resolve => { // eslint-disable-line no-undef
+		request(url)
+			.on('response', resp => {
+				if (resp.statusCode !== 200 && resp.statusCode !== 206) {
+					throw new Error(`${resp.statusCode} Error while fetching ${fileName}`);
+				} else {
+					images.push(fileName);
+				}
+			})
+			.pipe(source(fileName))
+			.pipe(gulp.dest(`${finalDestination}/resources/images/`))
+			.on('finish', resolve);
+	});
+}
+
+function replaceImagePath(gulp, siteSettings) {
+  var finalDestination;
+
+	if (!fs.existsSync(siteSettings.distFolder)) {
+		finalDestination = siteSettings.tmpFolder;
+	} else {
+		finalDestination = siteSettings.distFolder;
+  }
+
+  var stream = gulp.src(`${finalDestination}/index.html`);
+
+	if (images.length) {
+		images.forEach(function(image) {
+			stream = stream.pipe(replace(new RegExp(`"(?:(?!"|")[\\s\\S])+(${image})"`, 'gm'), '"/resources/images/' + image + '"'))
+		});
+	}
+	return stream.pipe(gulp.dest(finalDestination))
+}
+
+const getTags = (string) => {
+	const regExs = [/<img.*?src="(.*?)"[^\>]+>/g, /<use.*?href="(.*?)".*?>/g, /<source.*?srcset="(.*?)".*?>/g, /url\('#{\$path}.*?'\)/g];
+	let tags = [];
+
+	regExs.forEach((regEx) => {
+		const match = string.match(regEx);
+
+		if (match) {
+			tags = [...tags, ...match];
+		}
+	});
+
+	return tags;
+};
+
+const getUrls = (tags) => {
+	const urls = [];
+
+	tags.forEach((tag) => {
+		if (tag) {
+			let url = tag;
+			url = url.match(/(https?:\/\/[^\s]+)/gim);
+			if (url) {
+				url = url[0];
+				url = url.replace(/"/g, "")
+				urls.push(url)
+			}
+		}
+	});
+
+	return [...new Set(urls)]; // eslint-disable-line no-undef
+};
+
+const parseImageSources = (gulp, siteSettings) => {
+	const text = fs.readFileSync(`${siteSettings.tmpFolder}/index.html`, 'utf8');
+	const textMatches = getTags(text);
+	return getUrls(textMatches);
+};
+
+module.exports = function(gulp, siteSettings, siteData) {
+	return async function() {
+		const urls = parseImageSources(gulp, siteSettings);
+		const urlsPromises = urls.map(async(url) => {
+			const fileName = await url.slice(url.lastIndexOf('/') + 1);
+			return await streamToDestination(gulp, siteSettings, url, fileName);
+		});
+
+		return await Promise.all(urlsPromises).then(function() {  // eslint-disable-line no-undef
+			replaceImagePath(gulp, siteSettings)
+		})
+	};
+};

package/gulp-tasks/grab-shared-scripts.js

@@ -28,13 +28,24 @@ function replaceFootAssetScripts(gulp, gulpPlugins, siteSettings, siteData) {
     .pipe(replace(/"(?:(?!"|js")[\s\S])+(modutils|mod-utils.*?)js"/, resourcePath + '/mod-utils/' + fileNames.modUtilsFileName))
     .pipe(replace(/"(?:(?!"|")[\s\S])+(footer\/footer-component.*?)js"/, resourcePath + '/footer/' + fileNames.footerComponentJsFileName))
     .pipe(replace(/"(?:(?!"|")[\s\S])+(mod-form\/mod-form.*?)js"/, resourcePath + '/mod-form/' + fileNames.modFormFileName))
+    .pipe(replace(/"(?:(?!"|")[\s\S])+(mod-form\/form\/mod-form.*?)js"/, resourcePath + '/mod-form/form/' + fileNames.newModFormFileName))
     .pipe(replace(/"(?:(?!"|")[\s\S])+(qs-form.*?)js"/, resourcePath + '/mod-form/' + fileNames.qsFormFileName))
     .pipe(gulp.dest(siteSettings.srcFolder + '/shared-components/foot-assets'));
 }
-function replaceAbandonmentJsSrc(gulp, gulpPlugins, siteSettings, siteData) {
-  const resourcePath = isQuotePageOrUseRelativePath ? 'resources/scripts/abandonment/' : '/resources/scripts/abandonment/';
+function replaceAccessibleFootAssets(gulp, gulpPlugins, siteSettings, siteData) {
+  const resourcePath = isQuotePageOrUseRelativePath ? '{{#if this.nodeModulesPath}}{{this.nodeModulesPath}}{{/if}}"resources/scripts' : '"/resources/scripts';
+  return gulp.src(siteSettings.srcFolder + '/templates/components/v1/foot-assets.html')
+    .pipe(replace(/"(?:(?!"|js")[\s\S])+(modutils|mod-utils.*?)js"/, resourcePath + '/mod-utils/' + fileNames.modUtilsFileName + '"'))
+    .pipe(replace(/"(?:(?!"|")[\s\S])+(mod-form\/mod-form.*?)js"/, resourcePath + '/mod-form/accessible/' + fileNames.modFormAccessibleFileName + '"'))
+    .pipe(replace(/"(?:(?!"|")[\s\S])+(qs-form.*?)js"/, resourcePath + '/mod-form/accessible/' + fileNames.qsFormAccessibleFileName + '"'))
+    .pipe(gulp.dest(siteSettings.srcFolder + '/templates/components/v1'));
+}
+function replaceAbandonmentJsCssSrc(gulp, gulpPlugins, siteSettings, siteData) {
+  const jsResourcePath = isQuotePageOrUseRelativePath ? 'resources/scripts/abandonment/' : '/resources/scripts/abandonment/';
+  const cssResourcePath = isQuotePageOrUseRelativePath ? 'resources/styles/components/abandonment/' : '/resources/styles/components/abandonment/';
   return gulp.src(siteSettings.srcFolder + '/templates/abandonment/*.html')
-    .pipe(replace(/"(?:(?!"|")[\s\S])+(abandonment\/abandonment.*?)js"/, resourcePath + fileNames.abandonmentJsFileName))
+    .pipe(replace(/"(?:(?!"|")[\s\S])+(abandonment\/abandonment.*?)js"/, jsResourcePath + fileNames.abandonmentJsFileName))
+    .pipe(replace(/"(?:(?!"|")[\s\S])+(components\/abandonment\/abandonment.*?)css"/, cssResourcePath + fileNames.abandonmentStylesFileName))
     .pipe(gulp.dest(siteSettings.srcFolder + '/templates/abandonment'));
 }
 function replaceFooterStylesReference(gulp, gulpPlugins, siteSettings, siteData) {
@@ -50,6 +61,12 @@ function replaceFooterStylesReference(gulp, gulpPlugins, siteSettings, siteData)
       .pipe(gulp.dest(siteSettings.srcFolder + '/resources/scripts/footer'))
   }
 }
+function replaceAccessibleFooterStylesReference(gulp, gulpPlugins, siteSettings, siteData) {
+  return gulp.src(siteSettings.srcFolder + '/scripts/components/v1/footer-component.js')
+    .pipe(replace(/`(?:(?!`|`)[\s\S])+(components\/footer\/mod.*?)`/, '`/resources/styles/components/footer/' + fileNames.modFooterStylesFileName + '`'))
+    .pipe(replace(/`(?:(?!`|`)[\s\S])+(components\/footer\/qs.*?)`/, '`/resources/styles/components/footer/' + fileNames.qsFooterStylesFileName + '`'))
+    .pipe(gulp.dest(siteSettings.srcFolder + '/scripts/components/v1'))
+}
 function replaceFooterStylesReferenceInMap(gulp, gulpPlugins, siteSettings, siteData) {
   if (siteData.siteData && siteData.siteData.useRelativePathForResources === true) {
     return gulp.src(siteSettings.srcFolder + '/resources/scripts/footer/footer-component.min.js.map')
@@ -73,18 +90,21 @@ function getResource(url, config = {}, fn, fnArray) {
 
   return new Promise(resolve => {
     const file = getFileFromURL(url);
-    request(`${resourceURL}/${url}`)
+    const doNotAddHash = ['mod-form-beta.min.js']
+    let stream = request(`${resourceURL}/${url}`)
       .on('response', resp => {
         if (resp.statusCode !== 200) {
           throw new Error(`${resp.statusCode} Error while fetching ${file}`);
         }
       })
       .pipe(source(`${file}`))
-      .pipe(hash({
-        hashLength: 20,
-        template: file.replace(/^([^.]*)\.(.*)$/, '$1-<%= hash %>.$2')
-      }))
-      .pipe(tap(function(file, t) {
+      if (!doNotAddHash.includes(file)) {
+        stream = stream.pipe(hash({
+          hashLength: 20,
+          template: file.replace(/^([^.]*)\.(.*)$/, '$1-<%= hash %>.$2')
+        }))
+      }
+      stream.pipe(tap(function(file, t) {
         fileNames[config.fileName] = path.basename(file.path);
       }))
       .pipe(config.gulp.dest(`${config.siteSettings.srcFolder}/resources/${config.dest}`))
@@ -140,6 +160,16 @@ const TASKS = {
     srcReplaceFn: null,
     additionalSrcReplaceFns: []
   },
+  copyAbandonmentComponentStyles: {
+    url: `shared-resources/styles/components/abandonment/abandonment.min.css`,
+    config: {
+      fileName: 'abandonmentStylesFileName',
+      dest: 'styles/components/abandonment',
+      mapUrl: null,
+    },
+    srcReplaceFn: null,
+    additionalSrcReplaceFns: []
+  },
   copyAbandonmentJs: {
     url: `shared-resources/scripts/abandonment/abandonment.min.js`,
     config: {
@@ -147,7 +177,7 @@ const TASKS = {
       dest: 'scripts/abandonment',
       mapUrl: `shared-resources/scripts/abandonment/abandonment.min.js.map`,
     },
-    srcReplaceFn: replaceAbandonmentJsSrc,
+    srcReplaceFn: replaceAbandonmentJsCssSrc,
     additionalSrcReplaceFns: []
   },
   copyFooterComponentJs: {
@@ -170,6 +200,16 @@ const TASKS = {
     srcReplaceFn: null,
     additionalSrcReplaceFns: []
   },
+  copyNewModForm: {
+    url: `mod-form/form/mod-form-beta.min.js`,
+    mapUrl: `mod-form/form/mod-form-beta.min.js.map`,
+    config: {
+      fileName: 'newModFormFileName',
+      dest: 'scripts/mod-form/form'
+    },
+    srcReplaceFn: null,
+    additionalSrcReplaceFns: []
+  },
   copyQsForm: {
     url: `mod-form/qs-form.min.js`,
     config: {
@@ -180,6 +220,26 @@ const TASKS = {
     srcReplaceFn: replaceFootAssetScripts,
     additionalSrcReplaceFns: []
   },
+  copyAccessibleModForm: {
+    url: `mod-form/accessible/mod-form.min.js`,
+    config: {
+      fileName: 'modFormAccessibleFileName',
+      dest: 'scripts/mod-form/accessible',
+      mapUrl: `mod-form/accessible/mod-form.min.js.map`,
+    },
+    srcReplaceFn: null,
+    additionalSrcReplaceFns: []
+  },
+  copyAccessibleQsForm: {
+    url: `mod-form/accessible/qs-form.min.js`,
+    config: {
+      fileName: 'qsFormAccessibleFileName',
+      dest: 'scripts/mod-form/accessible',
+      mapUrl: `mod-form/accessible/qs-form.min.js.map`,
+    },
+    srcReplaceFn: replaceAccessibleFootAssets,
+    additionalSrcReplaceFns: []
+  },
   copyModFooterComponentStyles: {
     url: `shared-resources/styles/components/footer/mod-footer.min.css`,
     config: {
@@ -198,7 +258,7 @@ const TASKS = {
       mapUrl: null,
     },
     srcReplaceFn: null,
-    additionalSrcReplaceFns: [replaceFooterStylesReference, replaceFooterStylesReferenceInMap]
+    additionalSrcReplaceFns: [replaceAccessibleFooterStylesReference, replaceFooterStylesReference, replaceFooterStylesReferenceInMap]
   }
 };
 module.exports = function(gulp, gulpPlugins, siteSettings, siteData) {

package/gulp-tasks/serve.js

@@ -8,7 +8,7 @@ module.exports.src = function(gulp, gulpPlugins, siteSettings, siteData) {
 		} else if (siteData.isQSPage) {
 			sequenceOpts = ['clean', 'grab-cdn', 'grab-shared-components', 'grab-shared-scripts', 'templates', 'styles', 'grab-theme-json', 'grab-tooltips-json', 'combine-files', 'grab-images', 'js-lint'];
 		} else {
-			sequenceOpts = ['clean', 'grab-cdn', 'grab-shared-components', 'grab-shared-scripts', 'templates', 'styles', 'grab-tooltips-json', 'combine-files', 'grab-images', 'js-lint'];
+			sequenceOpts = ['clean', 'grab-cdn', 'grab-shared-components', 'grab-shared-scripts', 'templates', 'styles', 'grab-tooltips-json', 'combine-files', 'grab-images','grab-global-images', 'js-lint'];
 		}
 		runSequence(...sequenceOpts, () => {
 			// Run a BrowserSync server
@@ -36,7 +36,13 @@ module.exports.src = function(gulp, gulpPlugins, siteSettings, siteData) {
 			]).on('change', gulpPlugins.browserSync.reload);
 
 			// If templates changed, rerun templates task
-			gulp.watch(siteSettings.srcFolder + '/' + siteSettings.templatesSubfolder + '/**/*.html', ['templates']);
+			if (!siteData.useTypescript && !siteData.isQSPage) {
+				gulp.watch(siteSettings.srcFolder + '/' + siteSettings.templatesSubfolder + '/**/*.html', function() {
+					runSequence('templates','grab-global-images')
+				});
+			} else {
+				gulp.watch(siteSettings.srcFolder + '/' + siteSettings.templatesSubfolder + '/**/*.html', ['templates'])
+			}
 
 			// If styles changed, rerun styles task
 			gulp.watch(siteSettings.srcFolder + '/' + siteSettings.stylesSubfolder + '/**/*.scss', ['styles']);

package/gulp-tasks/tasks.js

@@ -346,6 +346,18 @@ module.exports = function() {
 
 				return require(opts.gulpTasksFolderPath + '/grab-images')(opts.gulp, opts.gulpSettings, opts.siteData);
 			}
+    },
+
+		// Get global images
+		'grab-global-images': {
+			subtasks: [],
+			func: function(opts) {
+				if ('undefined' === typeof opts.gulpTasksFolderPath) {
+					opts.gulpTasksFolderPath = '.';
+				}
+
+				return require(opts.gulpTasksFolderPath + '/grab-global-images')(opts.gulp, opts.gulpSettings, opts.siteData);
+			}
 		},
 
 		// Copy json files to dist

package/gulp-tasks/templates.js

@@ -137,18 +137,6 @@ module.exports = function(gulp, gulpPlugins, siteSettings, siteData) {
 				index++;
 				return index;
 			}
-		},
-		// Ignore certain keys when using {{#each}} to loop through key:value pairs
-		{
-			name: 'ignoreKeys',
-			fn: function(keysToIgnore, key, options) {
-				var ignoreKeys = keysToIgnore.split(',');
-  				if (ignoreKeys.indexOf(key) === -1) {
-					return options.fn(this);
-				} else {
-					return options.inverse(this);
-				}
-			}
 		}
 	];
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mod-build",
-  "version": "3.6.21--beta.2",
+  "version": "3.6.21--a11y.beta.5",
   "description": "Share components for S3 sites.",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"