Support creating image sprites

[miracle2k]

There are generally two options:

1. Implement this ourselves in Python.
2. Implement as a filter on top of an external tool.

I am leaning towards 2), because looking at the complexity of some of the tools that are out there, it seems a waste to try to duplicate their functionality.

Some links:

http://csssprites.org/
https://github.com/elentok/sprites-gen
https://github.com/yostudios/Spritemapper

[aisipos]

Seems that (2) is the right way to go. Perhaps implementing this as just another filter? Meaning place all the images in a bundle, and specify a sprite filter.Then we could implement different filters for the different tools, and give users the choice in which sprite tool to use by allowing them to pick the appropriate filter.

This does bring up the point that you might need to bundle up a large number of images, it can be tedious to list them all, it may help to allow Bundles to be specified by globs instead of just individual filenames.

[miracle2k]

Meaning place all the images in a bundle, and specify a sprite filter.

I think a sprite filter would probably have to operate on a bunch of CSS files, so it can replace the image definitions properly.

This does bring up the point that you might need to bundle up a large number of images, it can be tedious to list them all, it may help to allow Bundles to be specified by globs instead of just individual filenames.

Actually, that's already possible. If you install the glob2 package, you can even use ** to do recursive glob.

[aisipos]

Good points. You are correct that a more useful filter would work on the css files themselves, detect their images, sprite them, and replace the image definition. To be more specific, my use case is that I want to manage jquery-ui using webassets. I'm doing it in a very manual fashion now but would like to use webassets. Doing so completely and easily is perhaps beyond the scope of this ticket (there are other tickets related to handling combinations of js/css in one bundle), but at the moment there is no way to sprite images at all with webassets. Thanks for your links to the 3 projects above, I will take a look and see if they could be of some use here, and possibly "filterized".

[miracle2k]

Thanks to @bryanchow there is now a "spritemapper" filter based on https://github.com/yostudios/Spritemapper.

However, in practice I notice that the spritemapper library is certainly not perfect. Among other things, it breaks on @media directives.

I'm closing this now, but there is certainly no reason why there couldn't be other filters based on different spriting tools.

[bryanchow]

Haha! I intended to eventually submit a pull request for the Spritemapper filter, but you beat me to it.