added tests and css selector support for sprites ending in _hover _target _active closes#248
This commit is contained in:
parent
e47fccd2ed
commit
9962a37b2e
@ -7,7 +7,7 @@ GIT
|
|||||||
PATH
|
PATH
|
||||||
remote: .
|
remote: .
|
||||||
specs:
|
specs:
|
||||||
compass (0.11.beta.3.3272dc7)
|
compass (0.11.beta.4.e47fccd)
|
||||||
chunky_png (~> 1.1.0)
|
chunky_png (~> 1.1.0)
|
||||||
sass (>= 3.1.0.alpha.249)
|
sass (>= 3.1.0.alpha.249)
|
||||||
|
|
||||||
|
@ -34,6 +34,21 @@
|
|||||||
@each $sprite-name in $sprite-names {
|
@each $sprite-name in $sprite-names {
|
||||||
$full-sprite-name: if($prefix and $prefix != "", "#{$prefix}-#{$sprite-name}", $sprite-name);
|
$full-sprite-name: if($prefix and $prefix != "", "#{$prefix}-#{$sprite-name}", $sprite-name);
|
||||||
.#{$full-sprite-name} {
|
.#{$full-sprite-name} {
|
||||||
|
@if sprite_has_hover($map, $sprite-name) {
|
||||||
|
&:hover {
|
||||||
|
@include sprite($map, "#{$sprite-name}_hover")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@if sprite_has_target($map, $sprite-name) {
|
||||||
|
&:target {
|
||||||
|
@include sprite($map, "#{$sprite-name}_target")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@if sprite_has_active($map, $sprite-name) {
|
||||||
|
&:active {
|
||||||
|
@include sprite($map, "#{$sprite-name}_active")
|
||||||
|
}
|
||||||
|
}
|
||||||
@if $base-class { @extend #{$base-class}; }
|
@if $base-class { @extend #{$base-class}; }
|
||||||
@include sprite($map, $sprite-name, $dimensions);
|
@include sprite($map, $sprite-name, $dimensions);
|
||||||
}
|
}
|
||||||
|
@ -34,9 +34,7 @@ module Compass::SassExtensions::Functions::Sprites
|
|||||||
#
|
#
|
||||||
# background: url('/images/icons.png?12345678') 0 -24px no-repeat;
|
# background: url('/images/icons.png?12345678') 0 -24px no-repeat;
|
||||||
def sprite(map, sprite, offset_x = ZERO, offset_y = ZERO)
|
def sprite(map, sprite, offset_x = ZERO, offset_y = ZERO)
|
||||||
unless map.is_a?(Compass::SassExtensions::Sprites::Base)
|
verify_map(map)
|
||||||
missing_sprite!("sprite")
|
|
||||||
end
|
|
||||||
unless sprite.is_a?(Sass::Script::String)
|
unless sprite.is_a?(Sass::Script::String)
|
||||||
raise Sass::SyntaxError, %Q(The second argument to sprite() must be a sprite name. See http://beta.compass-style.org/help/tutorials/spriting/ for more information.)
|
raise Sass::SyntaxError, %Q(The second argument to sprite() must be a sprite name. See http://beta.compass-style.org/help/tutorials/spriting/ for more information.)
|
||||||
end
|
end
|
||||||
@ -51,18 +49,15 @@ module Compass::SassExtensions::Functions::Sprites
|
|||||||
# Returns the name of a sprite map
|
# Returns the name of a sprite map
|
||||||
# The name is derived from the folder than contains the sprites.
|
# The name is derived from the folder than contains the sprites.
|
||||||
def sprite_map_name(map)
|
def sprite_map_name(map)
|
||||||
unless map.is_a?(Compass::SassExtensions::Sprites::Base)
|
verify_map(map, "sprite-map-name")
|
||||||
missing_sprite!("sprite-map-name")
|
|
||||||
end
|
|
||||||
Sass::Script::String.new(map.name)
|
Sass::Script::String.new(map.name)
|
||||||
end
|
end
|
||||||
Sass::Script::Functions.declare :sprite_name, [:sprite]
|
Sass::Script::Functions.declare :sprite_name, [:sprite]
|
||||||
|
|
||||||
# Returns the path to the original image file for the sprite with the given name
|
# Returns the path to the original image file for the sprite with the given name
|
||||||
def sprite_file(map, sprite)
|
def sprite_file(map, sprite)
|
||||||
unless map.is_a?(Compass::SassExtensions::Sprites::Base)
|
verify_map(map, "sprite")
|
||||||
missing_sprite!("sprite-file")
|
verify_sprite(sprite)
|
||||||
end
|
|
||||||
if image = map.image_for(sprite.value)
|
if image = map.image_for(sprite.value)
|
||||||
Sass::Script::String.new(image.relative_file)
|
Sass::Script::String.new(image.relative_file)
|
||||||
else
|
else
|
||||||
@ -71,11 +66,37 @@ module Compass::SassExtensions::Functions::Sprites
|
|||||||
end
|
end
|
||||||
Sass::Script::Functions.declare :sprite_file, [:map, :sprite]
|
Sass::Script::Functions.declare :sprite_file, [:map, :sprite]
|
||||||
|
|
||||||
|
# Returns boolean is sprite image has a hover selector
|
||||||
|
def sprite_has_hover(map, sprite)
|
||||||
|
verify_map(map)
|
||||||
|
verify_sprite(sprite)
|
||||||
|
Sass::Script::Bool.new map.has_hover?(sprite)
|
||||||
|
end
|
||||||
|
|
||||||
|
Sass::Script::Functions.declare :sprite_has_hover, [:map, :sprite]
|
||||||
|
|
||||||
|
# Returns boolean is sprite image has a target selector
|
||||||
|
def sprite_has_target(map, sprite)
|
||||||
|
verify_map(map)
|
||||||
|
verify_sprite(sprite)
|
||||||
|
Sass::Script::Bool.new map.has_target?(sprite)
|
||||||
|
end
|
||||||
|
|
||||||
|
Sass::Script::Functions.declare :sprite_has_target, [:map, :sprite]
|
||||||
|
|
||||||
|
# Returns boolean is sprite image has a active selector
|
||||||
|
def sprite_has_active(map, sprite)
|
||||||
|
verify_map(map)
|
||||||
|
verify_sprite(sprite)
|
||||||
|
Sass::Script::Bool.new map.has_active?(sprite)
|
||||||
|
end
|
||||||
|
|
||||||
|
Sass::Script::Functions.declare :sprite_has_active, [:map, :sprite]
|
||||||
|
|
||||||
|
|
||||||
# Returns a url to the sprite image.
|
# Returns a url to the sprite image.
|
||||||
def sprite_url(map)
|
def sprite_url(map)
|
||||||
unless map.is_a?(Compass::SassExtensions::Sprites::Base)
|
verify_map(map, "sprite-url")
|
||||||
missing_sprite!("sprite-url")
|
|
||||||
end
|
|
||||||
map.generate
|
map.generate
|
||||||
image_url(Sass::Script::String.new("#{map.path}-#{map.uniqueness_hash}.png"),
|
image_url(Sass::Script::String.new("#{map.path}-#{map.uniqueness_hash}.png"),
|
||||||
Sass::Script::Bool.new(false),
|
Sass::Script::Bool.new(false),
|
||||||
@ -103,9 +124,7 @@ module Compass::SassExtensions::Functions::Sprites
|
|||||||
#
|
#
|
||||||
# background-position: 3px -36px;
|
# background-position: 3px -36px;
|
||||||
def sprite_position(map, sprite = nil, offset_x = ZERO, offset_y = ZERO)
|
def sprite_position(map, sprite = nil, offset_x = ZERO, offset_y = ZERO)
|
||||||
unless map.is_a?(Compass::SassExtensions::Sprites::Base)
|
verify_map(map, "sprite-position")
|
||||||
missing_sprite!("sprite-position")
|
|
||||||
end
|
|
||||||
unless sprite && sprite.is_a?(Sass::Script::String)
|
unless sprite && sprite.is_a?(Sass::Script::String)
|
||||||
raise Sass::SyntaxError, %Q(The second argument to sprite-position must be a sprite name. See http://beta.compass-style.org/help/tutorials/spriting/ for more information.)
|
raise Sass::SyntaxError, %Q(The second argument to sprite-position must be a sprite name. See http://beta.compass-style.org/help/tutorials/spriting/ for more information.)
|
||||||
end
|
end
|
||||||
@ -134,6 +153,18 @@ module Compass::SassExtensions::Functions::Sprites
|
|||||||
|
|
||||||
protected
|
protected
|
||||||
|
|
||||||
|
def verify_map(map, error = "sprite")
|
||||||
|
unless map.is_a?(Compass::SassExtensions::Sprites::Base)
|
||||||
|
missing_sprite!(error)
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
|
def verify_sprite(sprite)
|
||||||
|
unless sprite.is_a?(Sass::Script::String)
|
||||||
|
raise Sass::SyntaxError, %Q(The second argument to sprite() must be a sprite name. See http://beta.compass-style.org/help/tutorials/spriting/ for more information.)
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
def missing_image!(map, sprite)
|
def missing_image!(map, sprite)
|
||||||
raise Sass::SyntaxError, "No sprite called #{sprite} found in sprite map #{map.path}/#{map.name}. Did you mean one of: #{map.sprite_names.join(", ")}"
|
raise Sass::SyntaxError, "No sprite called #{sprite} found in sprite map #{map.path}/#{map.name}. Did you mean one of: #{map.sprite_names.join(", ")}"
|
||||||
end
|
end
|
||||||
|
@ -467,4 +467,41 @@ describe Compass::Sprites do
|
|||||||
CSS
|
CSS
|
||||||
end
|
end
|
||||||
|
|
||||||
end
|
it "should render corret sprite with css selectors via issue#248" do
|
||||||
|
css = render <<-SCSS
|
||||||
|
@import "selectors/*.png";
|
||||||
|
@include all-selectors-sprites;
|
||||||
|
SCSS
|
||||||
|
css.should == <<-CSS
|
||||||
|
.selectors-sprite, .selectors-ten-by-ten, .selectors-ten-by-ten_active, .selectors-ten-by-ten_hover, .selectors-ten-by-ten_target {
|
||||||
|
background: url('/selectors-edfef809e2.png') no-repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectors-ten-by-ten {
|
||||||
|
background-position: 0 0;
|
||||||
|
}
|
||||||
|
.selectors-ten-by-ten:hover {
|
||||||
|
background-position: 0 -20px;
|
||||||
|
}
|
||||||
|
.selectors-ten-by-ten:target {
|
||||||
|
background-position: 0 -30px;
|
||||||
|
}
|
||||||
|
.selectors-ten-by-ten:active {
|
||||||
|
background-position: 0 -10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectors-ten-by-ten_active {
|
||||||
|
background-position: 0 -10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectors-ten-by-ten_hover {
|
||||||
|
background-position: 0 -20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectors-ten-by-ten_target {
|
||||||
|
background-position: 0 -30px;
|
||||||
|
}
|
||||||
|
CSS
|
||||||
|
end
|
||||||
|
|
||||||
|
end
|
||||||
|
Loading…
Reference in New Issue
Block a user