{% extends "admin/change_form.html" %}

{% load admin_static i18n admin_modify admin_urls %}

{% block stylesheets %}
  {{ block.super }}
  <link rel="stylesheet" type="text/css" href="/static/css/book-reference-local.css" />
{% endblock %}

{% block javascripts %}
{{ block.super }}
 {# include shim to disable autocompletes that depend on a digital edition #}
 <script src='/static/js/reference-instance-canvas-toggle.js'></script>
{% endblock %}


{% block after_related_objects %}
<div class="inline-group inline-tabular grp-collapse grp-open">
    <h2>Interventions</h2>

    <!-- container -->
    <div class="items" style="width:100%">
        <div class="legend">
            <div class="form-cell">Thumbnail</div>
            <div class="form-cell">Canvas</div>
            <div class="form-cell">Type</div>
            <div class="form-cell">Text</div>
            <div class="form-cell">Edit in Django Admin</div>
        </div>
       {% for canvas in original.digital_edition.canvases.all %}
                {% for intervention in canvas.intervention_set.all %}

        <!-- element -->
        <div class="inline-related"
                id="to-relationship-read-only">

                  <div class="fieldset module">
                    <div class="item form-cell">
                        {# TODO: add anchor link logic to link directly to intervention #}
                        <a href="{{ intervention.canvas.get_absolute_url }}"
                            title="View on canvas">{{ intervention.admin_thumbnail|safe }}</a>
                    </div>
                    <div class="item form-cell">{{ canvas.label }}</div>
                    <div class="item form-cell">{{ intervention.get_intervention_type_display }}</div>
                    <div class="item form-cell">{{ intervention.text_preview }}</div>
                    <div class="item form-cell">
                        <a href="{% url 'admin:interventions_intervention_change' intervention.id %}" class="grp-state-focus">Edit</a>
                    </div>
                </div>
        </div>
                {% endfor %}
            {% endfor %}

    </div>

</div>

{% endblock %}