Makes img tag more flexible, adds support for relative paths. Includes pull request #145, fixes #161
This commit is contained in:
parent
8c5ce51b3f
commit
50eaf98c24
@ -1,46 +1,47 @@
|
||||
# Title: Simple Image tag for Jekyll
|
||||
# Author: Brandon Mathis http://brandonmathis.com
|
||||
# Description: Easily output images with optional class names and title/alt attributes
|
||||
# Authors: Brandon Mathis http://brandonmathis.com
|
||||
# Felix Schäfer, Frederic Hemberger
|
||||
# Description: Easily output images with optional class names, width, height, title and alt attributes
|
||||
#
|
||||
# Syntax {% image [class name(s)] url [title text] %}
|
||||
# Syntax {% img [class name(s)] [http[s]:/]/path/to/image [width [height]] [title text | "title text" ["alt text"]] %}
|
||||
#
|
||||
# Example:
|
||||
# {% ima left half http://site.com/images/ninja.png Ninja Attack! %}
|
||||
# Examples:
|
||||
# {% img /images/ninja.png Ninja Attack! %}
|
||||
# {% img left half http://site.com/images/ninja.png Ninja Attack! %}
|
||||
# {% img left half http://site.com/images/ninja.png 150 150 "Ninja Attack!" "Ninja in attack posture" %}
|
||||
#
|
||||
# Output:
|
||||
# <image class='left' src="http://site.com/images/ninja.png" title="Ninja Attack!" alt="Ninja Attack!">
|
||||
# <img src="/images/ninja.png">
|
||||
# <img class="left half" src="http://site.com/images/ninja.png" title="Ninja Attack!" alt="Ninja Attack!">
|
||||
# <img class="left half" src="http://site.com/images/ninja.png" width="150" height="150" title="Ninja Attack!" alt="Ninja in attack posture">
|
||||
#
|
||||
|
||||
module Jekyll
|
||||
|
||||
class ImageTag < Liquid::Tag
|
||||
@img = nil
|
||||
@title = nil
|
||||
@class = ''
|
||||
@width = ''
|
||||
@height = ''
|
||||
|
||||
def initialize(tag_name, markup, tokens)
|
||||
if markup =~ /(\S.*\s+)?(https?:\/\/|\/)(\S+)(\s+\d+\s+\d+)?(\s+.+)?/i
|
||||
@class = $1 || ''
|
||||
@img = $2 + $3
|
||||
if $5
|
||||
@title = $5.strip
|
||||
end
|
||||
if $4 =~ /\s*(\d+)\s+(\d+)/
|
||||
@width = $1
|
||||
@height = $2
|
||||
attributes = ['class', 'src', 'width', 'height', 'title']
|
||||
|
||||
if markup =~ /(?<class>\S.*\s+)?(?<src>(?:https?:\/\/|\/|\S+\/)\S+)(?:\s+(?<width>\d+))?(?:\s+(?<height>\d+))?(?<title>\s+.+)?/i
|
||||
@img = attributes.reduce({}) { |img, attr| img[attr] = $~[attr].strip if $~[attr]; img }
|
||||
if @img['title'] =~ /(?:"|')([^"']+)?(?:"|')\s+(?:"|')([^"']+)?(?:"|')/
|
||||
@img['title'] = $1
|
||||
@img['alt'] = $2
|
||||
else
|
||||
@img['alt'] = @img['title'].gsub!(/"/, '')
|
||||
end
|
||||
@img['class'].gsub!(/"/, '')
|
||||
end
|
||||
super
|
||||
end
|
||||
|
||||
def render(context)
|
||||
output = super
|
||||
if @img
|
||||
"<img class='#{@class}' src='#{@img}' width='#{@width}' height='#{@height}' alt='#{@title}' title='#{@title}'>"
|
||||
"<img #{@img.collect {|k,v| "#{k}=\"#{v}\"" if v}.join(" ")}>"
|
||||
else
|
||||
"Error processing input, expected syntax: {% img [class name(s)] /url/to/image [width height] [title text] %}"
|
||||
"Error processing input, expected syntax: {% img [class name(s)] [http[s]:/]/path/to/image [width [height]] [title text | \"title text\" [\"alt text\"]] %}"
|
||||
end
|
||||
end
|
||||
end
|
||||
|
Loading…
Reference in New Issue
Block a user