A Rake task to generate CSS Sprites for Bootstrap-like icons

resprite.rake

require 'sprite_factory'

namespace :assets do
  desc 'recreate sprite images and css'
  task :resprite => :environment do
    Dir.glob('app/assets/images/icons/*.svg').each do |svg_file|
      %x(convert -antialias -background transparent #{svg_file} -resize 15x14 #{File.dirname svg_file}/#{File.basename(svg_file).gsub(/\.svg\z/, ".png")} )
    end
    
    SpriteFactory.cssurl = "image-url('$IMAGE')"
    
    rules = []
    rules << <<EOF
[class^="myicon-"], [class*=" myicon-"] {
  display: inline-block;
  width: 15px;
  height: 14px;
  line-height: 14px;
  vertical-align: text-top;
  background-image: url('icons.png');
  background-position: 15px 14px;
  background-repeat: no-repeat;
  margin-top: 0;
  vertical-align: text-bottom;
}
EOF
  
    SpriteFactory.run!(
      'app/assets/images/icons',
      :style => :scss,
      :layout => :packed,
      :library => :chunkypng,
      :selector => '.myicon-',
      :output_style => 'app/assets/stylesheets/_mysprites.scss',
      :nocomments => true
    ) do |images|
      images.map do |name, data| # for each image, we add a CSS sprite
        rules << ".myicon-#{name} { background-position: -#{data[:x]}px -#{data[:y]}px; }"
      end
      rules.join("\n")
    end
  end
end