Now processing liquid variables in tag. Fixes #1

Author: imathis

CHANGELOG.md

@@ -0,0 +1,7 @@
+# Changelog
+
+### 1.1.0 (2015-01-07)
+- New: Liquid can be processed in tag.
+
+### 1.0.0 (2015-01-07)
+- Initial release

README.md

@@ -32,20 +32,21 @@ Then add the gem to your Jekyll configuration.
 ```
 
 Examples:
+
 ```
 {% img /images/ninja.png "Ninja Attack!" %}
 {% img left half http://site.com/images/ninja.png title:"Hidden Ninja" %}
-{% img http://site.com/images/ninja.png 150px 150px %}
+{% img {{ site.cdn }}/images/ninja.png 150px 150px %}
 ```
 
 Output:
+
 ```
 <img src="/images/ninja.png" alt="Ninja Attack!" >
 <img class="left half" src="http://site.com/images/ninja.png" alt="Hidden Ninja" title="Hidden Ninja" >
-<img src="http://site.com/images/ninja.png" width="150px" height="150px" alt="Ninja in the shadows" title="Hidden Ninja">
+<img src="http://some.cdn.io/images/ninja.png" width="150px" height="150px" alt="Ninja in the shadows" title="Hidden Ninja">
 ```
 
-
 ## Contributing
 
 1. Fork it ( https://github.com/[my-github-username]/image-tag/fork )

lib/octopress-image-tag.rb

@@ -12,38 +12,52 @@ class Tag < Liquid::Tag
         @img = nil
 
         def initialize(tag_name, markup, tokens)
-          if markup =~ /title:['|"](.+?)['|"]/
-            @title = $1.strip
+          @markup = markup
+          super
+        end
+
+        def render(context)
+          begin
+            attributes = image(context).collect do |k,v|
+              "#{k}=\"#{v}\"" if v
+            end.join(" ")
+
+            "<img #{attributes}>"
+          rescue
+            raise "Error processing input, expected syntax: {% img [class name(s)] [http[s]:/]/path/to/image [width [height]] [title text | \"title text\" [\"alt text\"]] %}"
           end
+        end
 
-          markup = markup.gsub(/title:['|"].+?['|"]/, '').strip
+        def image(context)
+          @markup = process_liquid(context)
 
-          if markup =~ /(?<class>\S.*\s+)?(?<src>(?:https?:\/\/|\/|\S+\/)\S+)(?:\s+(?<width>\d\S+))?(?:\s+(?<height>\d\S+))?(?<alt>\s+.+)?/i
+          title = /title:['|"](.+?)['|"]/
+          @title = @markup.scan(title).flatten.compact.last
+          @markup.gsub!(title, '')
+
+          if @markup =~ /(?<class>\S.*\s+)?(?<src>(?:https?:\/\/|\/|\S+\/)\S+)(?:\s+(?<width>\d\S+))?(?:\s+(?<height>\d\S+))?(?<alt>\s+.+)?/i
             attributes = ['class', 'src', 'width', 'height', 'alt']
-            @img = attributes.reduce({}) { |img, attr| img[attr] ||= $~[attr].strip if $~[attr]; img }
-            text = @img['alt']
+            image = attributes.reduce({}) { |img, attr| img[attr] ||= $~[attr].strip if $~[attr]; img }
+            text = image['alt']
 
             # Allow parsing "title" "alt"
             if text =~ /(?:"|')(?<title>[^"']+)?(?:"|')\s+(?:"|')(?<alt>[^"']+)?(?:"|')/
-              @img['title']  = title
-              @img['alt']    = alt
+              image['title']  = title
+              image['alt']    = alt
             else
               # Set alt text and title from text
-              @img['alt'].gsub!(/"/, '') if @img['alt']
+              image['alt'].gsub!(/"/, '') if image['alt']
             end
           end
 
-          @img['title'] ||= @title
-          @img['alt'] ||= @title
-          super
+          image['title'] ||= @title
+          image['alt'] ||= @title
+
+          image
         end
 
-        def render(context)
-          if @img
-            "<img #{@img.collect {|k,v| "#{k}=\"#{v}\"" if v}.join(" ")}>"
-          else
-            "Error processing input, expected syntax: {% img [class name(s)] [http[s]:/]/path/to/image [width [height]] [title text | \"title text\" [\"alt text\"]] %}"
-          end
+        def process_liquid(context)
+          Liquid::Template.parse(@markup).render!(context.environments.first)
         end
       end
     end

lib/octopress-image-tag/version.rb

@@ -1,7 +1,7 @@
 module Octopress
   module Tags
     module ImageTag
-      VERSION = "1.0.0"
+      VERSION = "1.1.0"
     end
   end
 end

test/_config.yml

@@ -1,2 +1,3 @@
 gems:
   - octopress-image-tag
+images_dir: /images

test/index.html

@@ -1,7 +1,7 @@
 ---
 ---
 
-{% img /images/ninja.png "Ninja Attack!" %}
+{% img {{ site.images_dir }}/ninja.png "Ninja Attack!" %}
 {% img left half http://site.com/images/ninja.png "Ninja in the shadows" %}
 {% img http://site.com/images/ninja.png 150px 150px "Ninja in the shadows" title:"Hidden Ninja" %}