================ Django StateFace

A simple Django templatetag for rendering icons from ProPublica's awesome StateFace font project.

Setup

Get the StateFace font from ProPublica and install it on your webserver.

http://propublica.github.com/stateface/

Define a @font-face declaration and CSS class something like:

@font-face {
    font-family: 'StateFaceRegular';
    src: url('<YOUR_PATH_HERE>/stateface-regular-webfont.eot');
    src: url('<YOUR_PATH_HERE>/stateface-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('<YOUR_PATH_HERE>/stateface-regular-webfont.woff') format('woff'),
         url('<YOUR_PATH_HERE>/stateface-regular-webfont.ttf') format('truetype'),
         url('<YOUR_PATH_HERE>/stateface-regular-webfont.svg#StateFaceRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

i.stateface {font-family: 'StateFaceRegular'; font-style: normal;}

You can adjust the templates/stateface/stateface_icon.html as you see fit, to change the CSS class, use a different HTML element to contain the shape, whatever.

Add django-stateface to your INSTALLED_APPS, or drop the templates and templatetags directories into one of your existing apps.

Usage

In your Django templates, render a state shape icon by feeding this tag with a string (state name, postal code or AP abbreviation) or a context variable.

{% render_stateface_icon 'Washington' %}
{% render_stateface_icon 'WA' %}
{% render_stateface_icon 'Wash.' %}
{% render_stateface_icon restaurant.city.state.abbr %}