diff --git a/lib/compass/sass_extensions/functions/sprites.rb b/lib/compass/sass_extensions/functions/sprites.rb index 27dd31fd..c6100d01 100644 --- a/lib/compass/sass_extensions/functions/sprites.rb +++ b/lib/compass/sass_extensions/functions/sprites.rb @@ -3,9 +3,8 @@ require 'chunky_png' module Compass::SassExtensions::Functions::Sprites SASS_NULL = Sass::Script::Number::new(0) - def sprite_image(uri) - uri = uri.value - path, name = Compass::Sprites.path_and_name(uri) + def generate_sprite_image(uri) + path, name = Compass::Sprites.path_and_name(uri.value) last_spacing = 0 width = 0 height = 0 @@ -48,12 +47,23 @@ module Compass::SassExtensions::Functions::Sprites end output_png.save File.join(File.join(Compass.configuration.images_path, "#{path}.png")) + sprite_url(uri) + end + + def sprite_image(uri, x_shift = SASS_NULL, y_shift = SASS_NULL) + url = sprite_url(uri) + position = sprite_position(uri, x_shift, y_shift) + Sass::Script::String.new("#{url} #{position}") + end + + def sprite_url(uri) + path, name = Compass::Sprites.path_and_name(uri.value) image_url(Sass::Script::String.new("#{path}.png")) end - def sprite_position(file, x_shift = SASS_NULL, y_shift = SASS_NULL) - name = File.dirname(file.value) - image_name = File.basename(file.value, '.png') + def sprite_position(uri, x_shift = SASS_NULL, y_shift = SASS_NULL) + name = File.dirname(uri.value) + image_name = File.basename(uri.value, '.png') image = Compass::Sprites.sprites(name).detect{ |image| image[:name] == image_name } if x_shift.unit_str == "%" x = x_shift.to_s diff --git a/lib/compass/sprites.rb b/lib/compass/sprites.rb index 24177e31..7e4dc532 100644 --- a/lib/compass/sprites.rb +++ b/lib/compass/sprites.rb @@ -8,7 +8,7 @@ module Compass end def path_and_name(uri) - if uri =~ %r{((.+/)?(.+))/(\*)\.png} + if uri =~ %r{((.+/)?(.+))/(.+?)\.png} [$1, $3, $4] end end @@ -53,7 +53,7 @@ module Compass end.join} \#{$#{name}-sprite-base-class} { - background: sprite-image("#{uri}") no-repeat; + background: generate-sprite-image("#{uri}") no-repeat; } @mixin #{name}-sprite-dimensions($sprite) { diff --git a/spec/sprites_spec.rb b/spec/sprites_spec.rb index ed94226f..92aa9c3d 100644 --- a/spec/sprites_spec.rb +++ b/spec/sprites_spec.rb @@ -345,4 +345,55 @@ describe Compass::Sprites do image_md5('squares.png').should == '0187306f3858136feee87d3017e7f307' end + it "should use the sprite-image and sprite-url function as in lemonade" do + css = render <<-SCSS + @import "squares/*.png"; + + .squares-1 { + background: sprite-image("squares/20x20.png") no-repeat; + } + + .squares-2 { + background: sprite-image("squares/20x20.png", 100%) no-repeat; + } + + .squares-3 { + background: sprite-image("squares/20x20.png", -4px, 3px) no-repeat; + } + + .squares-4 { + background-image: sprite-url("squares/20x20.png"); + } + + .squares-5 { + background-image: sprite-url("squares/*.png"); + } + SCSS + css.should == <<-CSS + .squares-sprite { + background: url('/squares.png') no-repeat; + } + + .squares-1 { + background: url('/squares.png') 0 -10px no-repeat; + } + + .squares-2 { + background: url('/squares.png') 100% -10px no-repeat; + } + + .squares-3 { + background: url('/squares.png') -4px -7px no-repeat; + } + + .squares-4 { + background-image: url('/squares.png'); + } + + .squares-5 { + background-image: url('/squares.png'); + } + CSS + end + end \ No newline at end of file