get image tag attributes rollin
This commit is contained in:
@@ -150,12 +150,14 @@ frame.
|
|||||||
[[gollum.png|frame|alt=Gollum and his precious wiki]]
|
[[gollum.png|frame|alt=Gollum and his precious wiki]]
|
||||||
|
|
||||||
To specify the alignment of the image on the page, use the `align=` option.
|
To specify the alignment of the image on the page, use the `align=` option.
|
||||||
Possible values are `left`, `center`, and `right`. Default is `center`.
|
Possible values are `left`, `center`, and `right`. Default is `left`.
|
||||||
|
|
||||||
[[gollum.png|align=center]]
|
[[gollum.png|align=center]]
|
||||||
|
|
||||||
To float an image so that text flows around it, use the `float` option.
|
To float an image so that text flows around it, use the `float` option. When
|
||||||
Default is not floating.
|
`float` is specified, only `left` and `right` are valid `align` options.
|
||||||
|
Default is not floating. When floating is activated but no alignment is
|
||||||
|
specified, default aligntment is `left`.
|
||||||
|
|
||||||
[[gollum.png|float]]
|
[[gollum.png|float]]
|
||||||
|
|
||||||
|
|||||||
+34
-8
@@ -80,19 +80,28 @@ module Gollum
|
|||||||
if file = find_file(name)
|
if file = find_file(name)
|
||||||
opts = parse_image_tag_options(tag)
|
opts = parse_image_tag_options(tag)
|
||||||
|
|
||||||
attrs = []
|
floated = false
|
||||||
styles = []
|
|
||||||
|
classes = [] # applied to whatever the outermost container is
|
||||||
|
attrs = [] # applied to the image
|
||||||
|
styles = [] # applied to the image
|
||||||
|
|
||||||
if opts['float']
|
if opts['float']
|
||||||
if align = opts['align']
|
floated = true
|
||||||
styles << "float: #{align};"
|
align = opts['align'] || 'left'
|
||||||
else
|
if %w{left right}.include?(align)
|
||||||
attrs << %{align="#{align}"}
|
classes << "float-#{align};"
|
||||||
|
end
|
||||||
|
elsif %w{top texttop middle absmiddle bottom absbottom baseline}.include?(align)
|
||||||
|
attrs << "align=#{align}"
|
||||||
|
elsif align = opts['align']
|
||||||
|
if %w{left center right}.include?(align)
|
||||||
|
classes << "align-#{align}"
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
if width = opts['width']
|
if width = opts['width']
|
||||||
if height =~ /^\d+(\.\d+)?(em|px)$/
|
if width =~ /^\d+(\.\d+)?(em|px)$/
|
||||||
styles << "max-width: #{width};"
|
styles << "max-width: #{width};"
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
@@ -109,7 +118,24 @@ module Gollum
|
|||||||
|
|
||||||
attr_string = attrs.size > 0 ? attrs.join(' ') + ' ' : ''
|
attr_string = attrs.size > 0 ? attrs.join(' ') + ' ' : ''
|
||||||
|
|
||||||
%{<img src="/#{file.path}" #{attr_string}/>}
|
style_string =
|
||||||
|
if styles.empty?
|
||||||
|
''
|
||||||
|
else
|
||||||
|
%{ style="#{styles.join(' ')}"}
|
||||||
|
end
|
||||||
|
|
||||||
|
if opts['frame'] || floated
|
||||||
|
classes << 'frame' if opts['frame']
|
||||||
|
%{<div class="#{classes.join(' ')}">} +
|
||||||
|
%{<div>} +
|
||||||
|
%{<img src="/#{file.path}"#{style_string} #{attr_string}/>} +
|
||||||
|
(alt ? %{<p>#{alt}</p>} : '') +
|
||||||
|
%{</div>} +
|
||||||
|
%{</div>}
|
||||||
|
else
|
||||||
|
%{<img src="/#{file.path}"#{style_string} #{attr_string}/>}
|
||||||
|
end
|
||||||
end
|
end
|
||||||
end
|
end
|
||||||
|
|
||||||
|
|||||||
@@ -52,6 +52,42 @@ context "Markup" do
|
|||||||
relative_image(content, output)
|
relative_image(content, output)
|
||||||
end
|
end
|
||||||
|
|
||||||
|
test "image with em or px dimension" do
|
||||||
|
%w{em px}.each do |unit|
|
||||||
|
%w{width height}.each do |dim|
|
||||||
|
content = "a [[alpha.jpg|#{dim}=100#{unit}]] b"
|
||||||
|
output = "<p>a <img src=\"/greek/alpha.jpg\" style=\"max-#{dim}: 100#{unit};\" /> b</p>\n"
|
||||||
|
relative_image(content, output)
|
||||||
|
end
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
|
test "image with bogus dimension" do
|
||||||
|
%w{width height}.each do |dim|
|
||||||
|
content = "a [[alpha.jpg|#{dim}=100]] b"
|
||||||
|
output = "<p>a <img src=\"/greek/alpha.jpg\" /> b</p>\n"
|
||||||
|
relative_image(content, output)
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
|
test "image with float" do
|
||||||
|
content = "a\n\n[[alpha.jpg|float]]\n\nb"
|
||||||
|
output = "<p>a</p>\n\n<p><div class=\"float-left;\"><div><img src=\"/greek/alpha.jpg\" /></div></div></p>\n\n<p>b</p>\n"
|
||||||
|
relative_image(content, output)
|
||||||
|
end
|
||||||
|
|
||||||
|
test "image with frame" do
|
||||||
|
content = "a\n\n[[alpha.jpg|frame]]\n\nb"
|
||||||
|
output = "<p>a</p>\n\n<p><div class=\"frame\"><div><img src=\"/greek/alpha.jpg\" /></div></div></p>\n\n<p>b</p>\n"
|
||||||
|
relative_image(content, output)
|
||||||
|
end
|
||||||
|
|
||||||
|
test "image with frame and alt" do
|
||||||
|
content = "a\n\n[[alpha.jpg|frame|alt=Alpha]]\n\nb"
|
||||||
|
output = "<p>a</p>\n\n<p><div class=\"frame\"><div><img src=\"/greek/alpha.jpg\" alt=\"Alpha\" /><p>Alpha</p></div></div></p>\n\n<p>b</p>\n"
|
||||||
|
relative_image(content, output)
|
||||||
|
end
|
||||||
|
|
||||||
test "file link with absolute path" do
|
test "file link with absolute path" do
|
||||||
index = @wiki.repo.index
|
index = @wiki.repo.index
|
||||||
index.add("alpha.jpg", "hi")
|
index.add("alpha.jpg", "hi")
|
||||||
|
|||||||
Reference in New Issue
Block a user