css_sprite 1.4.2 → 1.4.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/README.textile +23 -9
- data/VERSION +1 -1
- data/css_sprite.gemspec +4 -4
- data/lib/css_sprite/sprite.rb +25 -8
- data/spec/css_sprite/sprite_spec.rb +14 -1
- data/spec/public/images/css_sprite/icons/twitter_icon_hover.png +0 -0
- data/spec/spec_helper.rb +1 -0
- metadata +10 -19
- data/spec/public/images/css_sprite/.DS_Store +0 -0
data/README.textile
CHANGED
@@ -4,6 +4,14 @@ automatically css sprite.
|
|
4
4
|
|
5
5
|
*************************************************************************
|
6
6
|
|
7
|
+
h2. Best Practices
|
8
|
+
|
9
|
+
I have written posts "css sprite best practices" to introduce the idea that the css_sprite gem follows.
|
10
|
+
"english version":http://www.huangzhimin.com/entries/190-css-sprite-best-practices
|
11
|
+
"chinese version":http://www.huangzhimin.com/entries/189-css-sprite-best-practices
|
12
|
+
|
13
|
+
**************************************************************************
|
14
|
+
|
7
15
|
h2. What css_sprite does?
|
8
16
|
|
9
17
|
css sprite generates css_sprite image and css files automatically for you follow the conventions as follows.
|
@@ -67,16 +75,30 @@ h2. Configuration
|
|
67
75
|
|
68
76
|
There is no need to create any configuration by default. If you want some customizations as follows, you need to define <code>config/css_sprite.yml</code> file.
|
69
77
|
|
78
|
+
h3. ImageType
|
79
|
+
|
80
|
+
css_sprite uses RMagick to compose the images by default. It uses PaletteMatteType as default image_type, you can change it to any image_type which RMagick supports.
|
81
|
+
|
82
|
+
<pre><code>image_type: PaletteType</code></pre>
|
83
|
+
|
84
|
+
Check the detailed information of image_type here: http://www.imagemagick.org/RMagick/doc/constants.html#ImageType
|
85
|
+
|
70
86
|
h3. Sass
|
71
87
|
|
88
|
+
css_sprite generates css file by default. If you like sass, you can just add following line in the configuration file.
|
89
|
+
|
72
90
|
<pre><code>engine:sass</code></pre>
|
73
91
|
|
74
92
|
h3. Image Optimization
|
75
93
|
|
76
|
-
css_sprite
|
94
|
+
css_sprite uses *optipng* with optimization level 2 to optimize the auto generated css_sprite image by default. You can change it to any image optimization command.
|
77
95
|
|
78
96
|
<pre><code>optimization: optipng -o 7</code></pre>
|
79
97
|
|
98
|
+
You can also disable the image optimization by
|
99
|
+
|
100
|
+
<pre><code>disable_optimization: true</code></pre>
|
101
|
+
|
80
102
|
h3. Customization styles
|
81
103
|
|
82
104
|
* For css
|
@@ -119,12 +141,4 @@ if your image filename is icon suffixed (e.g. twitter_icon.png), the correspondi
|
|
119
141
|
|
120
142
|
**************************************************************************
|
121
143
|
|
122
|
-
h2. Best Practices
|
123
|
-
|
124
|
-
I have written posts "css sprite best practices" to introduce the idea that the css_sprite gem follows.
|
125
|
-
"english version":http://www.huangzhimin.com/entries/190-css-sprite-best-practices
|
126
|
-
"chinese version":http://www.huangzhimin.com/entries/189-css-sprite-best-practices
|
127
|
-
|
128
|
-
**************************************************************************
|
129
|
-
|
130
144
|
Copyright (c) 2009 [Richard Huang (flyerhzm@gmail.com)], released under the MIT license
|
data/VERSION
CHANGED
@@ -1 +1 @@
|
|
1
|
-
1.4.
|
1
|
+
1.4.3
|
data/css_sprite.gemspec
CHANGED
@@ -5,11 +5,11 @@
|
|
5
5
|
|
6
6
|
Gem::Specification.new do |s|
|
7
7
|
s.name = %q{css_sprite}
|
8
|
-
s.version = "1.4.
|
8
|
+
s.version = "1.4.3"
|
9
9
|
|
10
10
|
s.required_rubygems_version = Gem::Requirement.new(">= 0") if s.respond_to? :required_rubygems_version=
|
11
11
|
s.authors = ["Richard Huang"]
|
12
|
-
s.date = %q{2010-04-
|
12
|
+
s.date = %q{2010-04-10}
|
13
13
|
s.description = %q{css_sprite is a rails plugin/gem to generate css sprite image automatically.}
|
14
14
|
s.email = %q{flyerhzm@gmail.com}
|
15
15
|
s.extra_rdoc_files = [
|
@@ -26,12 +26,12 @@ Gem::Specification.new do |s|
|
|
26
26
|
"lib/css_sprite/sprite.rb",
|
27
27
|
"spec/css_sprite/sprite_spec.rb",
|
28
28
|
"spec/public/images/another_css_sprite/no_image",
|
29
|
-
"spec/public/images/css_sprite/.DS_Store",
|
30
29
|
"spec/public/images/css_sprite/gmail_logo.png",
|
31
30
|
"spec/public/images/css_sprite/hotmail_logo.png",
|
32
31
|
"spec/public/images/css_sprite/icons/facebook_icon.png",
|
33
32
|
"spec/public/images/css_sprite/icons/facebook_icon_hover.png",
|
34
33
|
"spec/public/images/css_sprite/icons/twitter_icon.png",
|
34
|
+
"spec/public/images/css_sprite/icons/twitter_icon_hover.png",
|
35
35
|
"spec/public/images/css_sprite/not_image.txt",
|
36
36
|
"spec/spec.opts",
|
37
37
|
"spec/spec_helper.rb",
|
@@ -40,7 +40,7 @@ Gem::Specification.new do |s|
|
|
40
40
|
s.homepage = %q{http://github.com/flyerhzm/css_sprite}
|
41
41
|
s.rdoc_options = ["--charset=UTF-8"]
|
42
42
|
s.require_paths = ["lib"]
|
43
|
-
s.rubygems_version = %q{1.3.
|
43
|
+
s.rubygems_version = %q{1.3.5}
|
44
44
|
s.summary = %q{css_sprite is a rails plugin/gem to generate css sprite image automatically.}
|
45
45
|
s.test_files = [
|
46
46
|
"spec/css_sprite/sprite_spec.rb",
|
data/lib/css_sprite/sprite.rb
CHANGED
@@ -83,15 +83,19 @@ class Sprite
|
|
83
83
|
results << image_properties(source_image, directory).merge(:x => x, :y => y)
|
84
84
|
dest_image = composite_images(dest_image, source_image, x, y)
|
85
85
|
end
|
86
|
-
dest_image.image_type = Magick::PaletteMatteType
|
86
|
+
dest_image.image_type = @config['image_type'] ? Magick.const_get(@config['image_type']) : Magick::PaletteMatteType
|
87
87
|
dest_image.write(dest_image_path)
|
88
88
|
end
|
89
89
|
results
|
90
90
|
end
|
91
91
|
|
92
92
|
def optimize_image(directory)
|
93
|
-
|
94
|
-
|
93
|
+
unless @config['disable_optimization']
|
94
|
+
dest_image_path = dest_image_path(directory)
|
95
|
+
command = @config['optimization'] ? "#{@config['optimization']} #{dest_image_path}" : "optipng -quiet #{dest_image_path}"
|
96
|
+
result = system(command)
|
97
|
+
puts %Q(Optimization command "#{command}" execute failed) unless result
|
98
|
+
end
|
95
99
|
end
|
96
100
|
|
97
101
|
def output_css(directory, results)
|
@@ -118,8 +122,8 @@ class Sprite
|
|
118
122
|
results.each do |result|
|
119
123
|
f.print "#{class_name(result[:name])} \{"
|
120
124
|
f.print " background-position: #{-result[:x]}px #{-result[:y]}px;"
|
121
|
-
f.print " width: #{result[:width]}px;"
|
122
|
-
f.print " height: #{result[:height]}px;"
|
125
|
+
f.print " width: #{result[:width]}px;" if result[:width]
|
126
|
+
f.print " height: #{result[:height]}px;" if result[:height]
|
123
127
|
f.print " \}\n"
|
124
128
|
end
|
125
129
|
end
|
@@ -150,8 +154,8 @@ class Sprite
|
|
150
154
|
results.each do |result|
|
151
155
|
f.print "#{class_name(result[:name])}\n"
|
152
156
|
f.print " background-position: #{-result[:x]}px #{-result[:y]}px\n"
|
153
|
-
f.print " width: #{result[:width]}px\n"
|
154
|
-
f.print " height: #{result[:height]}px\n"
|
157
|
+
f.print " width: #{result[:width]}px\n" if result[:width]
|
158
|
+
f.print " height: #{result[:height]}px\n" if result[:height]
|
155
159
|
end
|
156
160
|
end
|
157
161
|
end
|
@@ -213,7 +217,20 @@ class Sprite
|
|
213
217
|
def image_properties(image, directory)
|
214
218
|
directory_length = directory.length + 1
|
215
219
|
extname_length = File.extname(image.filename).length
|
216
|
-
|
220
|
+
name = image.filename.slice(directory_length...-extname_length)
|
221
|
+
without = false
|
222
|
+
if hover?(name)
|
223
|
+
not_hover_file = image.filename.sub(/[_-]hover\./, '.')
|
224
|
+
if File.exist?(not_hover_file)
|
225
|
+
not_hover_image = get_image(not_hover_file)
|
226
|
+
without = true if image.columns == not_hover_image.columns and image.rows == not_hover_image.rows
|
227
|
+
end
|
228
|
+
end
|
229
|
+
without ? {:name => name} : {:name => name, :width => image.columns, :height => image.rows}
|
230
|
+
end
|
231
|
+
|
232
|
+
def hover?(name)
|
233
|
+
name =~ /[_-]hover/
|
217
234
|
end
|
218
235
|
|
219
236
|
end
|
@@ -8,14 +8,26 @@ describe Sprite do
|
|
8
8
|
|
9
9
|
describe "build" do
|
10
10
|
it "should build css_sprite image and css" do
|
11
|
-
|
11
|
+
Sprite.any_instance.expects(:system).with("optipng -quiet #{IMAGE_PATH}/css_sprite.png").returns(true)
|
12
|
+
Sprite.new.build
|
12
13
|
end
|
13
14
|
|
14
15
|
it "should build css_sprite image and sass" do
|
16
|
+
Sprite.any_instance.expects(:system).with("optipng -quiet #{IMAGE_PATH}/css_sprite.png").returns(true)
|
15
17
|
Sprite.new('engine' => 'sass').build
|
16
18
|
end
|
17
19
|
|
20
|
+
it "should build another image_type" do
|
21
|
+
Sprite.any_instance.expects(:system).with("optipng -quiet #{IMAGE_PATH}/css_sprite.png").returns(true)
|
22
|
+
Sprite.new('image_type' => 'PaletteType').build
|
23
|
+
end
|
24
|
+
|
25
|
+
it "should disable image optimization" do
|
26
|
+
Sprite.new('disable_optimization' => true).build
|
27
|
+
end
|
28
|
+
|
18
29
|
it "should build another image optimization" do
|
30
|
+
Sprite.any_instance.expects(:system).with("optipng -o 1 #{IMAGE_PATH}/css_sprite.png").returns(true)
|
19
31
|
Sprite.new('optimization' => "optipng -o 1").build
|
20
32
|
end
|
21
33
|
end
|
@@ -37,6 +49,7 @@ describe Sprite do
|
|
37
49
|
describe "all_images" do
|
38
50
|
it "should read all images from a directory" do
|
39
51
|
expected_images = [File.join(IMAGE_PATH, 'css_sprite/icons/twitter_icon.png'),
|
52
|
+
File.join(IMAGE_PATH, 'css_sprite/icons/twitter_icon_hover.png'),
|
40
53
|
File.join(IMAGE_PATH, 'css_sprite/icons/facebook_icon.png'),
|
41
54
|
File.join(IMAGE_PATH, 'css_sprite/icons/facebook_icon_hover.png'),
|
42
55
|
File.join(IMAGE_PATH, 'css_sprite/hotmail_logo.png'),
|
Binary file
|
data/spec/spec_helper.rb
CHANGED
metadata
CHANGED
@@ -1,12 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: css_sprite
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
|
5
|
-
segments:
|
6
|
-
- 1
|
7
|
-
- 4
|
8
|
-
- 2
|
9
|
-
version: 1.4.2
|
4
|
+
version: 1.4.3
|
10
5
|
platform: ruby
|
11
6
|
authors:
|
12
7
|
- Richard Huang
|
@@ -14,21 +9,19 @@ autorequire:
|
|
14
9
|
bindir: bin
|
15
10
|
cert_chain: []
|
16
11
|
|
17
|
-
date: 2010-04-
|
12
|
+
date: 2010-04-10 00:00:00 -06:00
|
18
13
|
default_executable:
|
19
14
|
dependencies:
|
20
15
|
- !ruby/object:Gem::Dependency
|
21
16
|
name: rmagick
|
22
|
-
|
23
|
-
|
17
|
+
type: :runtime
|
18
|
+
version_requirement:
|
19
|
+
version_requirements: !ruby/object:Gem::Requirement
|
24
20
|
requirements:
|
25
21
|
- - ">="
|
26
22
|
- !ruby/object:Gem::Version
|
27
|
-
segments:
|
28
|
-
- 0
|
29
23
|
version: "0"
|
30
|
-
|
31
|
-
version_requirements: *id001
|
24
|
+
version:
|
32
25
|
description: css_sprite is a rails plugin/gem to generate css sprite image automatically.
|
33
26
|
email: flyerhzm@gmail.com
|
34
27
|
executables: []
|
@@ -48,12 +41,12 @@ files:
|
|
48
41
|
- lib/css_sprite/sprite.rb
|
49
42
|
- spec/css_sprite/sprite_spec.rb
|
50
43
|
- spec/public/images/another_css_sprite/no_image
|
51
|
-
- spec/public/images/css_sprite/.DS_Store
|
52
44
|
- spec/public/images/css_sprite/gmail_logo.png
|
53
45
|
- spec/public/images/css_sprite/hotmail_logo.png
|
54
46
|
- spec/public/images/css_sprite/icons/facebook_icon.png
|
55
47
|
- spec/public/images/css_sprite/icons/facebook_icon_hover.png
|
56
48
|
- spec/public/images/css_sprite/icons/twitter_icon.png
|
49
|
+
- spec/public/images/css_sprite/icons/twitter_icon_hover.png
|
57
50
|
- spec/public/images/css_sprite/not_image.txt
|
58
51
|
- spec/spec.opts
|
59
52
|
- spec/spec_helper.rb
|
@@ -71,20 +64,18 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
71
64
|
requirements:
|
72
65
|
- - ">="
|
73
66
|
- !ruby/object:Gem::Version
|
74
|
-
segments:
|
75
|
-
- 0
|
76
67
|
version: "0"
|
68
|
+
version:
|
77
69
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
78
70
|
requirements:
|
79
71
|
- - ">="
|
80
72
|
- !ruby/object:Gem::Version
|
81
|
-
segments:
|
82
|
-
- 0
|
83
73
|
version: "0"
|
74
|
+
version:
|
84
75
|
requirements: []
|
85
76
|
|
86
77
|
rubyforge_project:
|
87
|
-
rubygems_version: 1.3.
|
78
|
+
rubygems_version: 1.3.5
|
88
79
|
signing_key:
|
89
80
|
specification_version: 3
|
90
81
|
summary: css_sprite is a rails plugin/gem to generate css sprite image automatically.
|
Binary file
|