sprite-factory 1.4.2 → 1.5.0

data/.gitignore

@@ -1,3 +1,4 @@
+*~
 *.gem
 .bundle
 Gemfile.lock

data/README.md

@@ -1,4 +1,4 @@
-Sprite Factory (v1.4.2)
+Sprite Factory (v1.5.0)
 =======================
 
 The sprite factory is a ruby library that can be used to generate
@@ -13,6 +13,7 @@ The library provides:
  * support for multiple layout algorithms - horizontal, vertical or [packed](http://codeincomplete.com/posts/2011/5/7/bin_packing/)
  * support for any stylesheet syntax, including [CSS](http://www.w3.org/Style/CSS/) and [Sass](http://sass-lang.com/).
  * support for any image library, including [RMagick](http://rmagick.rubyforge.org/) and [ChunkyPNG](https://github.com/wvanbergen/chunky_png).
+ * support for any css selector style, including :hover pseudo-class selectors
  * support for pngcrush'n the generated image file
  * compatible with Rails 3.1 asset pipeline
 
@@ -92,6 +93,7 @@ Much of the behavior can be customized by overriding the following options:
  - `:output_style` - specify output location for generated stylesheet (default: <input folder>.<style>)
  - `:pngcrush`     - pngcrush the generated output image (if pngcrush is available)
  - `:padding`      - add padding to each sprite
+ - `:margin`       - add margin to each sprite
  - `:width`        - fix width of each sprite to a specific size
  - `:height`       - fix height of each sprite to a specific size
  - `:nocss`        - suppress generation of output stylesheet (`run!` returns css content as a string instead)
@@ -109,7 +111,13 @@ You can see the results of many of these options by viewing the sample page that
 comes with the gem in `test/images/reference/index.html`.
 
 >> NOTE: only the common options are available via the command line script (to keep it simple). Specifically,
-the advanced `width`, `height`, `padding` and `nocss` options are only available via the Ruby interface.
+the advanced `width`, `height`, `padding`, `margin` and `nocss` options are only available via the Ruby interface.
+
+>> NOTE: the `width`, `height` and `padding` options are not particularly useful - you would be better off just
+making your source images have the correct dimensions by editing them appropriately in photoshop (or your editor of choice)
+
+>> NOTE: the `margin` option is used primarily to buffer each image in the generated sprite with > 1px margin to
+avoid images bleeding into each other when the browser needs to scale them (e.g. when user increases/decreases font size).
 
 Layout
 ======
@@ -129,7 +137,17 @@ Customizing the CSS Selector
 
 By default, the CSS generated is fairly simple. It assumes you will be using `<img>`
 elements for your sprites, and that the basename of each individual file is suitable for
-use as a CSS classname. For example:
+use as a CSS classname. For example, the following files:
+
+    images/icons/high.png
+    images/icons/medium.png
+    images/icons/low.png
+
+... when run with:
+
+    SpriteFactory.run!('images/icons')
+
+... will generate the following css:
 
     img.high   { width: 16px; height: 16px; background: url(images/icons.png)   0px 0px no-repeat; }
     img.medium { width: 16px; height: 16px; background: url(images/icons.png) -16px 0px no-repeat; }
@@ -140,12 +158,47 @@ example:
 
     SpriteFactory.run!('images/icons', :selector => 'span.icon_')
 
-will generate:
+... will generate:
 
     span.icon_high   { width: 16px; height: 16px; background: url(images/icons.png)   0px 0px no-repeat; }
     span.icon_medium { width: 16px; height: 16px; background: url(images/icons.png) -16px 0px no-repeat; }
     span.icon_low    { width: 16px; height: 16px; background: url(images/icons.png) -32px 0px no-repeat; }
 
+Customizing the CSS Selector Per Image
+======================================
+
+If you want to specify a custom selector for each individual image, then name the image files
+accordingly - the library will map '\_\_' (double underscore) to a single space ' ' in any source
+image filename. For example:
+
+    images/icons/div.foo__span.icon_alert.png
+    images/icons/div.bar__span.icon_alert.png
+
+... when run with:
+
+    SpriteFactory.run!('images/icons', :selector => 'div.example ')
+
+... will generate:
+
+    div.example div.foo span.icon_alert { ... first file   ... }
+    div.example div.bar span.icon_alert { ... second file  ... }
+    
+
+If you want to specify a psuedo class such as `:hover` for some of your images, the library will also
+map '--' (double dash) to a colon ':' in any source image filename. For example:
+
+    images/icons/alert.png
+    images/icons/alert--hover.png
+
+... when run with:
+
+    SpriteFactory.run!('images/icons', :selector => 'span.icon_')
+
+... will generate:
+
+    span.icon_alert       { ... first file  ... }
+    span.icon_alert:hover { ... second file ... }
+
 Customizing the CSS Image Path
 ==============================
 
@@ -210,7 +263,7 @@ value is a hash of image metadata that includes the following:
  * `:width`  - the image width
  * `:height` - the image height
 
-(*NOTE*: the image coords can differ form the css sprite coords when padding or fixed width/height options are specified)
+(*NOTE*: the image coords can differ form the css sprite coords when padding/margin or fixed width/height options are specified)
 
 Using sprite-factory with the Rails 3.1 asset pipeline
 ======================================================

data/RELEASE_NOTES.md

@@ -1,6 +1,13 @@
-
-UNRELEASED - v1.4.2
--------------------
+May 10th 2012 - v1.5.0
+----------------------
+ * @halida added a new `margin` option to (optionally) separate images in generated spritesheet to avoid 'bleeding' when browser scales the sprite (e.g. when user increases text size)
+ * added `padding` support for `packed` layout
+ * added `margin` support for `packed` layout
+ * added support for using source image filename as automatic css selector [issue #12](https://github.com/jakesgordon/sprite-factory/issues/12)
+ * added support for `:hover` (and other pseudo-class) selectors [issue #14](https://github.com/jakesgordon/sprite-factory/issues/14)
+
+February 29th 2012 - v1.4.2
+---------------------------
  * added support for `:nocomments => true` to suppress comments in generated output stylesheet
  * added support for images in subfolders - fixes [github issue #11](https://github.com/jakesgordon/sprite-factory/issues/11)
 

data/Rakefile

@@ -31,19 +31,23 @@ task :reference do
   regenerate.call('test/images/regular')
   regenerate.call('test/images/regular', :output => 'test/images/regular.horizontal', :selector => 'img.horizontal_', :layout => :horizontal)
   regenerate.call('test/images/regular', :output => 'test/images/regular.vertical',   :selector => 'img.vertical_',   :layout => :vertical)
-  regenerate.call('test/images/regular', :output => 'test/images/regular.packed',     :selector => 'img.packed_',     :layout => :packed)
+  regenerate.call('test/images/regular', :output => 'test/images/regular.packed',     :selector => 'img.packed_',     :layout => :packed, :padding => 10, :margin => 10)
   regenerate.call('test/images/regular', :output => 'test/images/regular.padded',     :selector => 'img.padded_',     :padding => 10)
+  regenerate.call('test/images/regular', :output => 'test/images/regular.margin',     :selector => 'img.margin_',     :margin => 10)
   regenerate.call('test/images/regular', :output => 'test/images/regular.fixed',      :selector => 'img.fixed_',      :width => 100, :height => 100)
   regenerate.call('test/images/regular', :output => 'test/images/regular.sassy',      :selector => 'img.sassy_',      :style => :sass)
 
   regenerate.call('test/images/irregular')
   regenerate.call('test/images/irregular', :output => 'test/images/irregular.horizontal', :selector => 'img.horizontal_', :layout => :horizontal)
   regenerate.call('test/images/irregular', :output => 'test/images/irregular.vertical',   :selector => 'img.vertical_',   :layout => :vertical)
-  regenerate.call('test/images/irregular', :output => 'test/images/irregular.packed',     :selector => 'img.packed_',     :layout => :packed)
+  regenerate.call('test/images/irregular', :output => 'test/images/irregular.packed',     :selector => 'img.packed_',     :layout => :packed, :padding => 10, :margin => 10)
   regenerate.call('test/images/irregular', :output => 'test/images/irregular.padded',     :selector => 'img.padded_',     :padding => 10)
+  regenerate.call('test/images/irregular', :output => 'test/images/irregular.margin',     :selector => 'img.margin_',     :margin => 10)
   regenerate.call('test/images/irregular', :output => 'test/images/irregular.fixed',      :selector => 'img.fixed_',      :width => 100, :height => 100)
   regenerate.call('test/images/irregular', :output => 'test/images/irregular.sassy',      :selector => 'img.sassy_',      :style => :sass)
 
+  regenerate.call('test/images/hover', :output => 'test/images/hover', :selector => 'div.hover ', :style => :css)
+
   regenerate.call('test/images/custom', :output => 'test/images/custom') do |images|
     rules = []
     rules << "div.running img.button { cursor: pointer; #{images[:running][:style]} }"

data/lib/sprite_factory.rb

@@ -2,7 +2,7 @@ module SpriteFactory
   
   #----------------------------------------------------------------------------
 
-  VERSION     = "1.4.2"
+  VERSION     = "1.5.0"
   SUMMARY     = "Automatic CSS sprite generator"
   DESCRIPTION = "Combines individual images from a directory into a single sprite image file and creates an appropriate CSS stylesheet"
   LIB         = File.dirname(__FILE__)

data/lib/sprite_factory/layout/horizontal.rb

@@ -7,7 +7,9 @@ module SpriteFactory
         height     = options[:height]
         hpadding   = options[:hpadding] || 0
         vpadding   = options[:vpadding] || 0
-        max_height = height || ((2 * vpadding) + images.map{|i| i[:height]}.max)
+        hmargin    = options[:hmargin]  || 0
+        vmargin    = options[:vmargin]  || 0
+        max_height = height || (2 *(vpadding + vmargin) + images.map{|i| i[:height]}.max)
         x = 0
         images.each do |i|
 
@@ -17,8 +19,8 @@ module SpriteFactory
             i[:x]    = x + (width - i[:width]) / 2
           else
             i[:cssw] = i[:width]  + (2 * hpadding)   # image width plus padding
-            i[:cssx] = x                             # anchored at x
-            i[:x] = i[:cssx] + hpadding              # image drawn offset to account for padding
+            i[:cssx] = x + hmargin                   # anchored at x
+            i[:x]    = i[:cssx] + hpadding           # image drawn offset to account for padding
           end
 
           if height
@@ -31,7 +33,7 @@ module SpriteFactory
             i[:y]    = i[:cssy] + vpadding           # image drawn offset to account for padding
           end
 
-          x = x + i[:cssw]
+          x += i[:cssw] + 2 * hmargin
 
         end 
         { :width  => x, :height => max_height }

data/lib/sprite_factory/layout/packed.rb

@@ -6,27 +6,36 @@ module SpriteFactory
 
       def self.layout(images, options = {})
 
-        raise NotImplementedError, ":packed layout does not support the :padding option" if (options[:padding].to_i > 0) || (options[:hpadding].to_i > 0) || (options[:vpadding].to_i > 0)
         raise NotImplementedError, ":packed layout does not support fixed :width/:height option" if options[:width] || options[:height]
 
         return { :width => 0, :height => 0 } if images.empty?
 
+        hpadding = options[:hpadding] || 0
+        vpadding = options[:vpadding] || 0
+        hmargin  = options[:hmargin]  || 0
+        vmargin  = options[:vmargin]  || 0
+
+        images.each do |i|
+          i[:w] = i[:width]  + (2*hpadding) + (2*hmargin)
+          i[:h] = i[:height] + (2*vpadding) + (2*vmargin)
+        end
+
         images.sort! do |a,b|
-          diff = [b[:width], b[:height]].max <=> [a[:width], a[:height]].max
-          diff = [b[:width], b[:height]].min <=> [a[:width], a[:height]].min if diff.zero?
-          diff = b[:height] <=> a[:height] if diff.zero?
-          diff = b[:width]  <=> a[:width]  if diff.zero?
+          diff = [b[:w], b[:h]].max <=> [a[:w], a[:h]].max
+          diff = [b[:w], b[:h]].min <=> [a[:w], a[:h]].min if diff.zero?
+          diff = b[:h] <=> a[:h] if diff.zero?
+          diff = b[:w]  <=> a[:w]  if diff.zero?
           diff
         end
 
-        root = { :x => 0, :y => 0, :w => images[0][:width], :h => images[0][:height] }
+        root = { :x => 0, :y => 0, :w => images[0][:w], :h => images[0][:h] }
 
         images.each do |i|
-          if (node = findNode(root, i[:width], i[:height]))
-            placeImage(i, node)
-            splitNode(node, i[:width], i[:height])
+          if (node = findNode(root, i[:w], i[:h]))
+            placeImage(i, node, hpadding, vpadding, hmargin, vmargin)
+            splitNode(node, i[:w], i[:h])
           else
-            root = grow(root, i[:width], i[:height])
+            root = grow(root, i[:w], i[:h])
             redo
           end
         end
@@ -35,11 +44,13 @@ module SpriteFactory
 
       end
 
-      def self.placeImage(image, node)
-        image[:cssx] = image[:x] = node[:x]  # TODO
-        image[:cssy] = image[:y] = node[:y]  #   * support for :padding option
-        image[:cssw] = image[:width]         #   * support for fixed :width/:height option
-        image[:cssh] = image[:height]
+      def self.placeImage(image, node, hpadding, vpadding, hmargin, vmargin)
+        image[:cssx] = node[:x] + hmargin
+        image[:cssy] = node[:y] + vmargin
+        image[:cssw] = image[:width]  + (2*hpadding)
+        image[:cssh] = image[:height] + (2*vpadding)
+        image[:x]    = image[:cssx] + hpadding 
+        image[:y]    = image[:cssy] + vpadding
       end
 
       def self.findNode(root, w, h)

data/lib/sprite_factory/layout/vertical.rb

@@ -7,7 +7,9 @@ module SpriteFactory
         height    = options[:height]
         hpadding  = options[:hpadding] || 0
         vpadding  = options[:vpadding] || 0
-        max_width = width || ((2 * hpadding) + images.map{|i| i[:width]}.max)
+        hmargin   = options[:hmargin]  || 0
+        vmargin   = options[:vmargin]  || 0
+        max_width = width || (2 * (hpadding + hmargin) + images.map{|i| i[:width]}.max)
         y = 0
         images.each do |i|
 
@@ -26,12 +28,12 @@ module SpriteFactory
             i[:cssy] = y
             i[:y]    = y + (height - i[:height]) / 2
           else
-            i[:cssh] = i[:height] + (2 * vpadding)  # image height plus padding
-            i[:cssy] = y                            # anchored at y
-            i[:y]    = i[:cssy] + vpadding          # image drawn offset to account for padding
+            i[:cssh] = i[:height] + (2 * vpadding)   # image height plus padding
+            i[:cssy] = y + vmargin                   # anchored at y
+            i[:y]    = i[:cssy] + vpadding           # image drawn offset to account for padding
           end
 
-          y = y + i[:cssh]
+          y += i[:cssh] + 2 * vmargin
 
         end
         { :width => max_width, :height => y }

data/lib/sprite_factory/runner.rb

@@ -38,6 +38,8 @@ module SpriteFactory
 
       raise RuntimeError, "set :width for fixed width, or :hpadding for horizontal padding, but not both." if width  && !hpadding.zero?
       raise RuntimeError, "set :height for fixed height, or :vpadding for vertical padding, but not both." if height && !vpadding.zero?
+      raise RuntimeError, "set :width for fixed width, or :hmargin for horizontal margin, but not both." if width  && !hmargin.zero?
+      raise RuntimeError, "set :height for fixed height, or :vmargin for vertical margin, but not both." if height && !hmargin.zero?
 
       images = load_images
       max    = layout_images(images)
@@ -91,6 +93,14 @@ module SpriteFactory
       config[:vpadding] || config[:padding] || 0
     end
 
+    def hmargin
+      config[:hmargin] || config[:margin] || 0
+    end
+
+    def vmargin
+      config[:vmargin] || config[:margin] || 0
+    end
+
     def width
       config[:width]
     end
@@ -156,16 +166,22 @@ module SpriteFactory
       input_path = Pathname.new(input)
       images = library.load(image_files)
       images.each do |i|
-        i[:name] = Pathname.new(i[:filename]).relative_path_from(input_path).to_s.gsub(File::SEPARATOR, "_")
-        i[:ext]  = File.extname(i[:name])
-        i[:name] = i[:name][0...-i[:ext].length] unless i[:ext].empty?
-
+        i[:name], i[:ext] = map_image_filename(i[:filename], input_path)
         raise RuntimeError, "image #{i[:name]} does not fit within a fixed width of #{width}" if width && (width < i[:width])
         raise RuntimeError, "image #{i[:name]} does not fit within a fixed height of #{height}" if height && (height < i[:height])
       end
       images
     end
 
+    def map_image_filename(filename, input_path)
+      name = Pathname.new(filename).relative_path_from(input_path).to_s.gsub(File::SEPARATOR, "_")
+      name = name.gsub('--', ':')
+      name = name.gsub('__', ' ')
+      ext  = File.extname(name)
+      name = name[0...-ext.length] unless ext.empty?
+      [name, ext]
+    end
+
     def create_sprite(images, width, height)
       library.create(output_image_file, images, width, height)
       pngcrush(output_image_file)
@@ -178,7 +194,7 @@ module SpriteFactory
     end
 
     def layout_images(images)
-      layout_strategy.layout(images, :width => width, :height => height, :hpadding => hpadding, :vpadding => vpadding)
+      layout_strategy.layout(images, :width => width, :height => height, :hpadding => hpadding, :vpadding => vpadding, :hmargin => hmargin, :vmargin => vmargin)
     end
 
     #----------------------------------------------------------------------------

data/test/images/reference/hover.css

@@ -0,0 +1,22 @@
+/*
+
+        Creating a sprite from following images:
+        
+        test/images/hover/div.bar__img.icon--hover.png (18x18)
+        test/images/hover/div.bar__img.icon.png (18x18)
+        test/images/hover/div.foo__img.icon--hover.png (18x18)
+        test/images/hover/div.foo__img.icon.png (18x18)
+
+        Output files:
+          test/images/hover.png
+          test/images/hover.css
+
+        Output size:
+          72x18
+
+
+*/
+div.hover div.bar img.icon:hover { width: 18px; height: 18px; background: url(hover.png) 0px 0px no-repeat; }
+div.hover div.bar img.icon { width: 18px; height: 18px; background: url(hover.png) -18px 0px no-repeat; }
+div.hover div.foo img.icon:hover { width: 18px; height: 18px; background: url(hover.png) -36px 0px no-repeat; }
+div.hover div.foo img.icon { width: 18px; height: 18px; background: url(hover.png) -54px 0px no-repeat; }

data/test/images/reference/index.html

@@ -8,6 +8,7 @@
     <link href='regular.vertical.css'     rel='stylesheet' type='text/css' media='screen'></link>
     <link href='regular.packed.css'       rel='stylesheet' type='text/css' media='screen'></link>
     <link href='regular.padded.css'       rel='stylesheet' type='text/css' media='screen'></link> 
+    <link href='regular.margin.css'       rel='stylesheet' type='text/css' media='screen'></link>
     <link href='regular.fixed.css'        rel='stylesheet' type='text/css' media='screen'></link> 
     <link href='regular.sassy.css'        rel='stylesheet' type='text/css' media='screen'></link>
     <link href='irregular.css'            rel='stylesheet' type='text/css' media='screen'></link>
@@ -15,11 +16,13 @@
     <link href='irregular.vertical.css'   rel='stylesheet' type='text/css' media='screen'></link>
     <link href='irregular.packed.css'     rel='stylesheet' type='text/css' media='screen'></link>
     <link href='irregular.padded.css'     rel='stylesheet' type='text/css' media='screen'></link> 
+    <link href='irregular.margin.css'     rel='stylesheet' type='text/css' media='screen'></link>
     <link href='irregular.fixed.css'      rel='stylesheet' type='text/css' media='screen'></link>
     <link href='irregular.sassy.css'      rel='stylesheet' type='text/css' media='screen'></link> 
     <link href='custom.css'               rel='stylesheet' type='text/css' media='screen'></link>
     <link href='formats.css'              rel='stylesheet' type='text/css' media='screen'></link>
     <link href='subfolders.css'           rel='stylesheet' type='text/css' media='screen'></link>
+    <link href='hover.css'                rel='stylesheet' type='text/css' media='screen'></link>
     <style>
       img { border: 1px solid red; }
     </style>
@@ -47,7 +50,7 @@
     <img src='s.gif' class='vertical_regular4'><br>
     <img src='s.gif' class='vertical_regular5'><br>
 
-    <h1>Regular (packed)</h1>
+    <h1>Regular (packed with padding and margin)</h1>
     <img src='s.gif' class='packed_regular1'>
     <img src='s.gif' class='packed_regular2'>
     <img src='s.gif' class='packed_regular3'>
@@ -61,6 +64,13 @@
     <img src='s.gif' class='padded_regular4'>
     <img src='s.gif' class='padded_regular5'>
 
+    <h1>Regular (margin)</h1>
+    <img src='s.gif' class='margin_regular1'>
+    <img src='s.gif' class='margin_regular2'>
+    <img src='s.gif' class='margin_regular3'>
+    <img src='s.gif' class='margin_regular4'>
+    <img src='s.gif' class='margin_regular5'>
+
     <h1>Regular (fixed)</h1>
     <img src='s.gif' class='fixed_regular1'>
     <img src='s.gif' class='fixed_regular2'>
@@ -96,7 +106,7 @@
     <img src='s.gif' class='vertical_irregular4'><br>
     <img src='s.gif' class='vertical_irregular5'><br>
 
-    <h1>Irregular (packed)</h1>
+    <h1>Irregular (packed with padding and margin)</h1>
     <img src='s.gif' class='packed_irregular1'>
     <img src='s.gif' class='packed_irregular2'>
     <img src='s.gif' class='packed_irregular3'>
@@ -110,6 +120,13 @@
     <img src='s.gif' class='padded_irregular4'>
     <img src='s.gif' class='padded_irregular5'>
 
+    <h1>Irregular (margin)</h1>
+    <img src='s.gif' class='margin_irregular1'>
+    <img src='s.gif' class='margin_irregular2'>
+    <img src='s.gif' class='margin_irregular3'>
+    <img src='s.gif' class='margin_irregular4'>
+    <img src='s.gif' class='margin_irregular5'>
+
     <h1>Irregular (fixed)</h1>
     <img src='s.gif' class='fixed_irregular1'>
     <img src='s.gif' class='fixed_irregular2'>
@@ -144,6 +161,12 @@
     <img src='s.gif' class='usa_amy'>
     <img src='s.gif' class='usa_bob'>
 
+    <h1>With Hover State</h1>
+    <div class='hover'>
+      <div class='foo'><img src='s.gif' class='icon'></div>
+      <div class='bar'><img src='s.gif' class='icon'></div>
+    </div>
+
     <script>
       SpriteFactory = {
         toggleTimer: function() {

data/test/images/reference/irregular.margin.css

@@ -0,0 +1,24 @@
+/*
+
+        Creating a sprite from following images:
+        
+        test/images/irregular/irregular1.png (60x60)
+        test/images/irregular/irregular2.png (16x16)
+        test/images/irregular/irregular3.png (48x48)
+        test/images/irregular/irregular4.png (34x14)
+        test/images/irregular/irregular5.png (46x25)
+
+        Output files:
+          test/images/irregular.margin.png
+          test/images/irregular.margin.css
+
+        Output size:
+          304x80
+
+
+*/
+img.margin_irregular1 { width: 60px; height: 60px; background: url(irregular.margin.png) -10px -10px no-repeat; }
+img.margin_irregular2 { width: 16px; height: 16px; background: url(irregular.margin.png) -90px -32px no-repeat; }
+img.margin_irregular3 { width: 48px; height: 48px; background: url(irregular.margin.png) -126px -16px no-repeat; }
+img.margin_irregular4 { width: 34px; height: 14px; background: url(irregular.margin.png) -194px -33px no-repeat; }
+img.margin_irregular5 { width: 46px; height: 25px; background: url(irregular.margin.png) -248px -27px no-repeat; }

data/test/images/reference/irregular.packed.css

@@ -13,12 +13,12 @@
           test/images/irregular.packed.css
 
         Output size:
-          108x101
+          244x165
 
 
 */
-img.packed_irregular1 { width: 60px; height: 60px; background: url(irregular.packed.png) 0px 0px no-repeat; }
-img.packed_irregular3 { width: 48px; height: 48px; background: url(irregular.packed.png) -60px 0px no-repeat; }
-img.packed_irregular5 { width: 46px; height: 25px; background: url(irregular.packed.png) 0px -60px no-repeat; }
-img.packed_irregular4 { width: 34px; height: 14px; background: url(irregular.packed.png) -46px -60px no-repeat; }
-img.packed_irregular2 { width: 16px; height: 16px; background: url(irregular.packed.png) 0px -85px no-repeat; }
+img.packed_irregular1 { width: 80px; height: 80px; background: url(irregular.packed.png) -10px -10px no-repeat; }
+img.packed_irregular3 { width: 68px; height: 68px; background: url(irregular.packed.png) -110px -10px no-repeat; }
+img.packed_irregular5 { width: 66px; height: 45px; background: url(irregular.packed.png) -10px -110px no-repeat; }
+img.packed_irregular4 { width: 54px; height: 34px; background: url(irregular.packed.png) -96px -110px no-repeat; }
+img.packed_irregular2 { width: 36px; height: 36px; background: url(irregular.packed.png) -198px -10px no-repeat; }

data/test/images/reference/regular.margin.css

@@ -0,0 +1,24 @@
+/*
+
+        Creating a sprite from following images:
+        
+        test/images/regular/regular1.PNG (64x64)
+        test/images/regular/regular2.PNG (64x64)
+        test/images/regular/regular3.PNG (64x64)
+        test/images/regular/regular4.PNG (64x64)
+        test/images/regular/regular5.PNG (64x64)
+
+        Output files:
+          test/images/regular.margin.png
+          test/images/regular.margin.css
+
+        Output size:
+          420x84
+
+
+*/
+img.margin_regular1 { width: 64px; height: 64px; background: url(regular.margin.png) -10px -10px no-repeat; }
+img.margin_regular2 { width: 64px; height: 64px; background: url(regular.margin.png) -94px -10px no-repeat; }
+img.margin_regular3 { width: 64px; height: 64px; background: url(regular.margin.png) -178px -10px no-repeat; }
+img.margin_regular4 { width: 64px; height: 64px; background: url(regular.margin.png) -262px -10px no-repeat; }
+img.margin_regular5 { width: 64px; height: 64px; background: url(regular.margin.png) -346px -10px no-repeat; }

data/test/images/reference/regular.packed.css

@@ -13,12 +13,12 @@
           test/images/regular.packed.css
 
         Output size:
-          192x128
+          312x208
 
 
 */
-img.packed_regular1 { width: 64px; height: 64px; background: url(regular.packed.png) 0px 0px no-repeat; }
-img.packed_regular2 { width: 64px; height: 64px; background: url(regular.packed.png) -64px 0px no-repeat; }
-img.packed_regular3 { width: 64px; height: 64px; background: url(regular.packed.png) 0px -64px no-repeat; }
-img.packed_regular4 { width: 64px; height: 64px; background: url(regular.packed.png) -64px -64px no-repeat; }
-img.packed_regular5 { width: 64px; height: 64px; background: url(regular.packed.png) -128px 0px no-repeat; }
+img.packed_regular1 { width: 84px; height: 84px; background: url(regular.packed.png) -10px -10px no-repeat; }
+img.packed_regular2 { width: 84px; height: 84px; background: url(regular.packed.png) -114px -10px no-repeat; }
+img.packed_regular3 { width: 84px; height: 84px; background: url(regular.packed.png) -10px -114px no-repeat; }
+img.packed_regular4 { width: 84px; height: 84px; background: url(regular.packed.png) -114px -114px no-repeat; }
+img.packed_regular5 { width: 84px; height: 84px; background: url(regular.packed.png) -218px -10px no-repeat; }

data/test/integration_test.rb

@@ -24,7 +24,9 @@ module SpriteFactory
     def test_generate_packed_regular_sprite
       integration_test(REGULAR_PATH, :output   => output_path('regular.packed'),
                                      :selector => 'img.packed_',
-                                     :layout   => :packed)
+                                     :layout   => :packed,
+                                     :padding  => 10,
+                                     :margin   => 10)
     end
 
     def test_generate_regular_sprite_with_padding
@@ -33,6 +35,12 @@ module SpriteFactory
                                      :padding  => 10)
     end
 
+    def test_generate_regular_sprite_with_margin
+      integration_test(REGULAR_PATH, :output   => output_path('regular.margin'),
+                                     :selector => 'img.margin_',
+                                     :margin   => 10)
+    end
+
     def test_generate_regular_sprite_with_fixed_size
       integration_test(REGULAR_PATH, :output   => output_path('regular.fixed'),
                                      :selector => 'img.fixed_',
@@ -73,7 +81,9 @@ module SpriteFactory
     def test_generate_packed_irregular_sprite
       integration_test(IRREGULAR_PATH, :output   => output_path('irregular.packed'),
                                        :selector => 'img.packed_',
-                                       :layout   => :packed)
+                                       :layout   => :packed,
+                                       :padding  => 10,
+                                       :margin   => 10)
     end
 
     def test_generate_irregular_sprite_with_padding
@@ -82,6 +92,12 @@ module SpriteFactory
                                        :padding  => 10)
     end
 
+    def test_generate_irregular_sprite_with_margin
+      integration_test(IRREGULAR_PATH, :output   => output_path('irregular.margin'),
+                                       :selector => 'img.margin_',
+                                       :margin  => 10)
+    end
+
     def test_generate_irregular_sprite_with_fixed_size
       integration_test(IRREGULAR_PATH, :output   => output_path('irregular.fixed'),
                                        :selector => 'img.fixed_',
@@ -120,6 +136,12 @@ module SpriteFactory
 
     #----------------------------------------------------------------------------
 
+    def test_generate_sprites_with_hover_pseudo_class
+      integration_test(HOVER_PATH, :selector => 'div.hover ')
+    end
+
+    #----------------------------------------------------------------------------
+
     def test_generate_sprite_with_nocss
       input  = REGULAR_PATH
       output = File.basename(REGULAR_PATH)

data/test/layout/horizontal_test.rb

@@ -36,6 +36,34 @@ module SpriteFactory
 
       #--------------------------------------------------------------------------
 
+      def test_margin_horizontal_layout_of_regular_images
+        images = get_regular_images
+        expected = [
+          { :cssx =>  10, :cssy => 20, :cssw => 20, :cssh => 10, :x =>  10, :y => 20 },
+          { :cssx =>  50, :cssy => 20, :cssw => 20, :cssh => 10, :x =>  50, :y => 20 },
+          { :cssx =>  90, :cssy => 20, :cssw => 20, :cssh => 10, :x =>  90, :y => 20 },
+          { :cssx => 130, :cssy => 20, :cssw => 20, :cssh => 10, :x => 130, :y => 20 },
+          { :cssx => 170, :cssy => 20, :cssw => 20, :cssh => 10, :x => 170, :y => 20 }
+        ]
+        verify_layout(200, 50, expected, images, :layout => :horizontal, :hmargin => 10, :vmargin => 20)
+      end
+
+      #--------------------------------------------------------------------------
+
+      def test_padded_and_margin_horizontal_layout_of_regular_images
+        images = get_regular_images
+        expected = [
+          { :cssx =>  10, :cssy => 20, :cssw => 24, :cssh => 18, :x =>  12, :y => 24 },
+          { :cssx =>  54, :cssy => 20, :cssw => 24, :cssh => 18, :x =>  56, :y => 24 },
+          { :cssx =>  98, :cssy => 20, :cssw => 24, :cssh => 18, :x => 100, :y => 24 },
+          { :cssx => 142, :cssy => 20, :cssw => 24, :cssh => 18, :x => 144, :y => 24 },
+          { :cssx => 186, :cssy => 20, :cssw => 24, :cssh => 18, :x => 188, :y => 24 }
+        ]
+        verify_layout(220, 58, expected, images, :layout => :horizontal, :hmargin => 10, :vmargin => 20, :hpadding => 2, :vpadding => 4)
+      end
+
+      #--------------------------------------------------------------------------
+
       def test_fixed_horizontal_layout_of_regular_images
         images = get_regular_images
         expected = [
@@ -80,6 +108,34 @@ module SpriteFactory
 
       #--------------------------------------------------------------------------
 
+      def test_margin_horizontal_layout_of_irregular_images
+        images = get_irregular_images
+        expected = [
+          { :cssx =>  10, :cssy => 20, :cssw =>  20, :cssh => 50, :x =>  10, :y => 20 },
+          { :cssx =>  50, :cssy => 25, :cssw =>  40, :cssh => 40, :x =>  50, :y => 25 },
+          { :cssx => 110, :cssy => 30, :cssw =>  60, :cssh => 30, :x => 110, :y => 30 },
+          { :cssx => 190, :cssy => 35, :cssw =>  80, :cssh => 20, :x => 190, :y => 35 },
+          { :cssx => 290, :cssy => 40, :cssw => 100, :cssh => 10, :x => 290, :y => 40 }
+        ]
+        verify_layout(400, 90, expected, images, :layout => :horizontal, :hmargin => 10, :vmargin => 20)
+      end
+
+      #--------------------------------------------------------------------------
+
+      def test_padded_and_margin_horizontal_layout_of_irregular_images
+        images = get_irregular_images
+        expected = [
+          { :cssx =>  10, :cssy => 20, :cssw =>  24, :cssh => 58, :x =>  12, :y => 24 },
+          { :cssx =>  54, :cssy => 25, :cssw =>  44, :cssh => 48, :x =>  56, :y => 29 },
+          { :cssx => 118, :cssy => 30, :cssw =>  64, :cssh => 38, :x => 120, :y => 34 },
+          { :cssx => 202, :cssy => 35, :cssw =>  84, :cssh => 28, :x => 204, :y => 39 },
+          { :cssx => 306, :cssy => 40, :cssw => 104, :cssh => 18, :x => 308, :y => 44 }
+        ]
+        verify_layout(420, 98, expected, images, :layout => :horizontal, :hmargin => 10, :vmargin => 20, :hpadding => 2, :vpadding => 4)
+      end
+
+      #--------------------------------------------------------------------------
+
       def test_fixed_horizontal_layout_of_irregular_images
         images = get_irregular_images
         expected = [

data/test/layout/packed_test.rb

@@ -10,22 +10,48 @@ module SpriteFactory
 
     def test_packed_layout_of_regular_images
       images = get_regular_images
-      expected = [                    # expected:  ---------
-        { :x =>  0, :y =>  0 },       #            |111|333|
-        { :x =>  0, :y => 10 },       #            ---------
-        { :x => 20, :y =>  0 },       #            |222|444|
-        { :x => 20, :y => 10 },       #            ---------
-        { :x =>  0, :y => 20 }        #            |555|   |
-      ]                               #            ---------
+      expected = [                                                                  # expected:  -------
+        { :cssx =>  0, :cssy =>  0, :cssw => 20, :cssh => 10, :x =>  0, :y =>  0 }, #            |11|33|
+        { :cssx =>  0, :cssy => 10, :cssw => 20, :cssh => 10, :x =>  0, :y => 10 }, #            -------
+        { :cssx => 20, :cssy =>  0, :cssw => 20, :cssh => 10, :x => 20, :y =>  0 }, #            |22|44|
+        { :cssx => 20, :cssy => 10, :cssw => 20, :cssh => 10, :x => 20, :y => 10 }, #            -------
+        { :cssx =>  0, :cssy => 20, :cssw => 20, :cssh => 10, :x =>  0, :y => 20 }  #            |55|  |
+      ]                                                                             #            -------
       verify_layout(40, 30, expected, images, :layout => :packed)
     end
 
     #--------------------------------------------------------------------------
 
-    def test_padded_packed_layout_of_regular_images
-      assert_not_implemented ":packed layout does not support the :padding option" do
-        Layout::Packed.layout(get_regular_images, :padding => 10)
-      end
+    def test_padded_packed_layout_of_regular_images                                  # expected:  ---------------
+                                                                                     #            |      |      |
+      images = get_regular_images                                                    #            |  11  |  33  |
+      expected = [                                                                   #            |      |      |
+        { :cssx =>  0, :cssy =>  0, :cssw => 60, :cssh => 30, :x => 20, :y => 10 },  #            ---------------
+        { :cssx =>  0, :cssy => 30, :cssw => 60, :cssh => 30, :x => 20, :y => 40 },  #            |      |      |
+        { :cssx => 60, :cssy =>  0, :cssw => 60, :cssh => 30, :x => 80, :y => 10 },  #            |  22  |  44  |
+        { :cssx => 60, :cssy => 30, :cssw => 60, :cssh => 30, :x => 80, :y => 40 },  #            |      |      |
+        { :cssx =>  0, :cssy => 60, :cssw => 60, :cssh => 30, :x => 20, :y => 70 }   #            ---------------
+      ]                                                                              #            |      |
+      verify_layout(120, 90, expected, images, :layout => :packed,                   #            |  55  |
+                                               :hpadding => 20,                      #            |      |
+                                               :vpadding => 10)                      #            --------
+    end
+                                          
+    #--------------------------------------------------------------------------
+
+    def test_margin_packed_layout_of_regular_images                                  # expected:  ---------------
+                                                                                     #            |      |      |
+      images = get_regular_images                                                    #            |  11  |  33  |
+      expected = [                                                                   #            |      |      |
+        { :cssx => 20, :cssy => 10, :cssw => 20, :cssh => 10, :x => 20, :y => 10 },  #            ---------------
+        { :cssx => 20, :cssy => 40, :cssw => 20, :cssh => 10, :x => 20, :y => 40 },  #            |      |      |
+        { :cssx => 80, :cssy => 10, :cssw => 20, :cssh => 10, :x => 80, :y => 10 },  #            |  22  |  44  |
+        { :cssx => 80, :cssy => 40, :cssw => 20, :cssh => 10, :x => 80, :y => 40 },  #            |      |      |
+        { :cssx => 20, :cssy => 70, :cssw => 20, :cssh => 10, :x => 20, :y => 70 }   #            ---------------
+      ]                                                                              #            |      |
+      verify_layout(120, 90, expected, images, :layout => :packed,                   #            |  55  |
+                                               :hmargin => 20,                       #            |      |
+                                               :vmargin => 10)                       #            --------
     end
 
     #--------------------------------------------------------------------------
@@ -42,18 +68,54 @@ module SpriteFactory
 
     def test_packed_layout_of_irregular_images
       images = get_irregular_images
-                                     # expected: -----------------
-      expected = [                   #           |11111111111|444|
-        { :x =>    0, :y =>  0 },    #           ------------|444|
-        { :x =>    0, :y => 10 },    #           |2222222|   |444|
-        { :x =>    0, :y => 30 },    #           ------------|444|
-        { :x =>  100, :y =>  0 },    #           |3333|      -----
-        { :x =>    0, :y => 60 }     #           -----------------
-      ]                              #           |555|           |
-                                     #           -----------------
+                                                                                        # expected: ---------------
+      expected = [                                                                      #           |1111111111|44|
+        { :cssx =>   0, :cssy =>  0, :cssw => 100, :cssh => 10, :x =>    0, :y =>  0 }, #           -----------|44|
+        { :cssx =>   0, :cssy => 10, :cssw =>  80, :cssh => 20, :x =>    0, :y => 10 }, #           |22222222| |44|
+        { :cssx =>   0, :cssy => 30, :cssw =>  60, :cssh => 30, :x =>    0, :y => 30 }, #           -----------|44|
+        { :cssx => 100, :cssy =>  0, :cssw =>  20, :cssh => 50, :x =>  100, :y =>  0 }, #           |333333|   ----
+        { :cssx =>   0, :cssy => 60, :cssw =>  40, :cssh => 40, :x =>    0, :y => 60 }  #           ---------------
+      ]                                                                                 #           |5555|        |
+                                                                                        #           ---------------
       verify_layout(120, 100, expected, images, :layout => :packed)
     end
 
+    #--------------------------------------------------------------------------
+
+    def test_padded_packed_layout_of_irregular_images                                     # expected: (but with more vertical padding than shown here)
+      images = get_irregular_images                                                       #
+                                                                                          #  ------------------------- 
+      expected = [                                                                        #  |  1111111111  |  4444  | 
+        { :cssx =>   0, :cssy =>   0, :cssw => 140, :cssh => 30, :x =>   20, :y =>  10 }, #  ----------------  4444  | 
+        { :cssx =>   0, :cssy =>  30, :cssw => 120, :cssh => 40, :x =>   20, :y =>  40 }, #  |  22222222  | ---------- 
+        { :cssx =>   0, :cssy =>  70, :cssw => 100, :cssh => 50, :x =>   20, :y =>  80 }, #  --------------          | 
+        { :cssx => 140, :cssy =>   0, :cssw =>  80, :cssh => 60, :x =>  160, :y =>  10 }, #  |  333333  |            | 
+        { :cssx =>   0, :cssy => 120, :cssw =>  60, :cssh => 70, :x =>   20, :y => 130 }  #  |-----------            | 
+      ]                                                                                   #  |  55  |                | 
+                                                                                          #  ------------------------- 
+      verify_layout(220, 190, expected, images, :layout   => :packed,                     #
+                                                :hpadding => 20,                          #
+                                                :vpadding => 10)                          #
+    end
+
+    #--------------------------------------------------------------------------
+
+    def test_margin_packed_layout_of_irregular_images                                     # expected: (but with more vertical margin than shown here)
+      images = get_irregular_images                                                       #
+                                                                                          #  ------------------------- 
+      expected = [                                                                        #  |  1111111111  |  4444  | 
+        { :cssx =>  20, :cssy =>  10, :cssw => 100, :cssh => 10, :x =>   20, :y =>  10 }, #  ----------------  4444  | 
+        { :cssx =>  20, :cssy =>  40, :cssw =>  80, :cssh => 20, :x =>   20, :y =>  40 }, #  |  22222222  | ---------- 
+        { :cssx =>  20, :cssy =>  80, :cssw =>  60, :cssh => 30, :x =>   20, :y =>  80 }, #  --------------          | 
+        { :cssx => 160, :cssy =>  10, :cssw =>  40, :cssh => 40, :x =>  160, :y =>  10 }, #  |  333333  |            | 
+        { :cssx =>  20, :cssy => 130, :cssw =>  20, :cssh => 50, :x =>   20, :y => 130 }  #  |-----------            | 
+      ]                                                                                   #  |  55  |                | 
+                                                                                          #  ------------------------- 
+      verify_layout(220, 190, expected, images, :layout  => :packed,                      #
+                                                :hmargin => 20,                           #
+                                                :vmargin => 10)                           #
+    end
+
     #==========================================================================
     # other packed algorithm test
     #==========================================================================

data/test/layout/vertical_test.rb

@@ -36,6 +36,34 @@ module SpriteFactory
 
       #--------------------------------------------------------------------------
 
+      def test_margin_vertical_layout_of_regular_images
+        images = get_regular_images
+        expected = [
+          { :cssx => 10, :cssy =>  20, :cssw => 20, :cssh => 10, :x => 10, :y =>  20 },
+          { :cssx => 10, :cssy =>  70, :cssw => 20, :cssh => 10, :x => 10, :y =>  70 },
+          { :cssx => 10, :cssy => 120, :cssw => 20, :cssh => 10, :x => 10, :y => 120 },
+          { :cssx => 10, :cssy => 170, :cssw => 20, :cssh => 10, :x => 10, :y => 170 },
+          { :cssx => 10, :cssy => 220, :cssw => 20, :cssh => 10, :x => 10, :y => 220 }
+        ]
+        verify_layout(40, 250, expected, images, :layout => :vertical, :hmargin => 10, :vmargin => 20)
+      end
+
+      #--------------------------------------------------------------------------
+
+      def test_padded_and_margin_vertical_layout_of_regular_images
+        images = get_regular_images
+        expected = [
+          { :cssx => 10, :cssy =>  20, :cssw => 24, :cssh => 18, :x => 12, :y =>  24 },
+          { :cssx => 10, :cssy =>  78, :cssw => 24, :cssh => 18, :x => 12, :y =>  82 },
+          { :cssx => 10, :cssy => 136, :cssw => 24, :cssh => 18, :x => 12, :y => 140 },
+          { :cssx => 10, :cssy => 194, :cssw => 24, :cssh => 18, :x => 12, :y => 198 },
+          { :cssx => 10, :cssy => 252, :cssw => 24, :cssh => 18, :x => 12, :y => 256 }
+        ]
+        verify_layout(44, 290, expected, images, :layout => :vertical, :hmargin => 10, :vmargin => 20, :hpadding => 2, :vpadding => 4)
+      end
+
+      #--------------------------------------------------------------------------
+
       def test_fixed_vertical_layout_of_regular_images
         images = get_regular_images
         expected = [
@@ -80,6 +108,34 @@ module SpriteFactory
 
       #--------------------------------------------------------------------------
 
+      def test_margin_vertical_layout_of_irregular_images
+        images = get_irregular_images
+        expected = [
+          { :cssx => 50, :cssy =>  20, :cssw =>  20, :cssh => 50, :x => 50, :y =>  20 },
+          { :cssx => 40, :cssy => 110, :cssw =>  40, :cssh => 40, :x => 40, :y => 110 },
+          { :cssx => 30, :cssy => 190, :cssw =>  60, :cssh => 30, :x => 30, :y => 190 },
+          { :cssx => 20, :cssy => 260, :cssw =>  80, :cssh => 20, :x => 20, :y => 260 },
+          { :cssx => 10, :cssy => 320, :cssw => 100, :cssh => 10, :x => 10, :y => 320 }
+        ]
+        verify_layout(120, 350, expected, images, :layout => :vertical, :hmargin => 10, :vmargin => 20)
+      end
+
+      #--------------------------------------------------------------------------
+
+      def test_padded_and_margin_vertical_layout_of_irregular_images
+        images = get_irregular_images
+        expected = [
+          { :cssx => 50, :cssy =>  20, :cssw =>  24, :cssh => 58, :x => 52, :y =>  24 },
+          { :cssx => 40, :cssy => 118, :cssw =>  44, :cssh => 48, :x => 42, :y => 122 },
+          { :cssx => 30, :cssy => 206, :cssw =>  64, :cssh => 38, :x => 32, :y => 210 },
+          { :cssx => 20, :cssy => 284, :cssw =>  84, :cssh => 28, :x => 22, :y => 288 },
+          { :cssx => 10, :cssy => 352, :cssw => 104, :cssh => 18, :x => 12, :y => 356 }
+        ]
+        verify_layout(124, 390, expected, images, :layout => :vertical, :hmargin => 10, :vmargin => 20, :hpadding => 2, :vpadding => 4)
+      end
+
+      #--------------------------------------------------------------------------
+
       def test_fixed_vertical_layout_of_irregular_images
         images = get_irregular_images
         expected = [

data/test/runner_test.rb

@@ -81,6 +81,22 @@ module SpriteFactory
       end
     end
 
+    def test_default_margin
+      Runner.publicize_methods do
+        r = Runner.new(REGULAR_PATH)
+        assert_equal(0, r.hmargin)
+        assert_equal(0, r.vmargin)
+
+        r = Runner.new(REGULAR_PATH, :margin => 10)
+        assert_equal(10, r.hmargin)
+        assert_equal(10, r.vmargin)
+
+        r = Runner.new(REGULAR_PATH, :hmargin => 10, :vmargin => 20)
+        assert_equal(10, r.hmargin)
+        assert_equal(20, r.vmargin)
+      end
+    end
+
     #----------------------------------------------------------------------------
 
     def test_default_css_path
@@ -150,6 +166,14 @@ module SpriteFactory
         SpriteFactory.run!(REGULAR_PATH, :height => 50, :padding => 10)
       end
 
+      assert_runtime_error "set :width for fixed width, or :hmargin for horizontal margin, but not both." do
+        SpriteFactory.run!(REGULAR_PATH, :width => 50, :margin => 10)
+      end
+
+      assert_runtime_error "set :height for fixed height, or :vmargin for vertical margin, but not both." do
+        SpriteFactory.run!(REGULAR_PATH, :height => 50, :margin => 10)
+      end
+
       assert_runtime_error "image regular1 does not fit within a fixed width of 10" do
         SpriteFactory.run!(REGULAR_PATH, :width => 10)
       end

data/test/test_case.rb

@@ -15,6 +15,7 @@ module SpriteFactory
     FORMATS_PATH    = 'test/images/formats'
     EMPTY_PATH      = 'test/images/empty'
     SUBFOLDERS_PATH = 'test/images/subfolders'
+    HOVER_PATH      = 'test/images/hover'
 
     REGULAR   = SpriteFactory.find_files(File.join(REGULAR_PATH,   '*.png'))
     IRREGULAR = SpriteFactory.find_files(File.join(IRREGULAR_PATH, '*.png'))

metadata

@@ -1,48 +1,58 @@
---- !ruby/object:Gem::Specification
+--- !ruby/object:Gem::Specification 
 name: sprite-factory
-version: !ruby/object:Gem::Version
-  version: 1.4.2
-  prerelease: 
+version: !ruby/object:Gem::Version 
+  prerelease: false
+  segments: 
+  - 1
+  - 5
+  - 0
+  version: 1.5.0
 platform: ruby
-authors:
+authors: 
 - Jake Gordon
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2012-02-29 00:00:00.000000000Z
-dependencies:
-- !ruby/object:Gem::Dependency
+
+date: 2012-05-10 00:00:00 -07:00
+default_executable: 
+dependencies: 
+- !ruby/object:Gem::Dependency 
   name: rmagick
-  requirement: &20623420 !ruby/object:Gem::Requirement
+  prerelease: false
+  requirement: &id001 !ruby/object:Gem::Requirement 
     none: false
-    requirements:
-    - - ! '>='
-      - !ruby/object:Gem::Version
-        version: '0'
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        segments: 
+        - 0
+        version: "0"
   type: :development
-  prerelease: false
-  version_requirements: *20623420
-- !ruby/object:Gem::Dependency
+  version_requirements: *id001
+- !ruby/object:Gem::Dependency 
   name: chunky_png
-  requirement: &20623000 !ruby/object:Gem::Requirement
+  prerelease: false
+  requirement: &id002 !ruby/object:Gem::Requirement 
     none: false
-    requirements:
-    - - ! '>='
-      - !ruby/object:Gem::Version
-        version: '0'
+    requirements: 
+    - - ">="
+      - !ruby/object:Gem::Version 
+        segments: 
+        - 0
+        version: "0"
   type: :development
-  prerelease: false
-  version_requirements: *20623000
-description: Combines individual images from a directory into a single sprite image
-  file and creates an appropriate CSS stylesheet
-email:
+  version_requirements: *id002
+description: Combines individual images from a directory into a single sprite image file and creates an appropriate CSS stylesheet
+email: 
 - jake@codeincomplete.com
-executables:
+executables: 
 - sf
 extensions: []
-extra_rdoc_files:
+
+extra_rdoc_files: 
 - README.md
-files:
+files: 
 - .gitignore
 - LICENSE
 - README.md
@@ -66,6 +76,10 @@ files:
 - test/images/formats/monkey.gif
 - test/images/formats/spies.jpg
 - test/images/formats/thief.png
+- test/images/hover/div.bar__img.icon--hover.png
+- test/images/hover/div.bar__img.icon.png
+- test/images/hover/div.foo__img.icon--hover.png
+- test/images/hover/div.foo__img.icon.png
 - test/images/irregular/irregular1.png
 - test/images/irregular/irregular2.png
 - test/images/irregular/irregular3.png
@@ -76,12 +90,16 @@ files:
 - test/images/reference/custom.png
 - test/images/reference/formats.css
 - test/images/reference/formats.png
+- test/images/reference/hover.css
+- test/images/reference/hover.png
 - test/images/reference/index.html
 - test/images/reference/irregular.css
 - test/images/reference/irregular.fixed.css
 - test/images/reference/irregular.fixed.png
 - test/images/reference/irregular.horizontal.css
 - test/images/reference/irregular.horizontal.png
+- test/images/reference/irregular.margin.css
+- test/images/reference/irregular.margin.png
 - test/images/reference/irregular.packed.css
 - test/images/reference/irregular.packed.png
 - test/images/reference/irregular.padded.css
@@ -99,6 +117,8 @@ files:
 - test/images/reference/regular.fixed.png
 - test/images/reference/regular.horizontal.css
 - test/images/reference/regular.horizontal.png
+- test/images/reference/regular.margin.css
+- test/images/reference/regular.margin.png
 - test/images/reference/regular.nocomments.css
 - test/images/reference/regular.nocomments.png
 - test/images/reference/regular.packed.css
@@ -133,29 +153,37 @@ files:
 - test/runner_test.rb
 - test/style_test.rb
 - test/test_case.rb
+has_rdoc: true
 homepage: https://github.com/jakesgordon/sprite-factory
 licenses: []
+
 post_install_message: 
-rdoc_options:
+rdoc_options: 
 - --charset=UTF-8
-require_paths:
+require_paths: 
 - lib
-required_ruby_version: !ruby/object:Gem::Requirement
+required_ruby_version: !ruby/object:Gem::Requirement 
   none: false
-  requirements:
-  - - ! '>='
-    - !ruby/object:Gem::Version
-      version: '0'
-required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      segments: 
+      - 0
+      version: "0"
+required_rubygems_version: !ruby/object:Gem::Requirement 
   none: false
-  requirements:
-  - - ! '>='
-    - !ruby/object:Gem::Version
-      version: '0'
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      segments: 
+      - 0
+      version: "0"
 requirements: []
+
 rubyforge_project: 
-rubygems_version: 1.8.7
+rubygems_version: 1.3.7
 signing_key: 
 specification_version: 3
 summary: Automatic CSS sprite generator
 test_files: []
+