Skip to content

Commit

Permalink
Don't rely on reading the environment within the sprite code. Instead…
Browse files Browse the repository at this point in the history 
… accept variable keyword args.
  • Loading branch information
@chriseppstein
chriseppstein committed Nov 30, 2010
1 parent 043d082 commit 40d3260
Show file tree
Hide file tree
Showing 2 changed files with 118 additions and 67 deletions.
40 changes: 31 additions & 9 deletions lib/compass/sass_extensions/functions/sprites.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,32 @@
module Compass::SassExtensions::Functions::Sprites
SASS_NULL = Sass::Script::Number::new(0)

def generate_sprite_image(uri)
# Provides a consistent interface for getting a variable in ruby
# from a keyword argument hash that accounts for underscores/dash equivalence
# and allows the caller to pass a symbol instead of a string.
module VariableReader
def get_var(variable_name)
self[variable_name.to_s.gsub(/-/,"_")]
end
end

def generate_sprite_image(uri, kwargs = {})
kwargs.extend VariableReader
path, name = Compass::Sprites.path_and_name(uri.value)
last_spacing = 0
width = 0
height = 0

# Get image metadata
Compass::Sprites.discover_sprites(uri.value).each do |file|
Compass::Sprites.compute_image_metadata! file, path, name
end

images = Compass::Sprites.sprites(path, name)

# Calculation
images.each do |image|
current_spacing = number_from_var("#{name}-#{image[:name]}-spacing")
current_spacing = number_from_var(kwargs, "#{image[:name]}-spacing", 0)
if height > 0
height += [current_spacing, last_spacing].max
end
Expand All @@ -27,14 +43,18 @@ def generate_sprite_image(uri)
images.each do |image|
input_png = ChunkyPNG::Image.from_file(image[:file])

position = environment.var("#{name}-#{image[:name]}-position")
position = kwargs.get_var("#{image[:name]}-position") || Sass::Script::Number.new(0, ["%"])
if position.unit_str == "%"
image[:x] = (width - image[:width]) * (position.value / 100)
else
image[:x] = position.value
end

repeat = environment.var("#{name}-#{image[:name]}-repeat").to_s
repeat = if (var = kwargs.get_var("#{image[:name]}-repeat"))
var.value
else
"no-repeat"
end
if repeat == "no-repeat"
output_png.replace input_png, image[:x], image[:y]
else
Expand All @@ -49,6 +69,7 @@ def generate_sprite_image(uri)

sprite_url(uri)
end
Sass::Script::Functions.declare :generate_sprite_image, [:uri], :var_kwargs => true

def sprite_image(uri, x_shift = SASS_NULL, y_shift = SASS_NULL, depricated_1 = nil, depricated_2 = nil)
check_spacing_deprecation uri, depricated_1, depricated_2
Expand Down Expand Up @@ -80,11 +101,12 @@ def sprite_position(uri, x_shift = SASS_NULL, y_shift = SASS_NULL, depricated_1

private

def number_from_var(var_name)
if var = environment.var(var_name)
var.value
def number_from_var(kwargs, var_name, default_value)
if number = kwargs.get_var(var_name)
assert_type number, :Number
number.value
else
0
default_value
end
end

Expand Down
145 changes: 87 additions & 58 deletions lib/compass/sprites.rb
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,25 @@ def sprites(path, name, create = false)
raise Compass::Error, %Q(`@import` statement missing. Please add `@import "#{path}/*.png";`.)
end
end

def discover_sprites(uri)
glob = File.join(Compass.configuration.images_path, uri)
Dir.glob(glob).sort
end

def compute_image_metadata!(file, path, name)
width, height = Compass::SassExtensions::Functions::ImageSize::ImageProperties.new(file).size
sprite_name = File.basename(file, '.png');
unless sprite_name =~ /\A#{Sass::SCSS::RX::IDENT}\Z/
raise Sass::SyntaxError, "#{sprite_name} must be a legal css identifier"
end
sprites(path, name, true) << {
:name => sprite_name,
:file => file,
:height => height,
:width => width
}
end
end

def images
Expand All @@ -37,68 +56,78 @@ def images
def find(uri, options)
if uri =~ /\.png$/
self.path, self.name = Compass::Sprites.path_and_name(uri)
glob = File.join(Compass.configuration.images_path, uri)
Dir.glob(glob).sort.each do |file|
width, height = Compass::SassExtensions::Functions::ImageSize::ImageProperties.new(file).size
images << {
:name => File.basename(file, '.png'),
:file => file,
:height => height,
:width => width
}
end

contents = <<-SCSS
$#{name}-sprite-base-class: ".#{name}-sprite" !default;
$#{name}-sprite-dimensions: false !default;
$#{name}-position: 0% !default;
$#{name}-spacing: 0 !default;
$#{name}-repeat: no-repeat !default;
#{images.map do |sprite|
<<-SCSS
$#{name}-#{sprite[:name]}-position: $#{name}-position !default;
$#{name}-#{sprite[:name]}-spacing: $#{name}-spacing !default;
$#{name}-#{sprite[:name]}-repeat: $#{name}-repeat !default;
SCSS
end.join}
\#{$#{name}-sprite-base-class} {
background: generate-sprite-image("#{uri}") no-repeat;
}
@mixin #{name}-sprite-dimensions($sprite) {
height: image-height("#{name}/\#{$sprite}.png");
width: image-width("#{name}/\#{$sprite}.png");
}
@mixin #{name}-sprite-position($sprite, $x: 0, $y: 0) {
background-position: sprite-position("#{path}/\#{$sprite}.png", $x, $y);
}
@mixin #{name}-sprite($sprite, $dimensions: $#{name}-sprite-dimensions, $x: 0, $y: 0) {
@extend \#{$#{name}-sprite-base-class};
@include #{name}-sprite-position($sprite, $x, $y);
@if $dimensions {
@include #{name}-sprite-dimensions($sprite);
}
}
@mixin all-#{name}-sprites {
#{images.map do |sprite|
<<-SCSS
.#{name}-#{sprite[:name]} {
@include #{name}-sprite("#{sprite[:name]}");
}
SCSS
end.join}
}
SCSS
options.merge! :filename => name, :syntax => :scss, :importer => self
Sass::Engine.new(contents, options)
image_names = Compass::Sprites.discover_sprites(uri).map{|i| File.basename(i, '.png')}
Sass::Engine.new(content_for_images(uri, name, image_names), options)
end
end

def content_for_images(uri, name, images)
<<-SCSS
// General Sprite Defaults
// You can override them before you import this file.
$#{name}-sprite-base-class: ".#{name}-sprite" !default;
$#{name}-sprite-dimensions: false !default;
$#{name}-position: 0% !default;
$#{name}-spacing: 0 !default;
$#{name}-repeat: no-repeat !default;
// These variables control the generated sprite output
// You can override them selectively before you import this file.
#{images.map do |sprite_name|
<<-SCSS
$#{name}-#{sprite_name}-position: $#{name}-position !default;
$#{name}-#{sprite_name}-spacing: $#{name}-spacing !default;
$#{name}-#{sprite_name}-repeat: $#{name}-repeat !default;
SCSS
end.join}
// All sprites should extend this class
// The #{name}-sprite mixin will do so for you.
\#{$#{name}-sprite-base-class} {
background: generate-sprite-image("#{uri}",
#{images.map do |sprite_name|
%Q{ $#{sprite_name}-position: $#{name}-#{sprite_name}-position,
$#{sprite_name}-spacing: $#{name}-#{sprite_name}-spacing,
$#{sprite_name}-repeat: $#{name}-#{sprite_name}-repeat}
end.join(",\n")}) no-repeat;
}
// Use this to set the dimensions of an element
// based on the size of the original image.
@mixin #{name}-sprite-dimensions($sprite) {
height: image-height("#{name}/\#{$sprite}.png");
width: image-width("#{name}/\#{$sprite}.png");
}
// Move the background position to display the sprite.
@mixin #{name}-sprite-position($sprite, $x: 0, $y: 0) {
background-position: sprite-position("#{path}/\#{$sprite}.png", $x, $y);
}
// Extends the sprite base class and set the background position for the desired sprite.
// It will also apply the image dimensions if $dimensions is true.
@mixin #{name}-sprite($sprite, $dimensions: $#{name}-sprite-dimensions, $x: 0, $y: 0) {
@extend \#{$#{name}-sprite-base-class};
@include #{name}-sprite-position($sprite, $x, $y);
@if $dimensions {
@include #{name}-sprite-dimensions($sprite);
}
}
// Generates a class for each sprited image.
@mixin all-#{name}-sprites {
#{images.map do |sprite_name|
<<-SCSS
.#{name}-#{sprite_name} {
@include #{name}-sprite("#{sprite_name}");
}
SCSS
end.join}
}
SCSS
end
def key(uri, options)
[self.class.name + ":" + File.dirname(File.expand_path(uri)),
File.basename(uri)]
Expand Down

0 comments on commit 40d3260

Please sign in to comment.