image_bundle 0.0.1

data/.bzrignore

@@ -0,0 +1,2 @@
+rdoc
+.svn

data/.gitignore

@@ -0,0 +1,2 @@
+*~
+pkg

data/Gemfile

@@ -0,0 +1,4 @@
+source "http://rubygems.org"
+
+# Specify your gem's dependencies in image_bundle.gemspec
+gemspec

data/LICENSE

@@ -0,0 +1,18 @@
+ImageBundle, a Rails plugin to automatically bundle local images into CSS sprites.
+
+Copyright (C) 2007 Bart Teeuwisse <bart [dot] teeuwisse [at] thecodemill.biz>
+
+This library is free software; you can redistribute it and/or modify
+it under the terms of the GNU Lesser General Public License as
+published by the Free Software Foundation; either version 2.1 of the
+License, or (at your option) any later version.
+
+This library is distributed in the hope that it will be useful, but
+WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+Lesser General Public License for more details.
+
+You should have received a copy of the GNU Lesser General Public
+License along with this library; if not, write to the Free Software
+Foundation, Inc., 59 Temple Place, Suite 330, Boston, MA 02111-1307
+USA

data/README.md

@@ -0,0 +1,60 @@
+=ImageBundle
+
+ImageBundleHelper adds view helper +image_bundle+. A helper which
+bundles individual local images into a single CSS sprite thereby
+reducing the number of HTTP requests needed to render the page.
+
+{Yahoo's Exceptional Performance
+team}[http://developer.yahoo.com/performance/] found that the number
+of HTTP requests has the biggest impact on page rendering speed. You
+can inspect your site's performance with the excellent Firefox add-on
+{YSlow}[http://developer.yahoo.com/yslow/].
+
+== Usage
+
+Use ImageBundle to automatically replace individual local images into
+CSS sprites.
+
+== Demo
+
+A demo of ImageBundle is available at http://thecodemill.biz/image_bundle/.
+
+== Note on <tt>image_tag</tt> helper
+
+Rails' <tt>image_tag</tt> helper adds a query parameter to the image URL to
+'bust caches'. It ads either the <tt>RAILS_ASSET_ID</tt> environment variable
+or the image's modification time.  This is the *wrong* thing to
+do. Caches should be managed through the use of HTTP headers such as
+Cache-Control, Last-Modified, Expires and of course the HTTP response
+code.  Adding the modification time is the same as using as using
+ETags in apache or IIS, see
+http://developer.yahoo.com/performance/rules.html#etags for an
+explanation why it is better to avoid using ETags in favor of proper
+Expires headers.
+
+This plugin doesn't accept image URLS that include query parameters as
+they are either dynamically generated and shouldn't be part of a
+sprite or they promote a bad practice.
+
+If you like to use the <tt>image_tag</tt> helper I recommend you a) configure
+the webserver of you static content to return proper headers and b) to
+overwrite <tt>ActionView::Helpers::AssetTagsHelper#rewrite_asset_path!</tt>
+like so:
+
+  module ActionView
+    module Helpers
+      module AssetTagHelper
+        def rewrite_asset_path!(source)
+        end
+      end
+    end
+  end
+
+Create a file <tt>lib/asset_tag_helper.rb</tt> and load it at the end of your
+<tt>config/environment.rb</tt> file like so:
+
+  require File.join(File.dirname(__FILE__), '../lib/asset_tag_helper')
+
+== License & Author
+
+:include: LICENSE

data/Rakefile

@@ -0,0 +1,2 @@
+require 'bundler'
+Bundler::GemHelper.install_tasks

data/image_bundle.gemspec

@@ -0,0 +1,22 @@
+# -*- encoding: utf-8 -*-
+$:.push File.expand_path("../lib", __FILE__)
+require "image_bundle/version"
+
+Gem::Specification.new do |s|
+  s.name        = "image_bundle"
+  s.version     = ImageBundle::VERSION
+  s.platform    = Gem::Platform::RUBY
+  s.authors     = ["Bart Teeuwisse"]
+  s.email       = ["bart@thecodemill.biz"]
+  s.homepage    = "https://github.com/bartt/image_bundle"
+  s.summary     = %q{ImageBundle bundles individual images into a single sprite and CSS rules to match}
+  s.description = %q{ImageBundle adds a helper to Ruby on Rails to create image sprites and matching CSS rules on the fly. Overhead is minimal as sprites are cached. ImageBundle is rendering framework agnostic.}
+
+  s.rubyforge_project = "image_bundle"
+  s.add_dependency "actionpack", "~> 3.0.7"
+
+  s.files         = `git ls-files`.split("\n")
+  s.test_files    = `git ls-files -- {test,spec,features}/*`.split("\n")
+  s.executables   = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
+  s.require_paths = ["lib"]
+end

data/install.rb

@@ -0,0 +1 @@
+# Install hook code here

data/lib/image_bundle/version.rb

@@ -0,0 +1,3 @@
+module ImageBundle
+  VERSION = "0.0.1"
+end

data/lib/image_bundle.rb

@@ -0,0 +1,266 @@
+# ImageBundleHelper adds view helper +image_bundle+. A helper which
+# bundles individual <strong>local images</strong> into a single CSS
+# sprite thereby reducing the number of HTTP requests needed to render
+# the page.
+#
+# {Yahoo's Exceptional Performance
+# team}[http://developer.yahoo.com/performance/] found that the number
+# of HTTP requests has the biggest impact on page rendering speed. You
+# can inspect your site's performance with the excellent Firefox
+# add-on {YSlow}[http://developer.yahoo.com/yslow/].
+
+module ImageBundleHelper
+  require 'rubygems'
+  require 'RMagick'
+  require 'digest/md5'
+
+  SPRITE_BASE_DIR ||= ENV['IMAGE_BUNDLE_SPRITE_BASE_DIR'] || 'sprites'
+
+  class Image #:nodoc:
+    attr_accessor :path, :file, :size, :height, :width, :x_pos
+  end
+
+  # === +image_bundle+ takes 4 optional parameters:
+  #
+  # <tt>css_class</tt>::
+  #     When provided <tt>css_class</tt> restricts the bundling of
+  #     images to <tt><img></tt> tags of class <tt>css_class</tt>.
+  #
+  # <tt>sprite_type</tt>::
+  #    By default +image_bundle+ generates a PNG master image. Set
+  #    sprite_type to the image type you'd like to use instead. E.g. GIF
+  #    or JPEG. Any type supported by
+  #    {ImageMagick}[http://www.imagemagick.org/] can be generated. All
+  #    images being bundled will be converted to <tt>sprite_type</tt>.
+  #
+  # <tt>content_target</tt>::
+  #    By default +image_bundle+ produces content for <tt>:head</tt>
+  #    using <tt>content_for</tt>. Provide a different target if you
+  #    prefer a different name. Can be anything that can be converted
+  #    to a symbol.
+  #
+  # <tt>replacement_image</tt>::
+  #    By default +image_bundle+ replaces the +src+ of bundled images
+  #    with <tt>/images/clear.gif</tt>. A 1x1 transparent image is
+  #    included with the +image_bundle+ plugin. You'll find it in the
+  #    +images+ directory of the plugin. Provide
+  #    <tt>replacement_image</tt> if you prefer to use an image of
+  #    different name.
+  #
+  # === +image_bundle+ does 4 things:
+  # 1. It creates a master image of all bundled images, if it doesn't already exist.
+  # 1. It rewrites the <tt><img></tt> tags of all images included
+  #    in the bundle to use <tt>replacement_image</tt> instead.
+  # 1. Each included <tt><img></tt> gets a new class <em>added</em> to the
+  #    image's +class+ attribute.  The new class name is unique to the
+  #    image's size and content.
+  # 1. +image_bundle+ creates matching CSS rules to display the portion
+  #    of the master image equivalent to the <tt><img></tt> tags'
+  #    original image.  The CSS rules are collected in
+  #    <tt>content_target</tt> and can be used later with
+  #    <tt>yield</tt>.
+  #
+  # === +image_bundle+ uses 1 environment variable:
+  #
+  # By default +image_bundle+ creates sprites in a directory called
+  # +sprites+. +image_bundle+ doesn't use +images+ in order to
+  # eliminate the potential of overwriting your images. Create
+  # +sprites+ in your +public+ directory before using
+  # +image_bundle+.
+  #
+  # If you prefer to use a different directory set
+  # <tt>ENV['IMAGE_BUNDLE_SPRITE_BASE_DIR']</tt> in your Rails
+  # environment. IMAGE_BUNDLE_SPRITE_BASE_DIR is relative to your
+  # =public= directory.
+  #
+  # === Example usages
+  #
+  # Instruct your controller to user +image_bundle+:
+  #
+  #   helper: image_bundle
+  #
+  # Bundle all images included within +image_bundle+'s block.
+  #
+  # <% image_bundle do %>
+  #   <p>+image_bundle+ can wrap any kind of content: HTML, JS, etc.</p>
+  #   <img src="/images/auflag.gif"/></br>
+  #   <p>Bundled images don't need to be adjacent to one another either.</p>
+  #   <img src="/images/nlflag.gif"/></br>
+  #   <img src="/images/frflag.gif"/></br>
+  # <% end %>
+  #
+  # Bundle only images of class <tt>:bundle</tt>. +image_bundle+ scales resized
+  # images accordingly. It calculates the 2nd dimension if only one
+  # dimension is given. Bundled images don't have to be of the same size
+  # either.
+  #
+  # <% image_bundle(:bundle) do %>
+  #   <p>
+  #     Some static text with <strong>HTML</strong> <em>markup</em>.<br/>
+  #     Plus a dynamic date: <%= Time.now %><br/>
+  #     And an 16x16 <img alt="favicon" class="bundle" src="/favicon.ico" height="16" width="16"/><br/>
+  #     A 6x? <img alt="favicon" class="bundle" src="/favicon.ico" height="6"/><br/>
+  #     A ?x6 <img alt="favicon" class="bundle" src="/favicon.ico" width="6"/><br/>
+  #     An ?x? <img alt="favicon" class="bundle" src="/images/rails.png"/><br/>
+  #     A 6x16 <img alt="favicon" src="/favicon.ico" height="6" width="16"/> not of class bundle<br/>
+  #     My 160x16 multi line example <img alt="favicon" class="bundle" src="/favicon.ico"
+  #     height="160"
+  #     width="16"/><br/>
+  #     Single quote ?x? <img alt="favicon" class='bundle' src="/favicon.ico"/><br/>
+  #     Class 'some bundle' ?x? <img alt="favicon" class='some bundle' src="/favicon.ico"/><br/>
+  #     Src before class ?x160 <img alt="favicon" src="/favicon.ico" class='bundle' width="160"/><br/>
+  #     Src before class 'some bundle' ?x? <img alt="favicon" src="/favicon.ico" class='some bundle'/><br/>
+  #     Src = and id ?x? <img alt="favicon" src="/favicon.ico" id="bla" class = 'some bundle'/><br/>
+  #     Casper ?x? <img alt="favicon" class="bundle" src="/images/casper-1st-birthday.jpg"/><br/>
+  #   </p>
+  #   <p>
+  #     Some additional text.
+  #   </p>
+  # <% end %>
+
+  def image_bundle(css_class = nil, sprite_type = :png, content_target = :head, replacement_image = '/images/clear.gif', *args, &block)
+    # Bind buffer to the output buffer of the templates.
+    buffer = @output_buffer
+
+    # Mark the current position in the buffer
+    pos = buffer.length
+
+    # Render the block contained within the image_bundle tag. The
+    # rendered output is appended to buffer.
+    block.call(*args)
+
+    # Extract the output produced by the block.
+    block_output = buffer[pos..-1]
+    buffer[pos..-1] = ''
+
+    # Replace the img tags in the output with links to clear.gif and
+    # styling to use the master image created from the individual
+    # images.
+    images = Hash.new
+    re = (css_class == nil) ? /(<img\s*)([^>]*?)(\s*\/?>)/im : /(<img\s*)([^>]*?class\s*=\s*["']?[^"']*?#{css_class}[^"']*?["']?[^>]*?)(\s*\/?>)/im
+    block_rewrite = ''
+    while pos = (block_output =~ re) do
+
+      # Store match data for later reference.
+      img_match = $~.to_s
+      img_tag = $1
+      attributes = $2
+      img_closing_tag = $3
+
+      # Remember where to continue searching from in the next
+      # iteration.
+      continue_pos = pos+img_match.length
+
+      # Write out the content before the start of the tag
+      block_rewrite << block_output[0..pos-1]
+      if img_match =~ /src\=["']?https?:\/\//i then
+        block_rewrite << img_match
+      else
+
+        # Write out the opening portion of the image tag (<img).
+        block_rewrite << img_tag
+
+        # Process all attributes of the img tag.
+        height_given = width_given = nil
+        classes = ''
+        ping = ::ImageBundleHelper::Image.new
+        while pos = (attributes =~ /([^ =]+?)\s*=\s*(("?([^"=]*?)")|('?([^'=]*?)'))/im) do
+          attribute = $1
+          value = $4 || $6
+          attr_continue_pos = pos+$~.to_s.length
+          case attribute
+          when 'src'
+            ping.path = value
+            # Read only the image's meta data not its image content.
+            ping.file = "#{Rails.root}/public#{ping.path}"
+            image = ::Magick::Image.ping(ping.file)[0]
+            ping.height = image.rows
+            ping.width = image.columns
+            ping.size = image.filesize
+            # Return all the memory associated with the image to the
+            # system.
+            image.destroy!
+            block_rewrite << "#{attribute}=\"#{replacement_image}\" "
+          when 'height'
+            height_given = value.to_i
+          when 'width'
+            width_given = value.to_i
+          when 'class'
+
+            # Prepend a space for later concatenation with bndl class.
+            classes = " #{value}"
+          else
+
+            # Pass through all other attributes
+            block_rewrite << "#{attribute}=\"#{value}\" "
+          end
+          attributes = attributes[attr_continue_pos..-1]
+        end
+
+        # Calculate the height and width of the image based on the
+        # specified height/width and the source file's height and
+        # width. Scaling needs to happen when the sprite is created
+        if height_given == nil then
+          if width_given != nil then
+            ping.height = (ping.height * (width_given.to_f / ping.width.to_f)).to_i
+            ping.width = width_given
+          end
+        else
+          if width_given == nil then
+            ping.width = (ping.width * (height_given.to_f / ping.height.to_f)).to_i
+            ping.height = height_given
+          else
+            ping.width = width_given
+            ping.height = height_given
+          end
+        end
+
+        # Only add unique images and height/width combinations to the hash.
+        key = "bndl#{::Digest::MD5.hexdigest("#{ping.path}:#{ping.size}#{ping.height}:#{ping.width}").hash}"
+        images[key] ||= ping
+        block_rewrite << "class =\"#{key}#{classes}\" "
+        block_rewrite << "height=\"#{ping.height}\" "
+        block_rewrite << "width=\"#{ping.width}\" "
+        block_rewrite << img_closing_tag
+      end
+      block_output = block_output[continue_pos..-1]
+    end
+
+    # Create a sprite when there are source files and if it doesn't
+    # already exists.
+    if images.length > 0 then
+      sprite_path = '/' + SPRITE_BASE_DIR + '/' + ::Digest::MD5.hexdigest(images.keys.inject do |concat_names, key| concat_names + '|' + key end) + ".#{sprite_type}"
+      sprite_file = "#{Rails.root}/public/#{sprite_path}"
+      if !File.exists?(sprite_file) then
+
+        # Stack scaled source images left to right.
+        sprite = images.values.inject(::Magick::ImageList.new) do |image_list, ping|
+          image_list << ::Magick::ImageList.new(ping.file)[0].scale(ping.width, ping.height)
+        end.append(false)
+        sprite.write(sprite_file)
+        # Return all the memory associated with the image to the
+        # system.
+        sprite.destroy!
+      end
+
+      # Construct style tag to be included in the header.
+      current_y = 0
+      bundle_styles = "\n<style type=\"text/css\">\n"
+      bundle_styles << images.keys.inject('') do |styles, key|
+        images[key].x_pos = current_y
+        current_y += images[key].width
+        styles + ".#{key} {\n   background-image:url(#{sprite_path});\n background-position: -#{images[key].x_pos}px 0px;\n}\n"
+      end
+      bundle_styles << "</style>\n"
+    end
+
+    # Write the remaining block output that follows the last img tag.
+    block_rewrite << block_output
+    buffer << raw(block_rewrite) if block_rewrite
+    content_for content_target.to_sym, raw(bundle_styles ||= '')
+  end
+end
+
+if defined?(ActionView::Base)
+  ActionView::Base.send(:include, ImageBundleHelper)
+end

data/lib/tasks/image_bundle_tasks.rake

@@ -0,0 +1,4 @@
+# desc "Explaining what the task does"
+# task :image_bundle do
+#   # Task goes here
+# end

data/test/image_bundle_test.rb

@@ -0,0 +1,8 @@
+require 'test/unit'
+
+class ImageBundleTest < Test::Unit::TestCase
+  # Replace this with your real tests.
+  def test_this_plugin
+    flunk
+  end
+end

data/uninstall.rb

@@ -0,0 +1 @@
+# Uninstall hook code here

metadata

@@ -0,0 +1,80 @@
+--- !ruby/object:Gem::Specification 
+name: image_bundle
+version: !ruby/object:Gem::Version 
+  prerelease: 
+  version: 0.0.1
+platform: ruby
+authors: 
+- Bart Teeuwisse
+autorequire: 
+bindir: bin
+cert_chain: []
+
+date: 2011-06-05 00:00:00 -07:00
+default_executable: 
+dependencies: 
+- !ruby/object:Gem::Dependency 
+  name: actionpack
+  prerelease: false
+  requirement: &id001 !ruby/object:Gem::Requirement 
+    none: false
+    requirements: 
+    - - ~>
+      - !ruby/object:Gem::Version 
+        version: 3.0.7
+  type: :runtime
+  version_requirements: *id001
+description: ImageBundle adds a helper to Ruby on Rails to create image sprites and matching CSS rules on the fly. Overhead is minimal as sprites are cached. ImageBundle is rendering framework agnostic.
+email: 
+- bart@thecodemill.biz
+executables: []
+
+extensions: []
+
+extra_rdoc_files: []
+
+files: 
+- .bzrignore
+- .gitignore
+- Gemfile
+- LICENSE
+- README.md
+- Rakefile
+- image_bundle.gemspec
+- images/clear.gif
+- install.rb
+- lib/image_bundle.rb
+- lib/image_bundle/version.rb
+- lib/tasks/image_bundle_tasks.rake
+- test/image_bundle_test.rb
+- uninstall.rb
+has_rdoc: true
+homepage: https://github.com/bartt/image_bundle
+licenses: []
+
+post_install_message: 
+rdoc_options: []
+
+require_paths: 
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement 
+  none: false
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      version: "0"
+required_rubygems_version: !ruby/object:Gem::Requirement 
+  none: false
+  requirements: 
+  - - ">="
+    - !ruby/object:Gem::Version 
+      version: "0"
+requirements: []
+
+rubyforge_project: image_bundle
+rubygems_version: 1.6.2
+signing_key: 
+specification_version: 3
+summary: ImageBundle bundles individual images into a single sprite and CSS rules to match
+test_files: 
+- test/image_bundle_test.rb