Feature-Request: Combine images from multiple folders to one sprite

[tobsch]

Hi there,

as discussed in Compass/compass-rails#17, it would be really helpful to implement a way to combine images from multiple folders to one single sprite.
This is helpful in situations where you can't afford any more http requests.
One possible way to solve this be a mixin for loading images where you can define the map to load them into, like

@load_sprite_images('folder/*.png', 'my-map');
@load_sprite_images('folder2/*.png', 'my-map');

another mixin to merge multiple maps into a single map would also be neat.

[intellix]

I also came here to request something like this.
I want to keep an organised folder structure of images but all my sprites currently need to be in the same folder.

One case where I need this is having multiple SVN checkout directories for different 'skins' of a site.

/media/generic/header/*.png
/media/skin1/header/*.png

Generic/header contains images like fb/twitter/arrow icons and Skin1/header contains logos and skin specific images.

Right now I'm having to copy all generic images into the Skin folders to have them in the same sprite.

The Skin folder needs to be a seperate repository so that an outside parties only have access to their skin specific stuff.

Would be nice to have something like:

$header-sprite: sprite-map(["generic/header/*.png", "skin1/header/*.png"]);

Also, not sure if this is the right place to put this but I'm currently having to use the sprite-map mixin rather than the @import and @include sprites because the way its named after the folder is a little annoying, is there no way to change this?

I'm making a game and there are 3 different races, which each have their own race-specific images.
So my folder structure is usually something like:

subNavigation/warrior/*.png
subNavigation/barbarian/*.png
subNavigation/magi/*.png

troops/warrior/*.png
troops/barbarian/*.png
troops/magi/*.png

But then every one of my sprites is called $warrior-sprite, $barbarian-sprite, $magi-sprite.
Perhaps it would be cool to specify how many levels of the navigation it should use to name it, like I would use 2 levels:
$troops-warrior-sprite, $subNavigation-warrior-sprite

Or is that what the nested sprites are for.....

warrior/troops
warrior/subNav

@import 'warrior/**/*.png;

[scottdavis]

I am not against this. I do have some concerns the spiriting documentation is already a bit confusing and this has to potential to really mess with someones head. So if someone feel like making a pull requests complete with test and very descriptive documentation I will be for it.

[chriseppstein]

We should decide on an API first =)

[scottdavis]

Yes master

Sent from my iPhone

On Mar 19, 2012, at 11:42 AM, Chris Eppsteinreply@reply.github.com wrote:

We should decide on an API first =)

---

Reply to this email directly or view it on GitHub:
#800 (comment)

[peregrinator]

I'm bumping into this a bit myself. We keep our icons in a submodule with nested folders to help make sense of them all.

Right now I'm ending up with a different sprite for each folder and sub-folder. In some cases this makes sense if it's a part of the app only some users will see. In other cases the sub-folder is only for organization and it would be ideal to be able to specify that they all become part of one sprite.

Also because of the structure of one part of our app the compass magic doesn't work so well with our asset paths and so we use the compass command line compass sprite to generate the sprite .scss files and import them manually. There is some odd behavior here as follows:

compass sprite "icons/foo/*.png" creates a sprite in app/assets/images/icons/foo-s123456789.png
compass sprite "icons/foo/bar/*.png" creates a sprite in app/assets/images/icons/foo/bar-s123456789.png

This is what I'd expect, except the next time that a stylesheet that references the foo sprite needs to be compiled there is a compilation error of:
"No sprite called baz found in sprite map icons/foo/foo. Did you mean one of: bar-s123456789.png"

If you remove the bar-s123456789.png sprite and refresh the page the compilation completes..

This may be a separate bug and I'm happy to file that but the feature in this thread would help us avoid this issue.

For reference we're including the files as follows (in rails 3.1.1).
/* compass sprite -c config/compass.rb "icons/foo/*.png" --force */
@import "sprites/_foo.scss";

/* compass sprite -c config/compass.rb "icons/foo/bar/*.png" --force */
@import "sprites/_bar.scss";

[cw-moshe]

I'll vote for this for organizational reasons

[satazor]

+1

[backflip]

+1

[chlab]

Came here to request this, so I'll add my +1.

[boriskaiser]

+1

[JensRoland]

+10 (one for every dev on my team)

[jeffscottward]

http://glue.readthedocs.org/en/latest/options.html#r-recursive Here's a solution to tide yall over for now :)

[danielbayerlein]

👍

[xeno123]

+1

[nadineh]

+1