sprite-factory 1.5.1 → 1.5.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (42) hide show
  1. data/README.md +37 -30
  2. data/RELEASE_NOTES.md +8 -2
  3. data/bin/sf +2 -2
  4. data/lib/sprite_factory/library/rmagick.rb +1 -1
  5. data/lib/sprite_factory/runner.rb +32 -12
  6. data/lib/sprite_factory/style.rb +2 -4
  7. data/lib/sprite_factory.rb +2 -2
  8. data/test/images/formats/codeincomplete.ico +0 -0
  9. data/test/images/formats/github.ico +0 -0
  10. data/test/images/formats/stackoverflow.ico +0 -0
  11. data/test/images/hover/div.bar__img.icon--active.png +0 -0
  12. data/test/images/hover/div.bar__img.icon--focus.png +0 -0
  13. data/test/images/hover/div.bar__img.icon--link.png +0 -0
  14. data/test/images/hover/div.bar__img.icon--visited.png +0 -0
  15. data/test/images/hover/div.foo__img.icon--active.png +0 -0
  16. data/test/images/hover/div.foo__img.icon--focus.png +0 -0
  17. data/test/images/hover/div.foo__img.icon--link.png +0 -0
  18. data/test/images/hover/div.foo__img.icon--visited.png +0 -0
  19. data/test/images/reference/custom.png +0 -0
  20. data/test/images/reference/formats.css +10 -4
  21. data/test/images/reference/formats.png +0 -0
  22. data/test/images/reference/hover.css +23 -7
  23. data/test/images/reference/hover.png +0 -0
  24. data/test/images/reference/irregular.fixed.png +0 -0
  25. data/test/images/reference/irregular.horizontal.png +0 -0
  26. data/test/images/reference/irregular.margin.png +0 -0
  27. data/test/images/reference/irregular.packed.png +0 -0
  28. data/test/images/reference/irregular.padded.png +0 -0
  29. data/test/images/reference/irregular.png +0 -0
  30. data/test/images/reference/irregular.sassy.png +0 -0
  31. data/test/images/reference/irregular.vertical.png +0 -0
  32. data/test/images/reference/regular.fixed.png +0 -0
  33. data/test/images/reference/regular.horizontal.png +0 -0
  34. data/test/images/reference/regular.margin.png +0 -0
  35. data/test/images/reference/regular.packed.png +0 -0
  36. data/test/images/reference/regular.padded.png +0 -0
  37. data/test/images/reference/regular.png +0 -0
  38. data/test/images/reference/regular.sassy.png +0 -0
  39. data/test/images/reference/regular.vertical.png +0 -0
  40. data/test/runner_test.rb +47 -8
  41. data/test/style_test.rb +2 -2
  42. metadata +63 -60
data/README.md CHANGED
@@ -1,4 +1,4 @@
1
- Sprite Factory (v1.5.0)
1
+ Sprite Factory (v1.5.2)
2
2
  =======================
3
3
 
4
4
  The sprite factory is a ruby library that can be used to generate
@@ -88,7 +88,7 @@ Much of the behavior can be customized by overriding the following options:
88
88
  - `:style` - specify stylesheet syntax (css, scss or sass)
89
89
  - `:library` - specify image library to use (rmagick or chunkypng)
90
90
  - `:selector` - specify custom css selector (see below)
91
- - `:csspath` - specify custom path for css image url (see below)
91
+ - `:cssurl` - specify custom css url (see below)
92
92
  - `:output_image` - specify output location for generated image (default: <input folder>.png)
93
93
  - `:output_style` - specify output location for generated stylesheet (default: <input folder>.<style>)
94
94
  - `:pngcrush` - pngcrush the generated output image (if pngcrush is available)
@@ -199,41 +199,49 @@ map '--' (double dash) to a colon ':' in any source image filename. For example:
199
199
  span.icon_alert { ... first file ... }
200
200
  span.icon_alert:hover { ... second file ... }
201
201
 
202
- Customizing the CSS Image Path
203
- ==============================
202
+ Customizing the CSS Image Url
203
+ =============================
204
204
 
205
205
  Within the generated CSS file, it can be tricky to get the correct path to your unified
206
206
  sprite image. For example, you might be hosting your images on Amazon S3, or if you are
207
207
  building a Ruby on Rails application you might need to generate URL's using the `#image_path`
208
- helper method to ensure it gets the appopriate cache-busting query parameter.
208
+ helper method to ensure it gets the appropriate cache-busting query parameter.
209
209
 
210
- By default, the SpriteFactory generates simple url's that contain only the basename of the
211
- unified sprite image, but you can control the generation of these url's using the `:csspath`
212
- option:
210
+ By default, the SpriteFactory generates simple url's that contain the basename of the
211
+ unified sprite image, e.g:
212
+
213
+ SpriteFactory.run('icons')
214
+
215
+ # generates: url(icons.png)
216
+
217
+ ...but you can control the generation of these url's using the `:cssurl` option:
213
218
 
214
219
  For most CDN's, you can prepend a simple string to the image name:
215
220
 
216
- SpriteFactory.run('images/icons',
217
- :csspath => "http://s3.amazonaws.com/")
221
+ SpriteFactory.run('icons',
222
+ :cssurl => "http://s3.amazonaws.com/")
218
223
 
219
224
  # generates: url(http://s3.amazonaws.com/icons.png)
220
225
 
221
- For more control, a simple token replacement can be performed using the $IMAGE token. For example, to embed ERB
222
- into the generated style file and let Rails generate the paths you can use:
226
+ For more control, a simple token replacement can be performed using the $IMAGE token. For example, to generate calls
227
+ to custom Sass helper functions, such as those provided by [sass-rails](https://github.com/rails/sass-rails) plugin:
228
+
229
+ SpriteFactory.run('icons',
230
+ :cssurl => "image-url('$IMAGE')")
223
231
 
224
- SpriteFactory.run('images/icons',
225
- :csspath => "<%= image_path('$IMAGE') %>")
232
+ # generates: image-url('icons.png')
226
233
 
227
- # generates: url(<%= image_path('icons.png') %>)
228
234
 
229
- >> _this assumes Rails will post-process the css file with ERB (e.g. using sprockets in the Rails 3.1 asset pipeline)_
235
+ For full control, you can provide a lambda function and generate your own values:
230
236
 
231
- For full control, you can provide a lambda function and generate your own paths:
237
+ SpriteFactory.run('icons',
238
+ :cssurl => lambda{|image| "url(#{image_path(image)})" })
232
239
 
233
- SpriteFactory.run('images/icons',
234
- :csspath => lambda{|image| image_path(image)})
240
+ # generates: url(/path/to/my/images/icons.png?v123456)
235
241
 
236
- # generates: url(/images/icons.png?v123456)
242
+ >> NOTE: the `:cssurl` option replaces `:csspath` from earlier versions. The previous option only let you
243
+ customize the path inside of the generated `url(...)`, while this new option allows you to customize the
244
+ entire value, including the outer `url(...)` itself.
237
245
 
238
246
  Customizing the entire CSS output
239
247
  =================================
@@ -263,18 +271,18 @@ value is a hash of image metadata that includes the following:
263
271
  * `:width` - the image width
264
272
  * `:height` - the image height
265
273
 
266
- (*NOTE*: the image coords can differ form the css sprite coords when padding/margin or fixed width/height options are specified)
274
+ >> NOTE: the image coords can differ form the css sprite coords when padding/margin or fixed width/height options are specified)
267
275
 
268
- Using sprite-factory with the Rails 3.1 asset pipeline
269
- ======================================================
276
+ Using sprite-factory with the Rails asset pipeline
277
+ ==================================================
270
278
 
271
- The sprite-factory gem (>= v1.4.0) plays nice with the upcoming Rails 3.1 asset pipeline with a few simple steps:
279
+ The sprite-factory gem plays nice with the Rails asset pipeline with a few simple steps:
272
280
 
273
281
  Add the sprite-factory to your Gemfile, including your chosen image library dependency:
274
282
 
275
283
  group :assets do
276
- gem 'sprite-factory', '>= 1.4.0'
277
- gem 'chunky_png'
284
+ gem 'sprite-factory', '>= 1.5.2'
285
+ gem 'rmagick'
278
286
  end
279
287
 
280
288
  Store your images in Rails 3.1 `app/assets/images` sub-folders, e.g
@@ -290,8 +298,7 @@ Create a Rake task for regenerating your sprites, e.g. in `lib/tasks/assets.rake
290
298
  namespace :assets do
291
299
  desc 'recreate sprite images and css'
292
300
  task :resprite => :environment do
293
- SpriteFactory.library = :chunkypng # use chunkypng as underlying image library
294
- SpriteFactory.csspath = "<%= asset_path '$IMAGE' %>" # embed ERB into css file to be evaluated by asset pipeline
301
+ SpriteFactory.cssurl = "image-url('$IMAGE')" # use a sass-rails helper method to be evaluated by the rails asset pipeline
295
302
  SpriteFactory.run!('app/assets/images/avatars', :output_style => 'app/assets/stylesheets/avatars.css.erb')
296
303
  SpriteFactory.run!('app/assets/images/icons', :output_style => 'app/assets/stylesheets/icons.css.erb')
297
304
  # ... etc ...
@@ -309,7 +316,7 @@ Generates
309
316
 
310
317
  You can find out more here:
311
318
 
312
- * [Sprite Factory 1.4.1 and the Rails Asset Pipeline](http://codeincomplete.com/posts/2011/8/6/sprite_factory_1_4_1/)
319
+ * [Sprite Factory and the Rails Asset Pipeline](http://codeincomplete.com/posts/2011/8/6/sprite_factory_1_4_1/)
313
320
 
314
321
  Extending the Library
315
322
  =====================
@@ -338,7 +345,7 @@ Contact
338
345
 
339
346
  If you have any ideas, feedback, requests or bug reports, you can reach me at
340
347
  [jake@codeincomplete.com](mailto:jake@codeincomplete.com), or via
341
- my website: [Code inComplete](http://codeincomplete.com/posts/2011/4/29/sprite_factory/).
348
+ my website: [Code inComplete](http://codeincomplete.com).
342
349
 
343
350
 
344
351
 
data/RELEASE_NOTES.md CHANGED
@@ -1,5 +1,11 @@
1
- (unreleased) - v1.5.1
2
- ---------------------
1
+ January 13th 2013 - v1.5.2
2
+ --------------------------
3
+ * replaced `:csspath` option with `:cssurl` [issue #21](https://github.com/jakesgordon/sprite-factory/issues/21)
4
+ * ordered css rules by pseudoclass importance [issue #20](https://github.com/jakesgordon/sprite-factory/pull/20)
5
+ * added support for .ico files when using rmagick [issue #18](https://github.com/jakesgordon/sprite-factory/pull/18)
6
+
7
+ June 11th 2012 - v1.5.1
8
+ -----------------------
3
9
  * added a new `:return => :images` option for callers that want access to the detailed `images` hash instead of the generated css content
4
10
 
5
11
  May 10th 2012 - v1.5.0
data/bin/sf CHANGED
@@ -23,7 +23,7 @@ layout_help = "specify layout orientation ( horizontal, vertical, packed
23
23
  style_help = "specify stylesheet syntax ( css, scss, sass )"
24
24
  library_help = "specify image library to use ( rmagic, chunkypng )"
25
25
  selector_help = "specify custom selector to use for each css rule ( default: 'img.' )"
26
- csspath_help = "specify custom path to use for css image urls ( default: output image basename )"
26
+ cssurl_help = "specify custom string to use for css image urls ( default: 'url(output image basename)' )"
27
27
  output_image_help = "specify output location for generated image ( default: <input folder>.png )"
28
28
  output_style_help = "specify output location for generated stylesheet ( default: <input folder>.<style>)"
29
29
  pngcrush_help = "use pngcrush to optimize generated image"
@@ -33,7 +33,7 @@ op.on("--layout [ORIENTATION]", layout_help) {|value| options[:layou
33
33
  op.on("--style [STYLE]", style_help) {|value| options[:style] = value }
34
34
  op.on("--library [LIBRARY]", library_help) {|value| options[:library] = value }
35
35
  op.on("--selector [SELECTOR]", selector_help) {|value| options[:selector] = value }
36
- op.on("--csspath [CSSPATH]", csspath_help) {|value| options[:csspath] = value }
36
+ op.on("--cssurl [CSSURL]", cssurl_help) {|value| options[:cssurl] = value }
37
37
  op.on("--output-image [PATH]", output_image_help) {|value| options[:output_image] = value }
38
38
  op.on("--output-style [PATH]", output_style_help) {|value| options[:output_style] = value }
39
39
  op.on("--pngcrush", pngcrush_help) {|value| options[:pngcrush] = value }
@@ -4,7 +4,7 @@ module SpriteFactory
4
4
  module Library
5
5
  module RMagick
6
6
 
7
- VALID_EXTENSIONS = [:png, :jpg, :jpeg, :gif]
7
+ VALID_EXTENSIONS = [:png, :jpg, :jpeg, :gif, :ico]
8
8
 
9
9
  def self.load(files)
10
10
  files.map do |filename|
@@ -6,6 +6,10 @@ module SpriteFactory
6
6
 
7
7
  #----------------------------------------------------------------------------
8
8
 
9
+ PSEUDO_CLASS_ORDER = [nil, ':link', ':visited', ':focus', ':hover', ':active'] # TODO: allow caller to specify this order ?
10
+
11
+ #----------------------------------------------------------------------------
12
+
9
13
  attr :input
10
14
  attr :config
11
15
 
@@ -16,7 +20,7 @@ module SpriteFactory
16
20
  @config[:layout] ||= SpriteFactory.layout || :horizontal
17
21
  @config[:library] ||= SpriteFactory.library || :rmagick
18
22
  @config[:selector] ||= SpriteFactory.selector || 'img.'
19
- @config[:csspath] ||= SpriteFactory.csspath
23
+ @config[:cssurl] ||= SpriteFactory.cssurl
20
24
  @config[:report] ||= SpriteFactory.report
21
25
  @config[:pngcrush] ||= SpriteFactory.pngcrush
22
26
  @config[:nocomments] ||= SpriteFactory.nocomments
@@ -41,6 +45,8 @@ module SpriteFactory
41
45
  raise RuntimeError, "set :width for fixed width, or :hmargin for horizontal margin, but not both." if width && !hmargin.zero?
42
46
  raise RuntimeError, "set :height for fixed height, or :vmargin for vertical margin, but not both." if height && !hmargin.zero?
43
47
 
48
+ raise RuntimeError, "The legacy :csspath attribute is no longer supported, please use :cssurl instead (see README)" unless @config[:csspath].nil?
49
+
44
50
  images = load_images
45
51
  max = layout_images(images)
46
52
  header = summary(images, max)
@@ -49,7 +55,7 @@ module SpriteFactory
49
55
 
50
56
  css = []
51
57
  css << style_comment(header) unless nocomments? # header comment
52
- css << style(selector, css_path, images, &block) # generated styles
58
+ css << style(selector, css_url, images, &block) # generated styles
53
59
  css << IO.read(custom_style_file) if File.exists?(custom_style_file) # custom styles
54
60
  css = css.join("\n")
55
61
 
@@ -137,19 +143,19 @@ module SpriteFactory
137
143
  File.join(input, File.basename(input) + ".#{style_name}")
138
144
  end
139
145
 
140
- def css_path
141
- base = File.basename(output_image_file)
142
- custom = config[:csspath]
146
+ def css_url
147
+ base = File.basename(output_image_file)
148
+ custom = config[:cssurl]
143
149
  if custom
144
150
  if custom.is_a?(Proc)
145
- custom.call(base) # allow custom path using a lambda
151
+ custom.call(base) # allow custom url using a lambda
146
152
  elsif custom.include?('$IMAGE')
147
- custom.sub('$IMAGE', base) # allow custom path with token replacement
153
+ custom.sub('$IMAGE', base) # allow custom url with simple token replacement
148
154
  else
149
- File.join(custom, base) # allow custom path with simple prepend
155
+ "url(#{File.join(custom, base)})" # allow custom url with simple prepend
150
156
  end
151
157
  else
152
- base # otherwise, just default to basename of the output image file
158
+ "url(#{base})" # otherwise, just default to basename of the output image file
153
159
  end
154
160
  end
155
161
 
@@ -174,7 +180,7 @@ module SpriteFactory
174
180
  raise RuntimeError, "image #{i[:name]} does not fit within a fixed width of #{width}" if width && (width < i[:width])
175
181
  raise RuntimeError, "image #{i[:name]} does not fit within a fixed height of #{height}" if height && (height < i[:height])
176
182
  end
177
- images
183
+ images.sort_by {|i| [image_name_without_pseudo_class(i), image_pseudo_class_priority(i)] }
178
184
  end
179
185
 
180
186
  def map_image_filename(filename, input_path)
@@ -186,6 +192,20 @@ module SpriteFactory
186
192
  [name, ext]
187
193
  end
188
194
 
195
+ def image_name_without_pseudo_class(image)
196
+ image[:name].split(':').first
197
+ end
198
+
199
+ def image_pseudo_class(image)
200
+ image[:name].slice(/:.*?\Z/)
201
+ end
202
+
203
+ def image_pseudo_class_priority(image)
204
+ PSEUDO_CLASS_ORDER.index(image_pseudo_class(image))
205
+ end
206
+
207
+ #----------------------------------------------------------------------------
208
+
189
209
  def create_sprite(images, width, height)
190
210
  library.create(output_image_file, images, width, height)
191
211
  pngcrush(output_image_file)
@@ -203,8 +223,8 @@ module SpriteFactory
203
223
 
204
224
  #----------------------------------------------------------------------------
205
225
 
206
- def style(selector, path, images, &block)
207
- defaults = Style.generate(style_name, selector, path, images) # must call, even if custom block is given, because it stashes generated css style into image[:style] attributes
226
+ def style(selector, url, images, &block)
227
+ defaults = Style.generate(style_name, selector, url, images) # must call, even if custom block is given, because it stashes generated css style into image[:style] attributes
208
228
  if block_given?
209
229
  yield images.inject({}) {|h,i| h[i[:name].to_sym] = i; h} # provide custom rule builder a hash by image name
210
230
  else
@@ -45,16 +45,14 @@ module SpriteFactory
45
45
 
46
46
  #----------------------------------------------------------------------------
47
47
 
48
- def self.generate(style_name, selector, path, images)
48
+ def self.generate(style_name, selector, url, images)
49
49
  styles = []
50
50
  images.each do |image|
51
51
  attr = [
52
52
  "width: #{image[:cssw]}px",
53
53
  "height: #{image[:cssh]}px",
54
- "background: url(#{path}) #{-image[:cssx]}px #{-image[:cssy]}px no-repeat"
54
+ "background: #{url} #{-image[:cssx]}px #{-image[:cssy]}px no-repeat"
55
55
  ]
56
- image[:path] = path
57
- image[:selector] = selector
58
56
  image[:style] = send("#{style_name}_style", attr) # make pure style available for (optional) custom rule generators (see usage of yield inside Runner#style)
59
57
  styles << send(style_name, selector, image[:name], attr)
60
58
  end
@@ -2,7 +2,7 @@ module SpriteFactory
2
2
 
3
3
  #----------------------------------------------------------------------------
4
4
 
5
- VERSION = "1.5.1"
5
+ VERSION = "1.5.2"
6
6
  SUMMARY = "Automatic CSS sprite generator"
7
7
  DESCRIPTION = "Combines individual images from a directory into a single sprite image file and creates an appropriate CSS stylesheet"
8
8
  LIB = File.dirname(__FILE__)
@@ -24,7 +24,7 @@ module SpriteFactory
24
24
  attr_accessor :layout
25
25
  attr_accessor :library
26
26
  attr_accessor :selector
27
- attr_accessor :csspath
27
+ attr_accessor :cssurl
28
28
  attr_accessor :pngcrush
29
29
  attr_accessor :nocomments
30
30
  end
Binary file
Binary file
@@ -3,8 +3,11 @@
3
3
  Creating a sprite from following images:
4
4
 
5
5
  test/images/formats/alice.gif (50x50)
6
+ test/images/formats/codeincomplete.ico (16x16)
7
+ test/images/formats/github.ico (32x32)
6
8
  test/images/formats/monkey.gif (50x50)
7
9
  test/images/formats/spies.jpg (150x92)
10
+ test/images/formats/stackoverflow.ico (16x16)
8
11
  test/images/formats/thief.png (50x50)
9
12
 
10
13
  Output files:
@@ -12,11 +15,14 @@
12
15
  test/images/formats.css
13
16
 
14
17
  Output size:
15
- 300x92
18
+ 364x92
16
19
 
17
20
 
18
21
  */
19
22
  img.alice { width: 50px; height: 50px; background: url(formats.png) 0px -21px no-repeat; }
20
- img.monkey { width: 50px; height: 50px; background: url(formats.png) -50px -21px no-repeat; }
21
- img.spies { width: 150px; height: 92px; background: url(formats.png) -100px 0px no-repeat; }
22
- img.thief { width: 50px; height: 50px; background: url(formats.png) -250px -21px no-repeat; }
23
+ img.codeincomplete { width: 16px; height: 16px; background: url(formats.png) -50px -38px no-repeat; }
24
+ img.github { width: 32px; height: 32px; background: url(formats.png) -66px -30px no-repeat; }
25
+ img.monkey { width: 50px; height: 50px; background: url(formats.png) -98px -21px no-repeat; }
26
+ img.spies { width: 150px; height: 92px; background: url(formats.png) -148px 0px no-repeat; }
27
+ img.stackoverflow { width: 16px; height: 16px; background: url(formats.png) -298px -38px no-repeat; }
28
+ img.thief { width: 50px; height: 50px; background: url(formats.png) -314px -21px no-repeat; }
Binary file
@@ -2,21 +2,37 @@
2
2
 
3
3
  Creating a sprite from following images:
4
4
 
5
- test/images/hover/div.bar__img.icon--hover.png (18x18)
6
5
  test/images/hover/div.bar__img.icon.png (18x18)
7
- test/images/hover/div.foo__img.icon--hover.png (18x18)
6
+ test/images/hover/div.bar__img.icon--link.png (18x18)
7
+ test/images/hover/div.bar__img.icon--visited.png (18x18)
8
+ test/images/hover/div.bar__img.icon--focus.png (18x18)
9
+ test/images/hover/div.bar__img.icon--hover.png (18x18)
10
+ test/images/hover/div.bar__img.icon--active.png (18x18)
8
11
  test/images/hover/div.foo__img.icon.png (18x18)
12
+ test/images/hover/div.foo__img.icon--link.png (18x18)
13
+ test/images/hover/div.foo__img.icon--visited.png (18x18)
14
+ test/images/hover/div.foo__img.icon--focus.png (18x18)
15
+ test/images/hover/div.foo__img.icon--hover.png (18x18)
16
+ test/images/hover/div.foo__img.icon--active.png (18x18)
9
17
 
10
18
  Output files:
11
19
  test/images/hover.png
12
20
  test/images/hover.css
13
21
 
14
22
  Output size:
15
- 72x18
23
+ 216x18
16
24
 
17
25
 
18
26
  */
19
- div.hover div.bar img.icon:hover { width: 18px; height: 18px; background: url(hover.png) 0px 0px no-repeat; }
20
- div.hover div.bar img.icon { width: 18px; height: 18px; background: url(hover.png) -18px 0px no-repeat; }
21
- div.hover div.foo img.icon:hover { width: 18px; height: 18px; background: url(hover.png) -36px 0px no-repeat; }
22
- div.hover div.foo img.icon { width: 18px; height: 18px; background: url(hover.png) -54px 0px no-repeat; }
27
+ div.hover div.bar img.icon { width: 18px; height: 18px; background: url(hover.png) 0px 0px no-repeat; }
28
+ div.hover div.bar img.icon:link { width: 18px; height: 18px; background: url(hover.png) -18px 0px no-repeat; }
29
+ div.hover div.bar img.icon:visited { width: 18px; height: 18px; background: url(hover.png) -36px 0px no-repeat; }
30
+ div.hover div.bar img.icon:focus { width: 18px; height: 18px; background: url(hover.png) -54px 0px no-repeat; }
31
+ div.hover div.bar img.icon:hover { width: 18px; height: 18px; background: url(hover.png) -72px 0px no-repeat; }
32
+ div.hover div.bar img.icon:active { width: 18px; height: 18px; background: url(hover.png) -90px 0px no-repeat; }
33
+ div.hover div.foo img.icon { width: 18px; height: 18px; background: url(hover.png) -108px 0px no-repeat; }
34
+ div.hover div.foo img.icon:link { width: 18px; height: 18px; background: url(hover.png) -126px 0px no-repeat; }
35
+ div.hover div.foo img.icon:visited { width: 18px; height: 18px; background: url(hover.png) -144px 0px no-repeat; }
36
+ div.hover div.foo img.icon:focus { width: 18px; height: 18px; background: url(hover.png) -162px 0px no-repeat; }
37
+ div.hover div.foo img.icon:hover { width: 18px; height: 18px; background: url(hover.png) -180px 0px no-repeat; }
38
+ div.hover div.foo img.icon:active { width: 18px; height: 18px; background: url(hover.png) -198px 0px no-repeat; }
Binary file
Binary file
Binary file
data/test/runner_test.rb CHANGED
@@ -99,17 +99,17 @@ module SpriteFactory
99
99
 
100
100
  #----------------------------------------------------------------------------
101
101
 
102
- def test_default_css_path
102
+ def test_default_css_url
103
103
  Runner.publicize_methods do
104
104
  r1 = Runner.new(REGULAR_PATH)
105
- r2 = Runner.new(REGULAR_PATH, :csspath => "http://s3.amazonaws.com/sf")
106
- r3 = Runner.new(REGULAR_PATH, :csspath => "<%= image_path('$IMAGE') %>")
107
- r4 = Runner.new(REGULAR_PATH, :csspath => lambda{|image| "/very/dynamic/path/#{image}"})
105
+ r2 = Runner.new(REGULAR_PATH, :cssurl => "http://s3.amazonaws.com/sf")
106
+ r3 = Runner.new(REGULAR_PATH, :cssurl => "foo(<%= image_path('$IMAGE') %>)")
107
+ r4 = Runner.new(REGULAR_PATH, :cssurl => lambda{|image| "foo(/very/dynamic/path/#{image})" })
108
108
 
109
- assert_equal("regular.png", r1.css_path, "by default, csspath should be basename of the generated sprite image")
110
- assert_equal("http://s3.amazonaws.com/sf/regular.png", r2.css_path, "allow customization by prepending to basename of the generated sprite image")
111
- assert_equal("<%= image_path('regular.png') %>", r3.css_path, "allow customization by providing custom format string with $IMAGE token to be replaced with basename of the generated sprite image")
112
- assert_equal("/very/dynamic/path/regular.png", r4.css_path, "allow customization by lambda function - allow caller to decide how to generate css path to sprite image")
109
+ assert_equal("url(regular.png)", r1.css_url, "by default, css_url should be basename of the generated sprite image")
110
+ assert_equal("url(http://s3.amazonaws.com/sf/regular.png)", r2.css_url, "allow customization by prepending to basename of the generated sprite image")
111
+ assert_equal("foo(<%= image_path('regular.png') %>)", r3.css_url, "allow customization by providing custom format string with $IMAGE token to be replaced with basename of the generated sprite image")
112
+ assert_equal("foo(/very/dynamic/path/regular.png)", r4.css_url, "allow customization by lambda function - allow caller to decide how to generate css url to sprite image")
113
113
  end
114
114
  end
115
115
 
@@ -186,5 +186,44 @@ module SpriteFactory
186
186
 
187
187
  #----------------------------------------------------------------------------
188
188
 
189
+ def test_images_are_sorted_in_classname_order
190
+ Runner.publicize_methods do
191
+ expected = [
192
+ "alice",
193
+ "codeincomplete",
194
+ "github",
195
+ "monkey",
196
+ "spies",
197
+ "stackoverflow",
198
+ "thief"
199
+ ]
200
+ actual = Runner.new(FORMATS_PATH).load_images.map{|i| i[:name]}
201
+ assert_equal(expected, actual)
202
+ end
203
+ end
204
+
205
+ def test_images_are_secondary_sorted_on_psuedoclass
206
+ Runner.publicize_methods do
207
+ expected = [
208
+ "div.bar img.icon",
209
+ "div.bar img.icon:link",
210
+ "div.bar img.icon:visited",
211
+ "div.bar img.icon:focus",
212
+ "div.bar img.icon:hover",
213
+ "div.bar img.icon:active",
214
+ "div.foo img.icon",
215
+ "div.foo img.icon:link",
216
+ "div.foo img.icon:visited",
217
+ "div.foo img.icon:focus",
218
+ "div.foo img.icon:hover",
219
+ "div.foo img.icon:active",
220
+ ]
221
+ actual = Runner.new(HOVER_PATH).load_images.map{|i| i[:name]}
222
+ assert_equal(expected, actual)
223
+ end
224
+ end
225
+
226
+ #----------------------------------------------------------------------------
227
+
189
228
  end
190
229
  end
data/test/style_test.rb CHANGED
@@ -39,7 +39,7 @@ module SpriteFactory
39
39
 
40
40
  style = :css
41
41
  selector = 'img.'
42
- path = '/path/to/sprite.png'
42
+ url = 'url(/path/to/sprite.png)'
43
43
  images = [
44
44
  {:filename => '/path/to/sprite1.png', :name => 'sprite1', :cssx => 1, :cssy => 10, :cssw => 100, :cssh => 1000},
45
45
  {:filename => '/path/to/sprite2.png', :name => 'sprite2', :cssx => 2, :cssy => 20, :cssw => 200, :cssh => 2000},
@@ -48,7 +48,7 @@ module SpriteFactory
48
48
  {:filename => '/path/to/sprite5.png', :name => 'sprite5', :cssx => 5, :cssy => 50, :cssw => 500, :cssh => 5000}
49
49
  ]
50
50
 
51
- lines = Style.generate(style, selector, path, images).split("\n")
51
+ lines = Style.generate(style, selector, url, images).split("\n")
52
52
 
53
53
  assert_equal("width: 100px; height: 1000px; background: url(/path/to/sprite.png) -1px -10px no-repeat", images[0][:style], "pure style should have been stashed away in image[:style] for use by custom rule builders")
54
54
  assert_equal("width: 200px; height: 2000px; background: url(/path/to/sprite.png) -2px -20px no-repeat", images[1][:style], "pure style should have been stashed away in image[:style] for use by custom rule builders")
metadata CHANGED
@@ -1,58 +1,58 @@
1
- --- !ruby/object:Gem::Specification
1
+ --- !ruby/object:Gem::Specification
2
2
  name: sprite-factory
3
- version: !ruby/object:Gem::Version
4
- prerelease: false
5
- segments:
6
- - 1
7
- - 5
8
- - 1
9
- version: 1.5.1
3
+ version: !ruby/object:Gem::Version
4
+ version: 1.5.2
5
+ prerelease:
10
6
  platform: ruby
11
- authors:
7
+ authors:
12
8
  - Jake Gordon
13
9
  autorequire:
14
10
  bindir: bin
15
11
  cert_chain: []
16
-
17
- date: 2012-06-11 00:00:00 -07:00
18
- default_executable:
19
- dependencies:
20
- - !ruby/object:Gem::Dependency
12
+ date: 2013-01-13 00:00:00.000000000 Z
13
+ dependencies:
14
+ - !ruby/object:Gem::Dependency
21
15
  name: rmagick
22
- prerelease: false
23
- requirement: &id001 !ruby/object:Gem::Requirement
16
+ requirement: !ruby/object:Gem::Requirement
24
17
  none: false
25
- requirements:
26
- - - ">="
27
- - !ruby/object:Gem::Version
28
- segments:
29
- - 0
30
- version: "0"
18
+ requirements:
19
+ - - ! '>='
20
+ - !ruby/object:Gem::Version
21
+ version: '0'
31
22
  type: :development
32
- version_requirements: *id001
33
- - !ruby/object:Gem::Dependency
34
- name: chunky_png
35
23
  prerelease: false
36
- requirement: &id002 !ruby/object:Gem::Requirement
24
+ version_requirements: !ruby/object:Gem::Requirement
37
25
  none: false
38
- requirements:
39
- - - ">="
40
- - !ruby/object:Gem::Version
41
- segments:
42
- - 0
43
- version: "0"
26
+ requirements:
27
+ - - ! '>='
28
+ - !ruby/object:Gem::Version
29
+ version: '0'
30
+ - !ruby/object:Gem::Dependency
31
+ name: chunky_png
32
+ requirement: !ruby/object:Gem::Requirement
33
+ none: false
34
+ requirements:
35
+ - - ! '>='
36
+ - !ruby/object:Gem::Version
37
+ version: '0'
44
38
  type: :development
45
- version_requirements: *id002
46
- description: Combines individual images from a directory into a single sprite image file and creates an appropriate CSS stylesheet
47
- email:
39
+ prerelease: false
40
+ version_requirements: !ruby/object:Gem::Requirement
41
+ none: false
42
+ requirements:
43
+ - - ! '>='
44
+ - !ruby/object:Gem::Version
45
+ version: '0'
46
+ description: Combines individual images from a directory into a single sprite image
47
+ file and creates an appropriate CSS stylesheet
48
+ email:
48
49
  - jake@codeincomplete.com
49
- executables:
50
+ executables:
50
51
  - sf
51
52
  extensions: []
52
-
53
- extra_rdoc_files:
53
+ extra_rdoc_files:
54
54
  - README.md
55
- files:
55
+ files:
56
56
  - .gitignore
57
57
  - LICENSE
58
58
  - README.md
@@ -73,12 +73,23 @@ files:
73
73
  - test/images/custom/stopped.png
74
74
  - test/images/empty/readme.txt
75
75
  - test/images/formats/alice.gif
76
+ - test/images/formats/codeincomplete.ico
77
+ - test/images/formats/github.ico
76
78
  - test/images/formats/monkey.gif
77
79
  - test/images/formats/spies.jpg
80
+ - test/images/formats/stackoverflow.ico
78
81
  - test/images/formats/thief.png
82
+ - test/images/hover/div.bar__img.icon--active.png
83
+ - test/images/hover/div.bar__img.icon--focus.png
79
84
  - test/images/hover/div.bar__img.icon--hover.png
85
+ - test/images/hover/div.bar__img.icon--link.png
86
+ - test/images/hover/div.bar__img.icon--visited.png
80
87
  - test/images/hover/div.bar__img.icon.png
88
+ - test/images/hover/div.foo__img.icon--active.png
89
+ - test/images/hover/div.foo__img.icon--focus.png
81
90
  - test/images/hover/div.foo__img.icon--hover.png
91
+ - test/images/hover/div.foo__img.icon--link.png
92
+ - test/images/hover/div.foo__img.icon--visited.png
82
93
  - test/images/hover/div.foo__img.icon.png
83
94
  - test/images/irregular/irregular1.png
84
95
  - test/images/irregular/irregular2.png
@@ -153,37 +164,29 @@ files:
153
164
  - test/runner_test.rb
154
165
  - test/style_test.rb
155
166
  - test/test_case.rb
156
- has_rdoc: true
157
167
  homepage: https://github.com/jakesgordon/sprite-factory
158
168
  licenses: []
159
-
160
169
  post_install_message:
161
- rdoc_options:
170
+ rdoc_options:
162
171
  - --charset=UTF-8
163
- require_paths:
172
+ require_paths:
164
173
  - lib
165
- required_ruby_version: !ruby/object:Gem::Requirement
174
+ required_ruby_version: !ruby/object:Gem::Requirement
166
175
  none: false
167
- requirements:
168
- - - ">="
169
- - !ruby/object:Gem::Version
170
- segments:
171
- - 0
172
- version: "0"
173
- required_rubygems_version: !ruby/object:Gem::Requirement
176
+ requirements:
177
+ - - ! '>='
178
+ - !ruby/object:Gem::Version
179
+ version: '0'
180
+ required_rubygems_version: !ruby/object:Gem::Requirement
174
181
  none: false
175
- requirements:
176
- - - ">="
177
- - !ruby/object:Gem::Version
178
- segments:
179
- - 0
180
- version: "0"
182
+ requirements:
183
+ - - ! '>='
184
+ - !ruby/object:Gem::Version
185
+ version: '0'
181
186
  requirements: []
182
-
183
187
  rubyforge_project:
184
- rubygems_version: 1.3.7
188
+ rubygems_version: 1.8.23
185
189
  signing_key:
186
190
  specification_version: 3
187
191
  summary: Automatic CSS sprite generator
188
192
  test_files: []
189
-