inky-rb 0.0.2 → 0.0.3

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: fbf8c53c8d48a846016305a76c103d83fbede347
-  data.tar.gz: 4af2ec4313392cc40b67a97692f8a2bf0c3a07ec
+  metadata.gz: 0b80cbab70f46992b028d1922f75f4e174feaed9
+  data.tar.gz: c423de651a2e9360171ca5c53ea84b387bff8032
 SHA512:
-  metadata.gz: 017fb453f67dd9277efd68dd5834ac3b297cbca27420d42093f819bf7628ff95ebfeabc4d8e2d5981ea8352c26ce38bc3ddbd3f1105decfe670d727928affd0b
-  data.tar.gz: 1e7ec1e72349d03a3c5afce68f1b72b4499f6d0daebf874c6aba742edd2100989f25dbfc97c540a1a4a0657b447e7af896f574139f2eb7df1e9d626e9e9f4195
+  metadata.gz: fbb5a18634c5da418d8f343de6b1106ae2ac61c689b256c5a112fdca6218daf0843af331d50cea4174db1b3cadf1e7c115c4d27d770d3f4f119e9a92f7490d44
+  data.tar.gz: e804bf2d79119958f5facaeeeb96cc752cdf059a00b83567b621efbc2272f657e0d7d68e02479b733e2eaa3dd5ad022176fe97e81056ed4d1f700a34bf9b29cd

data/Gemfile.lock

@@ -1,12 +1,14 @@
 PATH
   remote: .
   specs:
-    inky (0.0.1)
+    inky-rb (0.0.2)
+      foundation_emails (~> 2)
 
 GEM
   remote: https://rubygems.org/
   specs:
     diff-lcs (1.2.5)
+    foundation_emails (2.1.0.1)
     rake (11.1.2)
     rspec-core (3.4.1)
       rspec-support (~> 3.4.0)
@@ -20,7 +22,7 @@ PLATFORMS
 
 DEPENDENCIES
   bundler (~> 1.6)
-  inky!
+  inky-rb!
   rake
   rspec-core
   rspec-expectations

data/README.md

@@ -0,0 +1,87 @@
+# Inky
+
+Inky is an HTML-based templating language that converts simple HTML into complex, responsive email-ready HTML. Designed for [Foundation for Emails](http://foundation.zurb.com/emails), a responsive email framework from [ZURB](http://zurb.com).
+
+Give Inky simple HTML like this:
+
+```html
+<row>
+  <columns large="6"></columns>
+  <columns large="6"></columns>
+</row>
+```
+
+And get complicated, but battle-tested, email-ready HTML like this:
+
+```html
+<table class="row">
+  <tbody>
+    <tr>
+      <th class="small-12 large-6 columns first">
+        <table>
+          <tr>
+            <th class="expander"></th>
+          </tr>
+        </table>
+      </th>
+      <th class="small-12 large-6 columns first">
+        <table>
+          <tr>
+            <th class="expander"></th>
+          </tr>
+        </table>
+      </th>
+    </tr>
+  </tbody>
+</table>
+```
+
+## Installation
+
+Add this line to your application's Gemfile:
+
+    $ gem 'foundation-rails', require: 'inky'
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install foundation-rails
+
+## Usage
+
+Inky can be embedded into your asset pipeline, combining with premailer to let you generate amazing HTML emails without the nightmare of table-based email development.
+
+Simply use the file extension `.inky` and make sure your email layout includes a scss file that includes the foundation-emails styles.
+```
+@import 'foundation-emails'
+```
+
+## Custom Elements
+
+Inky simplifies the process of creating HTML emails by expanding out simple tags like `<row>` and `<column>` into full table syntax. The names of the tags can be changed with the `components` setting.
+
+Here are the names of the defaults:
+
+```ruby
+{
+  button: 'button',
+  row: 'row',
+  columns: 'columns',
+  container: 'container',
+  inky: 'inky',
+  block_grid: 'block-grid',
+  menu: 'menu',
+  center: 'center',
+  callout: 'callout',
+  spacer: 'spacer',
+  wrapper: 'wrapper',
+  menu_item: 'item'
+}
+```
+
+## Programmatic Use
+
+The Inky parser can be accessed directly for programmatic use.

data/inky.gemspec

@@ -1,6 +1,10 @@
+lib = File.expand_path('../lib', __FILE__)
+$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
+require 'inky/rails/version'
+
 Gem::Specification.new do |s|
   s.name        = 'inky-rb'
-  s.version     = '0.0.2'
+  s.version     = Inky::Rails::VERSION
   s.date        = '2016-02-12'
   s.summary     = 'Inky is an HTML-based templating language that converts simple HTML into complex, responsive email-ready HTML. Designed for Foundation for Emails, a responsive email framework from ZURB.  '
   s.description = 'Inky is an HTML-based templating language that converts simple HTML into complex, responsive email-ready HTML. Designed for Foundation for Emails, a responsive email framework from ZURB.  '

data/lib/component_factory.rb

@@ -10,6 +10,17 @@ module ComponentFactory
     end
   end
 
+  def _pass_through_attributes(elem)
+    ignored = ['class', 'id', 'href', 'size', 'large', 'no-expander', 'small', 'target'];
+    elem.attributes.map do |name, value|
+      if ignored.include?(name.downcase)
+        ''
+      else
+        "#{name}=\"#{value}\""
+      end
+    end.join(' ')
+  end
+
   def _has_class(elem, klass)
     !!elem.attributes['class'] && elem.attributes['class'].split(' ').include?(klass)
   end
@@ -18,13 +29,18 @@ module ComponentFactory
     (elem.attributes['class'] ? (defaults.concat(elem.attributes['class'].split(' '))) : defaults).uniq
   end
 
+  def _target_attribute(elem)
+    elem.attributes['target'] ? " target=\"#{elem.attributes['target']}\"" : ''
+  end
+
   def _transform_button(component, inner)
     expand = _has_class(component, 'expand')
     if component.attributes['href']
+      target = _target_attribute(component)
       if expand
-        inner = "<a href=\"#{component.attributes['href']}\" align=\"center\" class=\"float-center\">#{inner}</a>"
+        inner = "<a href=\"#{component.attributes['href']}\"#{target} align=\"center\" class=\"float-center\">#{inner}</a>"
       else
-        inner = "<a href=\"#{component.attributes['href']}\">#{inner}</a>"
+        inner = "<a href=\"#{component.attributes['href']}\"#{target}>#{inner}</a>"
       end
     end
     inner = "<center>#{inner}</center>" if expand
@@ -43,7 +59,8 @@ module ComponentFactory
   end
 
   def _transform_menu_item(component, inner)
-    "<th class=\"menu-item\"><a href=\"#{component.attributes['href']}\">#{inner}</a></th>"
+    target = _target_attribute(component)
+    "<th class=\"menu-item\"><a href=\"#{component.attributes['href']}\"#{target}>#{inner}</a></th>"
   end
 
   def _transform_container(component, inner)
@@ -53,7 +70,8 @@ module ComponentFactory
 
   def _transform_row(component, inner)
     classes = _class_array(component, ['row'])
-    "<table class=\"#{classes.join(' ')}\"><tbody><tr>#{inner}</tr></tbody></table>"
+    attrs = _pass_through_attributes(component)
+    "<table #{attrs} class=\"#{classes.join(' ')}\"><tbody><tr>#{inner}</tr></tbody></table>"
   end
 
   # in inky.js this is factored out into makeClumn.  TBD if we need that here.
@@ -105,8 +123,26 @@ module ComponentFactory
 
   def _transform_spacer(component, inner)
     classes = _class_array(component, ['spacer'])
-    size = component.attributes['size'] || 16
-    return "<table class=\"#{classes.join(' ')}\"><tbody><tr><td height=\"#{size}px\" style=\"font-size:#{size}px;line-height:#{size}px;\">&#xA0;</td></tr></tbody></table>"
+    size = component.attributes['size']
+    size_sm = component.attributes['size-sm']
+    size_lg = component.attributes['size-lg']
+    if size_sm || size_lg
+      html = ''
+      if size_sm
+        html += "<table class=\"#{classes.join(' ')} hide-for-large\"><tbody><tr><td height=\"#{size_sm}px\" style=\"font-size:#{size_sm}px;line-height:#{size_sm}px;\">&#xA0;</td></tr></tbody></table>"
+      end
+      if size_lg
+        html += "<table class=\"#{classes.join(' ')} show-for-large\"><tbody><tr><td height=\"#{size_lg}px\" style=\"font-size:#{size_lg}px;line-height:#{size_lg}px;\">&#xA0;</td></tr></tbody></table>"
+      end
+      if size_sm && size_lg
+        # REXML doesn't like replacing a single element with a double
+        html = "<span>#{html}</span>"
+      end
+      return html
+    else
+      size ||= 16
+      return "<table class=\"#{classes.join(' ')}\"><tbody><tr><td height=\"#{size}px\" style=\"font-size:#{size}px;line-height:#{size}px;\">&#xA0;</td></tr></tbody></table>"
+    end
   end
 
   def _transform_wrapper(component, inner)

data/lib/inky.rb

@@ -31,11 +31,13 @@ module Inky
 
     def release_the_kraken(xml_string)
       xml_string = xml_string.gsub(/doctype/i, 'DOCTYPE')
-      xml_doc = REXML::Document.new(xml_string)
+      raws, str = Inky::Core.extract_raws(xml_string)
+      xml_doc = REXML::Document.new(str)
       if self.components_exist?(xml_doc)
         self.transform_doc(xml_doc.root)
       end
-      return xml_doc.to_s
+      str = xml_doc.to_s
+      return Inky::Core.re_inject_raws(str, raws)
     end
 
 
@@ -53,6 +55,27 @@ module Inky
       end
       elem
     end
+
+    def self.extract_raws(string)
+      raws = []
+      i = 0
+      regex = /\< *raw *\>(.*?)\<\/ *raw *\>/i;
+      str = string
+      while raw = str.match(regex)
+        raws[i] = raw[1]
+        str = str.sub(regex, "###RAW#{i}###")
+        i = i + 1
+      end
+      return [raws, str]
+     end
+
+    def self.re_inject_raws(string, raws)
+      str = string
+      raws.each_with_index do |val, i|
+        str = str.sub("###RAW#{i}###", val)
+      end
+      return str
+    end
   end
 end
 begin

data/lib/inky/rails/version.rb

@@ -1,5 +1,5 @@
 module Inky
   module Rails
-    VERSION="0.0.1"
+    VERSION="0.0.3"
   end
 end

data/spec/components_spec.rb

@@ -69,6 +69,25 @@ RSpec.describe "Button" do
     HTML
     compare(input, expected);
   end
+
+  it 'creates a button with target="_blank" attribute' do
+    input = '<button href="http://zurb.com" target="_blank">Button</button>'
+    expected = <<-HTML
+      <table class="button">
+        <tr>
+          <td>
+            <table>
+              <tr>
+                <td><a href="http://zurb.com" target="_blank">Button</a></td>
+              </tr>
+            </table>
+          </td>
+        </tr>
+      </table>
+    HTML
+    compare(input, expected)
+  end
+
   it 'creates a button with classes' do
     input = '<button class="small alert" href="http://zurb.com">Button</button>'
     expected = <<-HTML
@@ -135,6 +154,29 @@ RSpec.describe "Menu" do
     compare(input, expected)
   end
 
+  it 'creates a menu with items tags inside, containing target="_blank" attribute' do
+    input = <<-INKY
+      <menu>
+        <item href="http://zurb.com" target="_blank">Item</item>
+      </menu>
+    INKY
+    expected = <<-HTML
+      <table class="menu">
+        <tr>
+          <td>
+            <table>
+              <tr>
+                <th class="menu-item"><a href="http://zurb.com" target="_blank">Item</a></th>
+              </tr>
+            </table>
+          </td>
+        </tr>
+      </table>
+    HTML
+
+    compare(input, expected)
+  end
+
   it 'creates a menu with classes' do
     input = <<-INKY
       <menu class="vertical">
@@ -225,7 +267,61 @@ RSpec.describe "Spacer" do
 
     compare(input, expected);
   end
-  
+
+  it 'creates a spacer element for small screens with correct size' do
+    input = '<spacer size-sm="10"></spacer>'
+    expected = <<-HTML
+      <table class="spacer hide-for-large">
+        <tbody>
+          <tr>
+            <td height="10px" style="font-size:10px;line-height:10px;">&#xA0;</td>
+          </tr>
+        </tbody>
+      </table>
+    HTML
+
+    compare(input, expected)
+  end
+
+  it 'creates a spacer element for large screens with correct size' do
+    input = '<spacer size-lg="20"></spacer>'
+    expected = <<-HTML
+      <table class="spacer show-for-large">
+        <tbody>
+          <tr>
+            <td height="20px" style="font-size:20px;line-height:20px;">&#xA0;</td>
+          </tr>
+        </tbody>
+      </table>
+    HTML
+
+    compare(input, expected)
+  end
+
+  it 'creates a spacer element for small and large screens with correct sizes' do
+    input = '<spacer size-sm="10" size-lg="20"></spacer>'
+    expected = <<-HTML
+      <span>
+        <table class="spacer hide-for-large">
+          <tbody>
+            <tr>
+              <td height="10px" style="font-size:10px;line-height:10px;">&#xA0;</td>
+            </tr>
+          </tbody>
+        </table>
+        <table class="spacer show-for-large">
+          <tbody>
+            <tr>
+              <td height="20px" style="font-size:20px;line-height:20px;">&#xA0;</td>
+            </tr>
+          </tbody>
+        </table>
+      </span>
+    HTML
+
+    compare(input, expected)
+  end
+
   it 'copies classes to the final spacer HTML' do
     input = '<spacer size="10" class="bgcolor"></spacer>'
     expected = <<-HTML
@@ -256,3 +352,15 @@ RSpec.describe "Wrapper" do
     compare(input, expected);
   end
 end
+
+RSpec.describe "raw" do
+  it 'creates a wrapper that ignores anything inside' do
+    input = "<raw><<LCG Program\TG LCG Coupon Code Default='246996'>></raw>"
+    expected = "<<LCG Program\TG LCG Coupon Code Default='246996'>>"
+
+    # Can't do vanilla compare because the second will fail to parse
+    inky = Inky::Core.new
+    output = inky.release_the_kraken(input)
+    expect(output).to eql(expected)
+  end
+end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: inky-rb
 version: !ruby/object:Gem::Version
-  version: 0.0.2
+  version: 0.0.3
 platform: ruby
 authors:
 - ZURB
@@ -64,8 +64,8 @@ files:
 - ".gitignore"
 - Gemfile
 - Gemfile.lock
+- README.md
 - Rakefile
-- inky-0.0.0.gem
 - inky.gemspec
 - lib/component_factory.rb
 - lib/inky.rb
@@ -94,7 +94,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.4.5.1
+rubygems_version: 2.6.4
 signing_key: 
 specification_version: 4
 summary: Inky is an HTML-based templating language that converts simple HTML into