gistfile1.html

Original code spread across 28 templates in various permutations. Anytime I wanted to restructure tabs I'd have to change every damn template:

<ul class="tabs">
    <li><a{% if not group %} class="on"{% endif %} href="{% url user_books username=reader.username %}">{% trans "All" %}</a></li>
    <li><a{{ group|is_on:'finished' }} href="{% url user_book_group username=reader.username,group="finished" %}">{% trans "Finished" %}</a></li>
    <li><a{{ group|is_on:'reading' }} href="{% url user_book_group username=reader.username,group="reading" %}">{% trans "Reading" %}</a></li>
    <li><a{{ group|is_on:'plan-to-read' }} href="{% url user_book_group username=reader.username,group="plan-to-read" %}">{% trans "Plan to read" %}</a></li>
</ul>

Abstract it out to an XML tree:

<tabs on="{{ group }}">
    <tab url="{% url user_books username=reader.username %}" label="All" />
    <tab url="{% url user_book_group username=reader.username,group="finished" %}" label="Finished" />
    <tab url="{% url user_book_group username=reader.username,group="reading" %}" label="Reading" />
    <tab url="{% url user_book_group username=reader.username,group="plan-to-read" %}" label="Plan to read" />
</tabs>

Which renders a single template, isolating all rendered markup to a single source:

<div class="tabs">
  {% for tab in object.value %}
    <a{% if object.attributes.on == tab.attributes.label|slugify %} class="on"{% endif %} href="{{ tab.attributes.url }}">{{ tab.attributes.label }}</a>
  {% endfor %}
</div>