From: Jeanie Chung Date: Wed, 18 Feb 2015 23:51:00 +0000 (-0800) Subject: Moved everything out into separate package repos so we have less bloat. X-Git-Tag: v2.0.0-rc.1~128 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=cf4f527e8da1c5d8da4715fa03ef1b52504c0a99;p=thirdparty%2Ffoundation%2Ffoundation-emails.git Moved everything out into separate package repos so we have less bloat. --- diff --git a/.gitignore b/.gitignore index ae1c3f9a..55b648ed 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,4 @@ -.DS_Store +*.DS_Store node_modules/ build/ .sass-cache/ diff --git a/gulpfile.js b/gulpfile.js index e32294bd..189d0bd2 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -25,9 +25,8 @@ var gulp = require('gulp'), concat = require('gulp-concat'), extractMQ = require('media-query-extractor'), inject = require('gulp-inject'), - zfEmail = require('gulp-zurb-foundation-email'), - rimraf = require('rimraf'), - jasmine = require('gulp-jasmine'); + inkyGulp = require('gulp-inky'), + rimraf = require('rimraf'); // 2. VARIABLES // - - - - - - - - - - - - - - - @@ -35,7 +34,6 @@ var gulp = require('gulp'), var dirs = { styles: 'scss/*.scss', html: 'html/*.html', - js: 'js/**/*.js', build: './build', spec: './spec' }; @@ -64,9 +62,9 @@ gulp.task('sass', function() { gulp.task('inline', function() { return gulp.src(dirs.build + '/*.html') .pipe(inlineCss()) - .pipe(rename(function(path) { - path.basename += '-inline' - })) + .pipe(rename({ + suffix: '-inline' + }) .pipe(gulp.dest(dirs.build)) }); @@ -126,23 +124,11 @@ gulp.task('copy-html', function() { // 6. Syntax Transformer // - - - - - - - - - - - - - - - -gulp.task('inky-prime', function() { - return gulp.src('node_modules/gulp-zurb-foundation-email/node_modules/gulp-zurb-inky/index.js') - .pipe(gulp.dest('./output/gulp-zurb-inky')); -}) - -gulp.task('js', function() { - gulp.start('inky-prime'); -}); - // get the HTML from the body and run it through Inky parser gulp.task('query', function() { gulp.src(dirs.html) - .pipe(zfEmail({ - grid: 12 - - })) + .pipe(inkyGulp()) .pipe(gulp.dest(dirs.build)) .pipe(connect.reload()); }); @@ -150,13 +136,9 @@ gulp.task('query', function() { // 7. Testing // - - - - - - - - - - - - - - - -// Starts a server -// Default Port: 8080 +// Eventual Litmus/Mailgun integration gulp.task('test', function () { - return gulp.src(dirs.spec + '/*.js') - .pipe(jasmine({ - verbose: true - })); + }); // 8. GO FORTH AND BUILD @@ -184,7 +166,6 @@ gulp.task('serve', function() { // Live reloads on change gulp.task('watch', ['serve'], function() { gulp.watch([dirs.html], ['query','minify-html']); - gulp.watch(['node_modules/gulp-zurb-foundation-email/node_modules/gulp-zurb-inky/index.js'], ['query']) gulp.watch([dirs.styles], ['sass']); }); diff --git a/output/gulp-zurb-foundation-email/index.js b/output/gulp-zurb-foundation-email/index.js deleted file mode 100644 index 6664ef27..00000000 --- a/output/gulp-zurb-foundation-email/index.js +++ /dev/null @@ -1,26 +0,0 @@ -var es = require('event-stream'); -var gutil = require('gulp-util'); -var Buffer = require('buffer').Buffer; - -var cheerio = require('cheerio'); -var inky = require('gulp-zurb-inky'); - - -module.exports = function (opts) { - "use strict"; - - var body = function (file) { - if (file.isNull()) { return this.emit('data', file); } - if (file.isStream()) { return this.emit('error', new Error("gulp-coffee: Streaming not supported")); } - - var str = file.contents.toString('utf8'); - var $ = cheerio.load(str); - - $ = inky.releaseTheKraken($, opts); - - file.contents = new Buffer($.html({normalizeWhitespace: true})); - this.emit('data', file); - }; - - return es.through(body); -}; diff --git a/output/gulp-zurb-foundation-email/package.json b/output/gulp-zurb-foundation-email/package.json deleted file mode 100644 index 1a25f75b..00000000 --- a/output/gulp-zurb-foundation-email/package.json +++ /dev/null @@ -1,17 +0,0 @@ -{ - "name": "gulp-zurb-foundation-email", - "version": "0.0.1", - "main": "./index.js", - "dependencies": { - "gulp-util": "~2.2.1", - "event-stream": "~3", - "cheerio": "*", - "gulp-zurb-inky": "*" - }, - "devDependencies": { - "gulp": "*", - "should": "*", - "gulp-util": "*" - }, - "description": "Take initial HTML syntax and turn them into tables that use Foundation for Email styles." -} diff --git a/output/gulp-zurb-inky/index.js b/output/gulp-zurb-inky/index.js deleted file mode 100644 index 882f06bd..00000000 --- a/output/gulp-zurb-inky/index.js +++ /dev/null @@ -1,467 +0,0 @@ -var cheerio = require('cheerio'); - -var Inky = function Inky () { - this.zfTags = { - button: 'button', - row: 'row', - callout: 'callout', - columns: 'columns', - subcolumns: 'subcolumns', - container: 'container', - inlineListH: 'inline-list-h', - inlineListV: 'inline-list-v' - }, - this.grid = 12 -}; - -Inky.prototype = { - // Description: - // Returns the object zfTags - // Arguments: - // null - // Returns: - // null - getTags: function() { - return this.zfTags; - }, - - // Description: - // Sets the object property zfArray to an array containing the markup for our ZF custom elements - // Arguments: - // null - // Returns: - // null - setTagArray: function() { - var arr = []; - var self = this; - - for (val in self.zfTags) { - arr.push(self.zfTags[val]); - } - self.zfArray = arr; - }, - - // Description: - // Checks if an element is a custom ZF element. - // - // Arguments: - // elType (string): the tag name of an element - // Returns: - // boolean: true/false - isZfElement: function(elType) { - var self = this; - // create an array of our custom tags, if we haven't done so already - if(!self.zfArray) { - self.setTagArray(); - } - - // if the element is a custom element - if (self.zfArray.indexOf(elType) !== -1) { - // return true - return true; - } - else { - return false; - } - }, - - // Description: - // Puts in mark up for microsoft buttons - // - // Arguments: - // $: Cheerio - // Returns: - // null: new buttons - msButton: function($) { - var buttons = $('table.button'); - $(buttons).each(function() { - // put microsoft markup - }) - - }, - - // Description: - // Checks if an element is an element with a td included. Currently it's a manual check. - // Array was populated from the markup from the component factory. - // - // Arguments: - // elType (string): the tag name of an element - // Returns: - // boolean: true/false - isTdElement: function(elType) { - var tdEls = ['subcolumns']; - - // if the element is an element that comes with td - if (tdEls.indexOf(elType) > -1) { - // return true - return true; - } - else { - return false; - } - - }, - // Description: - // Sets custom config for Inky - // - // Arguments: - // opts (object): configuration object - // Returns: - // null - setConfig: function(opts) { - - for (var prop in opts) { - this[prop] = opts[prop]; - } - - }, - // Description: - // Awww yiss. Kickstarts the whole parser. Takes in HTML loaded via Cheerio as an argument, - // checks if there are any custom components. If there are, it replaces the nested components, - // traverses the DOM and replaces them with email markup. - // - // Arguments: - // $, opts (object): Cheerio loaded string, configuration object - // Returns: - // $: Cheerio modified string - releaseTheKraken: function($, opts) { - var center = $('center').html(), - self = this; - - // set configuration - if (opts) { - self.setConfig(opts); - } - // create an array of our custom tags - self.setTagArray(); - - //find nested components - if (self.checkZfComponents($) !== false) { - var nestedComponents = self.findNestedComponents($, center); - - // process each element to get the table markup - $(nestedComponents).each(function(idx, el) { - var containerScaffold = self.scaffoldElements($, $(el)); - }); - - // remove any blank spaces between classes - // and reload into cheerio - str = self.removeBlankSpaces($.html()); - $ = cheerio.load(str); - - // see the mark up for dev purposes - // console.log($.html()); - } - else { - console.log("all done"); - } - return $; - }, - - // Description: - // Executes a function place the correct mark up for custom components in the correct place in the DOM - // It is a recursive function that drills down the DOM to find all custom nested elements within an element - // and replaces the custom tags with the correct table email markup. - // - // Arguments: - // $, str (String): Cheerio, and a string containing the markup of a singular element - // Returns: - // null: his function replaces the syntax directly in the cheerio object - removeBlankSpaces: function(str) { - // remove any blank spaces between classes we may have put in - str = str.replace( / "+/g, '"' ) - - return str; - }, - // Description: - // Executes a function place the correct mark up for custom components in the correct place in the DOM - // It is a recursive function that drills down the DOM to find all custom nested elements within an element - // and replaces the custom tags with the correct table email markup. - // - // Arguments: - // $, str (String): Cheerio, and a string containing the markup of a singular element - // Returns: - // null: his function replaces the syntax directly in the cheerio object - scaffoldElements: function($, str) { - // take inner html of elements and nest them inside each others - var output = '', - elMarkup = '', - element = $(str)[0], - inner = $(str).html(), - self = this; - - // replace tags with proper table syntax - // elMarkup retains the inner html within the markup - if (element !== undefined) { - elMarkup = self.componentFactory($, element, element.name); - $(element).replaceWith(elMarkup); - } - else { - return; - } - - // find if there are more nested elements in the inner syntax - var moreNested = self.findNestedComponents($, inner); - moreNested = moreNested.concat(self.findDeeplyNested($, inner)); - - - $(moreNested).each(function(idx, el) { - // call a recursion to replace all nested elements - self.scaffoldElements($, $(el)); - }); - - }, - - // Description: - // Executes a function to find and return nested custom elements within another element - // - // Arguments: - // $, str (String): Cheerio, and a string containing the markup of an element to be checked for nested components - // Returns: - // nestedComponents (Array): An array containing the names (i.e. tags) of the nested components - findNestedComponents: function($, str) { - var nestedComponents = [], - self = this, - children; - - // if array hasn't been set yet, set it with properties of object - if (!self.zfArray) { - self.setTagArray(); - } - // if the nested component is an element, find the children - // NOTE: this is to avoid a cheerio quirk where it will still pass - // special alphanumeric characters as a selector - if (str.indexOf('<') !== -1) { - children = $(str); - }; - - $(children).each(function(i, el) { - // if the element's name matches an element in the array - if (self.zfArray.indexOf(el.name) !== -1) { - // push them to array of nested component names - nestedComponents.push(el.name); - } - }); - // return array containing all nested components - return nestedComponents; - }, - - // Description: - // Executes a function to find and return deeply nested custom elements within another element - // Uses the find selector rather than going through children. - // - // Arguments: - // $, el (String): Cheerio, and a string containing the markup of an element to be checked for nested components - // Returns: - // nestedComponents (Array): An array containing the names (i.e. tags) of the nested components - findDeeplyNested: function($, el) { - var nestedComponents = [], - self = this; - - // if array hasn't been set yet, set it with properties of object - if (!self.zfArray) { - self.setTagArray(); - } - - // if the nested component is an element, find the children - // NOTE: this is to avoid a cheerio quirk where it will still pass - // special alphanumeric characters as a selector - if (el.indexOf('<') !== -1) { - $(self.zfArray).each(function(idx, zfElement) { - // find any nearby elements that are contained within el - if ($(el).find(zfElement).length > 0) { - nestedComponents.push(zfElement); - } - }); - }; - - // return array containing all nested components - return nestedComponents; - }, - - // Description: - // Goes through array of custom nested components to determine whether or not there are any on the DOM - // - // Arguments: - // $ : Cheerio - // Returns: - // boolean: True if there are nested components on the DOM, false otherwise. - checkZfComponents: function($) { - var self = this; - - // if array hasn't been set yet, set it with properties of object - if (!self.zfArray) { - self.setTagArray(); - } - - $(self.zfArray).each(function(idx, zfElement) { - // check if custom elements still exist - if ($('center').find(zfElement).length > 0) { - return true; - } - }); - - }, - - // Description: - // Returns output for desired custom element - // - // Arguments: - // $, element (obj), type (str): cheerio, element as a cheerio object, and type as the tag name - // Returns: - // HTML (string): Mark up for corresponding element with inner html contents untouched - componentFactory: function($, element, type) { - var output = '', - component = $(element), - inner = $(element).html(), - compClass = '', - self = this; - - if ($(component).attr('class')) { - compClass = $(component).attr('class'); - }; - - switch (type) { - case self.zfTags.callout: - output = '' + inner + ''; - break; - - case self.zfTags.button: - output = '
' + inner + '
'; - break; - - case self.zfTags.subcolumns: - output = self.makeCols($, component, 'subcolumns'); - break; - - case self.zfTags.container: - output = '
' + inner + '
'; - break; - - case self.zfTags.columns: - output = self.makeCols($, component, 'columns'); - break; - - case self.zfTags.row: - output = ''+ inner + '
'; - break; - - case self.zfTags.inlineListH: - inner = self.makeInlineList($, component, 'horizontal'); - output = '' + inner + '
'; - break; - - case self.zfTags.inlineListV: - inner = self.makeInlineList($, component, 'vertical'); - output = '' + inner + '
'; - break; - - default: - // unless it's a special element, just grab the inside - // another cheerio quirk - inner = $.html(element); - output = '' + inner + ''; - }; - - return output; - }, - - // Description: - // Returns output for inline list elements. - // - // Arguments: - // $ (obj), col (obj), orientation (str): cheerio, the list, whether vertical/horizontal list - // Returns: - // HTML (string): Mark up for inline lists - makeInlineList: function($, list, orientation) { - var output = ''; - var children = list.children(); - - $(children).each(function(idx, el) { - var innerChild = $.html(el); - - if (orientation === 'horizontal') { - output += '' + innerChild + ''; - } - else if (orientation === 'vertical') { - output += '' + innerChild + ''; - } - else { - return; - } - }); - return output; - }, - - // Description: - // Returns output for column elements. TODO: this could be refactored to handle both cols and subcols - // - // Arguments: - // $ (obj), col (obj): cheerio, the target column - // Returns: - // HTML (string): Mark up for columns all contained in a row - makeCols: function($, col, type) { - var output = '', - wrapperHTML = '', - colSize = '', - colClass = '', - inner = $(col).html(), - self = this; - - // Add 1 to include current column - var colCount = $(col).siblings().length + 1; - - if ($(col).attr('class')) { - colClass = $(col).attr('class'); - } - - // check for sizes - // if no attribute is provided, default to small-12 - // divide evenly for large columns - if ($(col).attr('small')) { - colSize += 'small' + '-' + $(col).attr('small') + ' '; - } - else { - colSize += 'small-12 '; - } - - if ($(col).attr('large')) { - colSize += 'large' + '-' + $(col).attr('large') + ' '; - } - else { - colSize += 'large-' + Math.floor(self.grid/colCount) + ' '; - } - - // start making markup - if (type === 'columns') { - // if it is the last column, add the class last - if ($(col).next()[0] && $(col).next()[0].name !== 'columns') { - output = ''; - - } else { - output = ''; - } - - output += ''; - output += inner; - output += '
'; - } - else if (type === 'subcolumns') { - - // if it is the last subcolumn, add the last class - if ($(col).next()[0] && $(col).next()[0].name !== 'subcolumns') { - output = '' + inner + ''; - } - else { - output = '' + inner + ''; - } - } - else { - return; - } - - return output; - } -}; - -module.exports = new Inky(); \ No newline at end of file diff --git a/output/gulp-zurb-inky/package.json b/output/gulp-zurb-inky/package.json deleted file mode 100644 index a34f1bf5..00000000 --- a/output/gulp-zurb-inky/package.json +++ /dev/null @@ -1,16 +0,0 @@ -{ - "name": "gulp-zurb-inky", - "version": "0.0.1", - "main": "./index.js", - "dependencies": { - "gulp-util": "~2.2.1", - "event-stream": "~3", - "cheerio": "*" - }, - "devDependencies": { - "gulp": "*", - "should": "*", - "gulp-util": "*" - }, - "description": "Take initial HTML syntax and turn them into tables that use Foundation for Email styles." -} diff --git a/package.json b/package.json index 80c13977..123023b6 100644 --- a/package.json +++ b/package.json @@ -5,16 +5,15 @@ "devDependencies": { "cheerio": "^0.18.0", "gulp": "^3.8.10", - "gulp-combine-mq": "^0.3.1", "gulp-concat": "^2.4.3", "gulp-connect": "^2.2.0", - "gulp-group-css-media-queries": "^1.0.0", "gulp-html2txt": "^1.1.0", "gulp-inline-css": "^1.0.1", "gulp-jasmine": "^2.0.0", "gulp-minify-html": "^0.1.8", "gulp-rename": "^1.2.0", "gulp-ruby-sass": "^0.7.1", + "gulp-inky": "*", "rimraf": "^2.2.8" } } diff --git a/spec/components.js b/spec/components.js deleted file mode 100644 index ccb04ee0..00000000 --- a/spec/components.js +++ /dev/null @@ -1,20 +0,0 @@ -/* global describe, it, expect */ - -"use strict"; - -var inky = require('../node_modules/gulp-zurb-foundation-email/node_modules/gulp-zurb-inky'); -var cheerio = require('../node_modules/gulp-zurb-foundation-email/node_modules/cheerio'); - -describe("the components", function () { - - it("returns basic button syntax", function () { - var $ = cheerio.load('
'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('
Big button
'); - }); - - - - -}); diff --git a/spec/grid.js b/spec/grid.js deleted file mode 100644 index 79d3540d..00000000 --- a/spec/grid.js +++ /dev/null @@ -1,67 +0,0 @@ -/* global describe, it, expect */ - -"use strict"; - -var inky = require('../node_modules/gulp-zurb-foundation-email/node_modules/gulp-zurb-inky'); -var cheerio = require('../node_modules/gulp-zurb-foundation-email/node_modules/cheerio'); - -describe("the grid", function () { - it("returns the correct row syntax", function() { - var $ = cheerio.load('
This is a row!
'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('
This is a row!
'); - }) - - it("returns the correct container syntax", function() { - var $ = cheerio.load('
This is a container!
'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('
This is a container!
'); - }) - - it("returns the correct column syntax", function () { - var $ = cheerio.load('

This is 10 Columns

This is 2 Columns

'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('

This is 10 Columns

This is 2 Columns

'); - }); - - it("nests subcolumns correctly", function() { - var $ = cheerio.load('

I\'m just half of the parent 10 column

I\'m the other half of the parent 10 column

This is 2 Columns

'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('

I'm just half of the parent 10 column

I'm the other half of the parent 10 column

This is 2 Columns

'); - }) - - it("nests rows in containers", function() { - var $ = cheerio.load('
Row in container
'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('
Row in container
'); - }) - - it("will place the 'last' class on the last column", function() { - var $ = cheerio.load('
.ten cols.two cols
'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('
.ten cols
.two cols
'); - - }) - - it("will place the 'last' class on a solo column", function() { - var $ = cheerio.load('
forever alone
'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('
forever alone
'); - - }) - - it("handles deeply nested components", function() { - var $ = cheerio.load('

deep stuff

'); - - $ = inky.releaseTheKraken($); - expect($.html()).toEqual('

deep stuff
'); - - }) -}); diff --git a/spec/inky.js b/spec/inky.js deleted file mode 100644 index 8914405a..00000000 --- a/spec/inky.js +++ /dev/null @@ -1,12 +0,0 @@ -"use strict"; - -var inky = require('../node_modules/gulp-zurb-foundation-email/node_modules/gulp-zurb-inky'); - -describe("inky", function () { - it("should be setting custom tags from object correctly", function () { - - inky.setTagArray(); - expect(inky.zfArray).toEqual([ 'button', 'row', 'callout', 'columns', 'subcolumns', 'container', 'inline-list-h', 'inline-list-v' ]); - }); - -});