{% macro expandSkill(dict, name, classes="") %}
<div class='skill {{ classes }}' data-length='{{ dict[name]|length }}'>
    <div onclick='activeSkill(this)' class='skillname'>{{ name }}</div>
{% if dict[name]|length > 0 %}
    <div class='skill-children'>
        <div class='skill-children-inner'>
{% for child in dict[name] %}
{{ expandSkill(dict[name], child) }}
{% endfor %}
        </div>
    </div>
{% endif %}
</div>
{% endmacro %}

{% macro skills(skills) %}
<div id="skillTree">
    {% for skill in skills %}
    {% set classes = "" %}
    {% if skill == skills|first %}
        {% set classes = "activeSkill" %}
    {% endif %}
    {{ expandSkill(skills, skill, classes) }}
    {% endfor %}
</div>
{% endmacro %}