{% extends 'layouts/base.html' %}

{% set page_title = 'Home' %}

{% block container %}
<div class="container">

    <div class="blog-header"><h3 class="blog-title">Table</h3></div>

    <div>
        <div>Hierarhy</div>
        <div>Crate&LongRightArrow;Slot&LongRightArrow;Channel0</div>
    </div>

    <table class="table">
        <tr>
            <th>Element</th>
            <th>Position</th>
        </tr>
        {% for space,element in elements %}
        <tr {% if not element.parent_id %}class="info"{% endif %}
            {% if not element.channel_id %}class="active"{% endif %}
            data-id="{{ element.id }}" data-parent-id="{{ element.parent_id }}"    >
            <td>{{ space|safe }}{{ element.name }} <span class="text-muted">[{{ element.type }}]</span></td>
            <td>
                {#if element has children id build semi graphical line to it#}
                {% if element.channel_id %}
                {{ element.channel.module.crate.name }}&LongRightArrow;
                {{ element.channel.module.slot}}&LongRightArrow;
                {{ element.channel.channel}}
                {% endif %}
            </td>
        </tr>
        {% endfor %}
    </table>


</div>


{% endblock %}