
{% load django_tables2 %}

<div class="container-fluid">
    <div id="manu_navigation">
        <ul class="nav nav-tabs" id="myDetail" role="tablist">
            <li class="nav-item" role="presentation">
                <a class="nav-link active" id="detail-meta-tab" data-toggle="tab" href="#detail_meta_section"
                    role="tab">Meta</a>
            </li>
            <li class="nav-item" role="presentation">
                <a class="nav-link" id="detail-rels-tab" data-toggle="tab" href="#detail_rels_section"
                    role="tab">Relations</a>
            </li>
            <li class="nav-item" role="presentation">
                <a class="nav-link" id="detail-texts-tab" data-toggle="tab" href="#detail_texts_section" role="tab">Texts</a>
            </li>
        </ul>
    </div>

    <div class="tab-content" id="myDetailContent">
        <div class="tab-pane fade show active" id="detail_meta_section" role="tabpanel">
            <div class="card">
                <div class="card-header">
                    <!-- <h3>
                        General Info
                        <a href="/entity/{{object.id}}">
                            <small>
                                <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-database">
                                    <ellipse cx="12" cy="5" rx="9" ry="3" />
                                    <path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
                                    <path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
                                </svg>
                            </small>
                        </a>
                    </h3> -->
                </div>
                <div class="card-body">
                    {% block info-table %}
                    <table class="table table-bordered table-hover">
                        <tr>
                            <th>
                                Titel
                            </th>
                            <td>
                                {{ object.name }}
                            </td>
                        </tr>
                        <tr>
                            <th>
                                Labels
                            </th>
                            <td>
                                {% for x in no_merge_labels %}
                                    <li>
                                        <small>{{ x.label_type }}: </small>{{ x.label }}
                                    </li>
                                {% endfor %}
                            </td>
                        </tr>
                        <tr>
                            <th>
                                ID
                            </th>
                            <td>
                                {{ object.id }}
                            </td>
                        </tr>
                        <tr>
                            <th>
                                Titles
                            </th>
                            <td>
                                {% for x in titles %}
                                    <li>
                                        <small>{{ x }}</small>
                                    </li>
                                {% endfor %}
                            </td>
                        </tr>
                        {% if object.start_date or object.end_date %}
                        <tr>
                            <th>
                                Date
                            </th>
                            <td>
                                {% if object.start_date_written %}
                                    <abbr title="{{ object.start_date }}">{{ object.start_date_written }}</abbr>
                                {% endif %}
                                {% if object.end_date %}
                                    - <abbr title="{{ object.end_date }}">{{ object.end_date_written }}</abbr>
                                {% endif %}
                            </td>
                        </tr>
                        <tr>
                          <th>
                            Notes
                          </th>
                          <td>
                            {{ object.notes }}
                          </td>
                        </tr>
                        <tr>
                          <th>
                            References
                          </th>
                          <td>
                            {{ object.references }}
                          </td>
                        {% endif %}
                        {% if object.lat %}
                            <tr>
                                <th>
                                    Lat/Lng
                                </th>
                                <td>
                                    {{ object.lat }} / {{ object.lng }}
                                </td>
                            </tr>
                        {% endif %}
                    </table>
                    {% endblock info-table %}
                    {% block info-metadata %}
                        <table class="table table-bordered table-hover">
                            <tr>
                                <th>
                                    Collection(s)
                                </th>
                                <td>
                                    {% for x in object.collection.all %}
                                        <li>
                                            {{ x }}
                                        </li>
                                    {% endfor %}
                                </td>
                            </tr>
                            <tr>
                                <th>
                                    Uri(s)
                                </th>
                                <td>
                                    {% for x in object.uri_set.all %}
                                        <a href="{{ x }}">{{ x }}</a> <br />
                                    {% endfor %}
                                </td>
                            </tr>
                            {% if object.notes %}
                                <tr>
                                    <th>
                                        Notes
                                    </th>
                                    <td>
                                        {{ object.notes }}
                                    </td>
                                </tr>
                            {% endif %}
                            {% if object.references %}
                                <tr>
                                    <th>
                                        References
                                    </th>
                                    <td>
                                        {{ object.references }}
                                    </td>
                                </tr>
                            {% endif %}
                        </table>
                    {% endblock info-metadata %}
                    {% block left-pane-additional %}
                    {% endblock left-pane-additional %}
                </div>
            </div>
        </div>

       
        <div class="tab-pane fade" id="detail_rels_section" role="tabpanel">
            <div class="card">
                <div class="card-header">
                    <!-- <h3>Relations</h3> -->
                </div>
                <div class="card-body">
                    {% block relations %}
                        {% for obj in right_card %}
                            {% if obj.1.data|length > 0 %}
                                <div class="card card-default">
                                    <div class="card-heading pl-4 m-0">
                                        <h4 class="card-title"> {{ obj.0 }}</h4>
                                    </div>
                                    <div class="card-body p-0 m-0">
                                        <div id="tab_{{ obj.2 }}" class="card-body">
                                                {% render_table obj.1 %}
                                        </div>
                                    </div>
                                </div>
                            {% endif %}
                        {% endfor %}
                    {% endblock relations %}
                </div>
        </div>

        </div>
        <div class="tab-pane fade" id="detail_texts_section" role="tabpanel">
            <div class="card">
                <!-- <div class="card-header">
                    <h2>Texts</h2>
                </div> -->
                <div class="card-body">
                    {% if object.text.all %}
                        <div class="card-body">
                            <!-- <legend>
                                Texts
                            </legend> -->
                            {% for x in object.text.all %}
                                <!-- <div class="card card-default">
                                    <div class="card-heading">
                                        {% if x.kind.name in tei %}
                                            <h4 class="card-title"> TEI </h4>
                                        {% else %}
                                            <h4 class="card-title"> {{ x.kind }}</h4>
                                        {% endif %}
                                    </div>
                                    {% if x.kind.name in tei %}
                                        <div class="card-body tei" id="teisource">
                                            {{ x.text }}
                                        </div>
                                        <div id="teiviewer">
        
                                        </div>
                                    {% else %}
                                    <div class="card-body tei-text">
                                        {{ x.text }}
                                    </div>
                                    {% endif %}
                                </div> -->
                                {% if x.text %}
                                <span class="my-1 p-1 d-flex"><label class="w-25"><b>{{x.kind}}</b></label><label class="w-75">{{x.text}}</label></span>
                                {% endif %}
                            {% endfor %}
                        </div>
                    {% else %}
                        <div class="card-body">
                            <legend>No text provided for this {{entity}}</legend>
                        </div>
                    {% endif %}
                    {% if iiif %}
                    <div class="card-body">
                        <div id="iiif" style="width: 100%; height: 400px"/>
                    </div>
                    {% endif %}
                </div>
            </div>

        </div>
    </div>

</div>
