{% extends "admin/base_site.html" %}
{% load static %}

{% block extrahead %}
{{ block.super }}
<script type="text/javascript" src="{% static 'turkle/jquery-3.3.1.min.js' %}"></script>
<script type="text/javascript" src="{% static 'turkle/datatables/datatables.min.js' %}"></script>
<script src="https://unpkg.com/@alenaksu/json-viewer@2.1.0/dist/json-viewer.bundle.js"></script>
<link href="{% static 'turkle/datatables/datatables.bootstrap4.min.css' %}" rel="stylesheet" type="text/css"/>
<script>
  $(document).ready(function() {
    $('#results-table').DataTable({
      info: false,
      paging: false,
      searching: false
    });
  });
</script>
<style>
/* Light theme (default) */
json-viewer {
  --background-color: #fff;
  --color: #000;
  --string-color: #22863a;
  --number-color: #005cc5;
  --boolean-color: #d73a49;
  --null-color: #6f42c1;
  --property-color: #032f62;
  --preview-color: #6a737d;
  --indentguide-color: #ddd;
  --indentguide-color-active: #aaa;
  --outline-color: #ccc;
}

/* Dark theme (Django admin dark mode) */
html[data-theme="dark"] json-viewer {
  --background-color: #121212;
  --color: #f8f8f2;
  --string-color: #a3eea0;
  --number-color: #d19a66;
  --boolean-color: #4ba7ef;
  --null-color: #df9cf3;
  --property-color: #6fb3d2;
  --preview-color: #deae8f;
  --indentguide-color: #333;
  --indentguide-color-active: #666;
  --outline-color: #e0e4e5;
}
</style>
{% endblock %}

{% block breadcrumbs %}
<div class="breadcrumbs">
<a href="{% url 'admin:index' %}">Home</a>
&rsaquo; <a href="{% url 'admin:app_list' app_label='turkle' %}">Turkle</a>
&rsaquo; <a href="{% url 'admin:turkle_batch_changelist' %}">Batches</a>
&rsaquo; Review
</div>
{% endblock %}

{% block content %}
<div class="module">
  <table>
    <tr>
      <th>Project Name</th>
      <td>{{ batch.project.name }}</td>
    </tr>
    <tr>
      <th>Batch Name</th>
      <td>{{ batch.name }}</td>
    </tr>
    <tr>
      <th>Assignments per Task</th>
      <td>{{ batch.assignments_per_task }}</td>
    </tr>
    <tr>
      <th>Tasks Completed</th>
      <td>{{ batch.total_finished_tasks }} / {{ batch.total_tasks }}</td>
    </tr>
    <tr>
      <th>Task Assignments Completed</th>
      <td>{{ batch.total_finished_task_assignments }} / {{ batch.total_task_assignments }}</td>
    </tr>
  </table>
</div>

<div>
  <table id="results-table">
    <thead>
      <tr>
        {% for name in field_names %}
          <th>{{ name }}</th>
        {% endfor %}
      </tr>
    </thead>
    <tbody>
      {% for row in rows %}
        <tr>
          {% for entry in row %}
            {% if forloop.counter0 in json_columns %}
            <td><json-viewer data="{{ entry }}"></json-viewer></td>
            {% else %}
            <td>{{ entry }}</td>
            {% endif %}
          {% endfor %}
        </tr>
      {% endfor %}
    </tbody>
  </table>
</div>

{% endblock %}