Issue 3: improve image resizing logic
Project Member Reported by stevesou...@gmail.com, Sep 1, 2009
Right now, SpriteMe has some cool logic that automatically resizes
repeating images to promote spriting. For example, if you have two repeat-x
bg images, one with width 2 and another with width 5, SpriteMe will combine
those in a sprite with width 10. To do this, it makes the first bg image 5
times wider, and the second image 2 times wider.

The challenge is, what if there are images with width 2, 4, 5, 7, 10, and
16. It's probably best to create a sprite 20px wide, and just leave out the
7 and 16 images. This type of logic needs to be added. 


Sep 17, 2009
#1 millerme...@gmail.com
what about cropping the sprite to the size of the biggest image? that way you would
generate a 21px wide image [ Math.ceil(16/7)*7 ] and then crop it to 16px wide. I
think it should be the easiest/best solution..
Sep 17, 2009
Project Member #2 stevesou...@gmail.com
These are repeating images - so you can't crop them.
Sep 17, 2009
#3 millerme...@gmail.com
I wasn't thinking about images that can't be "stretched" since every time that I use
background-repeat is for images that can be stretched (like a gradient background..)

I think the kind of logic that you're trying to achieve (combining all sizes into the
same file) is impossible, because of prime numbers, and it can drastically increase
the file size...

Using your example (and keeping the same logic) I would recommend creating 3 sprites
[2,5,10], [4,16] and [7]. - avoiding to repeat the 10px image and limiting the image
repeat to 5x.. since if you use the 20px wide you would have 10 2px images..

If the repeated image could be stretched (gradient background) the number of times
you repeat it shouldn't make a big differences in the file-size but if it's an icon
it will.
Sep 17, 2009
Project Member #4 stevesou...@gmail.com
We're not able to make any assumptions about the images. It's not just icons - Ive
created bg images that repeated but weren't stretchable (for example, spriteme.org.).