From: Jeanie Chung <jeanie.chung@gmail.com>
Date: Tue, 17 Feb 2015 22:54:02 +0000 (-0800)
Subject: Adding inky parser to repo.
X-Git-Tag: v2.0.0-rc.1~141
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=2806ffcdc1a14a377f96f7f07442d3da87d03b87;p=thirdparty%2Ffoundation%2Ffoundation-emails.git

Adding inky parser to repo.
---

diff --git a/output/gulp-zurb-inky/index.js b/output/gulp-zurb-inky/index.js
new file mode 100644
index 00000000..15633534
--- /dev/null
+++ b/output/gulp-zurb-inky/index.js
@@ -0,0 +1,229 @@
+var cheerio = require('cheerio');
+
+
+var Inky = function Inky () {
+  this.customTags = [
+      "panel",
+      "row",
+      "container",
+      "columns",
+      "button"
+  ];
+};
+
+Inky.prototype = {
+  getTags: function() {
+    return this.customTags;
+  },
+  
+  releaseTheKraken: function($) {
+    var center = $('center').html(),
+        self   = this;
+
+    //find nested components
+    if (self.checkNestedComponents($) !== false) {
+      var nestedComponents = self.findNestedComponents($, center);
+
+      // process each element to get the table markup
+      $(nestedComponents).each(function(idx, el) {
+        var containerScaffold = self.scaffoldElements($, $(el));
+      });
+    }
+    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): A string containing the markup of a singular element
+  // Returns:
+  //    str (String): A string containing the markup of inputted element with contained elements
+  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).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): 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 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.customTags.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:
+  //   Goes through array of custom nested components to determine whether or not there are any on the DOM
+  //
+  // Arguments:
+  //    null
+  // Returns:
+  //    boolean: True if there are nested components on the DOM, false otherwise.
+  checkNestedComponents: function($) {
+    var self = this;
+
+    $(self.customTags).each(function() {
+      // check if custom elements still exist
+      if ($(this).index() !== -1) {
+        return true; 
+      }
+      else {
+        return false;
+      }
+    });
+  },
+
+  // Description:
+  //    Returns output for desired custom element
+  //
+  // Arguments:
+  //    element (obj), type (str): 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 'panel':
+        output = '<td class="panel ' + compClass +'">' + inner + '</td>';
+        break;
+
+      case 'button':
+        output = '<table class="button ' + compClass +'"><tbody><tr><td>' + inner + '</td></tr></tbody></table>';
+        break;
+      // TODO: This is super messed up right now
+      case 'subcolumn':
+        var subColSize = '';
+
+        if ($(component).attr('small')) {
+          subColSize += 'small' + '-' + $(component).attr('small') + ' ';
+        }
+        if ($(component).attr('large')) {
+          subColSize += 'large' + '-' + $(component).attr('large') + ' ';
+        }
+        output = '<td class="sub-columns ' + compClass + ' ' + subColSize +'">' + inner + '</td>';
+        break;
+
+      case 'container':
+        output = '<table class="container ' + compClass + '"><tbody><tr><td>' + inner + '</td></tr></tbody></table>';
+        break;
+
+      case 'columns':
+        self.makeCols($, component, component.nextAll('columns'));
+        break;
+      
+      case 'row':
+        output = '<table class="row ' + compClass + '"><tbody><tr>'+ inner + '</tr></tbody></table>';
+        break;
+
+      default: 
+        // unless it's a special element, just grab the inside
+        // another cheerio quirk
+        inner = $.html(element);
+        output = '<td>' + inner + '</td>';
+    };
+
+    return output;
+  },
+
+  // Description:
+  //    Returns output for column elements
+  //
+  // Arguments:
+  //    col (obj), siblings (str): the initial target column and its siblings within the same row 
+  // Returns:
+  //    HTML (string): Mark up for columns all contained in a row
+  makeCols: function($, col, siblings) {
+    var output   = '',
+        columns  = [col, siblings],
+        colCount = col.length + siblings.length;
+
+    $(columns).each(function(i, el) {
+      var wrapperHTML = '';
+      var colSize     = '';
+      var col         = $(el)
+      var inner       = $(el).html();
+
+      var colClass    = '';
+      if ($(col).attr('class')) {
+        colClass = $(col).attr('class');
+      }
+
+      wrapperHTML = '<td class="wrapper ' + colClass + '">';
+
+      if (i === colCount - 1) {
+          wrapperHTML = '<td class="wrapper ' + colClass + 'last">';
+      }
+      // check for sizes
+      if ($(col).attr('small')) {
+        colSize += 'small' + '-' + $(col).attr('small') + ' ';
+      }
+      if ($(col).attr('large')) {
+        colSize += 'large' + '-' + $(col).attr('large') + ' ';
+      }
+
+      wrapperHTML += '<table class="' + colSize + 'columns"><tr><td>';
+      wrapperHTML += inner;
+      wrapperHTML += '</td><td class="expander"></td></tr></table>';
+
+      $(col).replaceWith(wrapperHTML);
+    });
+  }
+};
+
+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
new file mode 100644
index 00000000..a34f1bf5
--- /dev/null
+++ b/output/gulp-zurb-inky/package.json
@@ -0,0 +1,16 @@
+{
+  "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."
+}