{% extends "webpage/base.html" %}
{% load static %}
{% load webpage_extras %}
{% block title %}{{ object.name }}{% endblock %}
{% block scriptHeader %}
<script src="https://cdnjs.cloudflare.com/ajax/libs/spin.js/2.3.2/spin.min.js"></script>
<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
<script crossorigin src="https://unpkg.com/three@latest/build/three.min.js"></script>
<script crossorigin src="https://unpkg.com/@acdh/network-visualization@latest/lib/network-visualization.umd.js"></script>
<script src="{% static 'netvis/js/netvis.js' %}"></script>
{% endblock %}
{% block content %}
<!-- <div class="container"> -->
<div class="card w-100">
  <div class="card-header">
    <div class="row">
      <div class="col-md-2">
        {% if object.get_prev %}
        <h2>
          <a href="{{ object.get_prev }}" title="previous">
            <i data-feather="chevron-left"></i>
          </a>
        </h2>
        {% endif %}
      </div>
      <div class="col-md-8">
        <h2 style="text-align: center;">
          <small><a href="{{ object.get_listview_url }}" title="back to listview"><small>{{ class_name }}</small></a></small>
          {{ object }}
          {% if user.is_authenticated %}
            <a href="{{ object.get_edit_url }}" title="edit">
              <i data-feather="edit-3"></i>
            </a>
            <a href="{{ object.get_delete_url }}" title="delete">
              <i data-feather="trash-2"></i>
            </a>
          {% endif %}
          {% if 'archeutils' in APPS %}
          <a href="{% url 'filechecker-rdf:res_as_arche_graph' model_name=class_name|lower pk=object.id %}" title="As ARCHE-RDF">
            <i data-feather="download"></i>
          </a>
          {% endif%}
        </h2>
      </div>
      <div class="col-md-2">
        <h2>
          {% if object.get_next %}
          <a href="{{ object.get_next }}" style="float:right" title="next">
            <i data-feather="chevron-right"></i>
          </a>
        </h2>
        {% endif %}
      </div>
    </div>
  </div>
  <div class="card-body">
    {% block custom %}
    <legend>Basic Information</legend>
    <div class="row">
        <div class="col-md-6">
            <table class="table table-responsive table-hover">
              {% for x in object.field_dict %}
              {% if x.value %}
              {% if user.is_authenticated %}
              <tr>
                <th>
                  {% if x.help_text %}
                  <abbr title="{{ x.help_text }}">{{ x.verbose_name }}</abbr>
                  {% else %}
                  {{ x.verbose_name }}
                  {% endif %}
                </th>
                <td>
                  {% if x.f_type == 'M2M' %}
                  {% for y in x.value %}
                  <li>
                    <a href="{{ y.get_absolute_url }}">{{ y }}</a>
                  </li>
                  {% endfor %}
                  {% elif  x.f_type == 'FK' %}
                  <a href="{{ x.value.get_absolute_url }}">{{ x.value }}</a>
                  {% elif  x.f_type == 'FK' %}
                  <a href="{{ x.value.get_absolute_url }}">{{ x.value }}</a>
                  {% elif  x.f_type == 'REVRESE_RELATION' %}
                  {% for y in x.value %}
                  <li>
                    <a href="{{ y.get_absolute_url }}">{{ y }}</a>
                  </li>
                  {% endfor %}

                  {% elif  x.f_type == 'SIMPLE' %}
                  {{ x.value }}
                  {% endif %}
                </td>
              </tr>
              {% elif not x.extra_fields or x.extra_fields.is_public %}
              <tr>
                <th>
                  {% if x.help_text %}
                  <abbr title="{{ x.help_text }}">{{ x.verbose_name }}</abbr>
                  {% else %}
                  {{ x.verbose_name }}
                  {% endif %}
                </th>
                <td>
                  {% if x.f_type == 'M2M' %}
                  {% for y in x.value %}
                  <li>
                    <a href="{{ y.get_absolute_url }}">{{ y }}</a>
                  </li>
                  {% endfor %}
                  {% elif  x.f_type == 'FK' %}
                  <a href="{{ x.value.get_absolute_url }}">{{ x.value }}</a>
                  {% elif  x.f_type == 'FK' %}
                  <a href="{{ x.value.get_absolute_url }}">{{ x.value }}</a>
                  {% elif  x.f_type == 'REVRESE_RELATION' %}
                  {% for y in x.value %}
                  <li>
                    <a href="{{ y.get_absolute_url }}">{{ y }}</a>
                  </li>
                  {% endfor %}

                  {% elif  x.f_type == 'SIMPLE' %}
                  {{ x.value }}
                  {% endif %}
                </td>
              </tr>
              {% endif %}
              {% endif %}
              {% endfor %}
            </table>
        </div>
        <div class="col-md-6">
            <div id="visualization" style="position: relative; height: 700px; background: #fafafa;"></div>
            <script type="text/javascript">
              showGraph("{% url 'netvis:graph' app_name=app_name model_name=class_name|lower pk=object.id %}", "visualization")
            </script>
        </div>
    </div>


  </div>
</div>
{% endblock custom %}
{% endblock %}
