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

{% block header %}
<script type="text/javascript" src="{% static 'turkle/jquery-3.3.1.min.js' %}"></script>
<script type="text/javascript" src="{% static 'turkle/datatables-1.10.24/datatables.min.js' %}"></script>
<script type="text/javascript" src="{% static 'turkle/d3-3.5.17.min.js' %}"></script>
<script type="text/javascript" src="{% static 'turkle/cal-heatmap-3.6.2.min.js' %}"></script>
<link href="{% static 'turkle/datatables-1.10.24/datatables.bootstrap4.min.css' %}" rel="stylesheet" type="text/css"/>
<link href="{% static 'turkle/cal-heatmap.css' %}" rel="stylesheet" type="text/css"/>
<style>
#activity-calendar-container {
  margin-bottom: 1em;
}
#user-statistics-container {
  margin-bottom: 1em;
}
</style>
<script>
$(document).ready(function() {
  $('#unsubmitted-assignment-stats').DataTable({
    info: false,
    paging: false,
    searching: false
  });

  $('#user-stats').DataTable({
    info: false,
    paging: false,
    searching: false
  });

  // Set startDate to include previous 11 months plus all of current month
  var currentDate = new Date();
  var year = currentDate.getFullYear();
  var month = currentDate.getMonth(); // 0-indexed
  month -= 11;
  if (month < 0) {
    month += 12;
    year -= 1;
  }
  var startDate = new Date(year, month, 1);

  var cal = new CalHeatMap();
  cal.init({
    itemSelector: "#activity-calendar",
    data: "{% url 'admin:turkle_batch_activity_json' batch.id %}",
    domain: "month",
    subDomain: "day",
    start: startDate,
    weekStartOnMonday: false,
  });
});
</script>
{% endblock %}

{% block body %}

<div class="container mt-2">

  {% if error_message %}<p><strong>{{ error_message }}</strong></p>{% endif %}

  <h2>Batch Statistics</h2>

  <div>
    <table class="table table-sm table-bordered thead-light">
      <tr>
        <th scope="col" class="column-large">Batch Name</th>
        <td scope="col">{{ batch.name }}</td>
      </tr>
      <tr>
        <th>
          Project Name
          (<a href="{% url 'admin:turkle_project_stats' batch.project_id %}">Project Statistics</a>)

        </th>
        <td>{{ batch.project.name }}</td>
      </tr>
      <tr>
        <th>Project Created by</th>
        <td>{{ batch.project.created_by.get_full_name }} ({{ batch.project.created_by.username }})</td>
      </tr>
      <tr>
        <th>Batch Created at</th>
        <td>{{ batch.created_at }}</td>
      </tr>
      <tr>
        <th>Batch Created by</th>
        <td>{{ batch.created_by.get_full_name }} ({{ batch.created_by.username }})</td>
      </tr>
      <tr>
        <th>Input CSV Filename</th>
        <td>{{ batch.filename }}</td>
      </tr>
      <tr>
        <th>Active?</th>
        <td>{% if batch.active %} Yes {% else %} No {% endif %}
        </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>
      <tr>
        <th>First Assignment Completed at</th>
        <td>{{ first_finished_time }}</td>
      </tr>
      <tr>
        <th>Most Recent Assignment Completed at</th>
        <td>{{ last_finished_time }}</td>
      </tr>
      <tr>
        <th>Total Work Time</th>
        <td>{{ batch_total_work_time }}</td>
      </tr>
      <tr>
        <th>Mean Time / Assignment</th>
        <td>{{ batch_mean_work_time }}</td>
      </tr>
      <tr>
        <th>Median Time / Assignment</th>
        <td>{{ batch_median_work_time}}</td>
      </tr>
      <!--
      <tr>
        <th></th>
        <td></td>
      </tr>
      -->
    </table>
  </div>

  <h2>Task Assignment Completion Activity</h2>

  <div id="activity-calendar-container">
    <div id="activity-calendar"></div>
  </div>

  <h2>User Statistics</h2>

  <div id="user-statistics-container">
    <table id="user-stats" class="table table-sm table-bordered">
      <thead class="thead-light">
        <tr>
          <th>Username</th>
          <th>Name</th>
          <th># Assignments</th>
          <th>Mean Time</th>
          <th>Median Time</th>
          <th>Most Recent Assignment</th>
        </tr>
      </thead>
      <tbody>
        {% for stats_user in stats_users %}
        <tr>
          <td>{{ stats_user.username }}</td>
          <td>{{ stats_user.full_name }}</td>
          <td>{{ stats_user.assignments_completed }}</td>
	  {% if stats_user.has_completed_assignments %}
          <td data-order="{{ stats_user.mean_work_time }}">
	    {{ stats_user.mean_work_time }}s
	  </td>
          <td data-order="{{ stats_user.median_work_time }}">
	    {{ stats_user.median_work_time }}s
	  </td>
          <td data-order="{{ stats_user.last_finished_time| date:"c" }}">
	    {{ stats_user.last_finished_time }}
	  </td>
	  {% else %}
          <td data-order="-1">{{ stats_user.mean_work_time }}</td>
          <td data-order="-1">{{ stats_user.median_work_time }}</td>
          <td>{{ stats_user.last_finished_time }}</td>
	  {% endif %}
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>

  <h2>Unsubmitted Assignments</h2>

  <div>
    <table id="unsubmitted-assignment-stats" class="table table-sm table-bordered">
      <thead class="thead-light">
	<tr>
	  <th>Assignment ID</th>
          <th>Username</th>
          <th>Name</th>
	  <th>Created at</th>
	  <th>Expires at</th>
	</tr>
      </thead>
      <tbody>
	{% for uta in unsubmitted_task_assignments %}
	<tr>
	  <td>
	    {{ uta.id }}
	  </td>
	  <td>
	    {{ uta.assigned_to.username }}
	  </td>
	  <td>
	    {{ uta.assigned_to.get_full_name }}
	  </td>
	  <td data-order="{{ uta.created_at|date:'c' }}">
	    {{ uta.created_at }}
	  </td>
	  <td data-order="{{ uta.expires_at|date:'c' }}">
	    {{ uta.expires_at }}
	  </td>
	</tr>
	{% endfor %}
      </tbody>
    </table>
  </div>

</div><!-- /.container -->

{% endblock %}