Ext.ux.TDGi.iconMgr - a utility class for managing icons and CSS

July 14th, 2008 Jay Garcia Posted in EXT Examples, EXTJS, Ext Extensions |

The old Icon class was static, requiring users to manage CSS files.  Thus, was not really a fix, but just a convenience.

Here comes Ext.ux.TDGi.iconMgr.  A utility class that automatically sets styles for  you.  It creates and appends to a stylesheet in the dom, eliminating the need to manage CSS entirely.  The icon set contains images in PNG and GIF (IE6), and automatically selects which to use.

example: http://tdg-i.com/js/examples/ext/tdgiux/TDGi.iconMgr/

Icon Sources:
http://www.famfamfam.com/lab/icons/silk/ and http://www.damieng.com/icons/silkcompanion

Example usage:

Ext.ux.TDGi.iconMgr and Ext.ux.TDGi.iconBrowser Classes

It also comes with an icon browser, which I will eventually segment images by letter.
Download: zip or tar-gzip (tgz)

2 Responses to “Ext.ux.TDGi.iconMgr - a utility class for managing icons and CSS”

  1. Very cool indeed, I’m thinking about using it in my application. I have an idea that would make this really kick-ass:
    Change it so that icons are loaded from one single file containing all icons from one set. That would speed-up all ext-based applications greatly if they use your class, because icons would only be loaded once and could be cached on the browser easily.
    One would need a small script which merges all icons to one big png, and make an index file which contains offsets for all icon names. Having this information it would be trivial to modify the class to generate appropriate css to use the icons. - What do you think?

  2. Thanks for the comment and suggestion :).

    I thought about that technique (’sprites’), but the composite PNG would total a few megs (4+ ?). The point of this class was to not have anyone depend on a specific set of icons or load any one large icon.

    In theory, this could be used for any icon set.

Leave a Reply

You must be logged in to post a comment.