get image tag attributes rollin

README.md

@@ -150,12 +150,14 @@ frame.
     [[gollum.png|frame|alt=Gollum and his precious wiki]]
 
 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]]
 
-To float an image so that text flows around it, use the `float` option.
-Default is not floating.
+To float an image so that text flows around it, use the `float` option. When
+`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]]
 

lib/gollum/markup.rb

@@ -80,19 +80,28 @@ module Gollum
       if file = find_file(name)
         opts = parse_image_tag_options(tag)
 
-        attrs = []
-        styles = []
+        floated = false
+
+        classes = [] # applied to whatever the outermost container is
+        attrs = []   # applied to the image
+        styles = []  # applied to the image
 
         if opts['float']
-          if align = opts['align']
-            styles << "float: #{align};"
-          else
-            attrs << %{align="#{align}"}
+          floated = true
+          align = opts['align'] || 'left'
+          if %w{left right}.include?(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
 
         if width = opts['width']
-          if height =~ /^\d+(\.\d+)?(em|px)$/
+          if width =~ /^\d+(\.\d+)?(em|px)$/
             styles << "max-width: #{width};"
           end
         end
@@ -109,7 +118,24 @@ module Gollum
 
         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
 

test/test_markup.rb

@@ -52,6 +52,42 @@ context "Markup" do
     relative_image(content, output)
   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
     index = @wiki.repo.index
     index.add("alpha.jpg", "hi")