{% extends "lava_scheduler_app/_content.html" %}

{% block content %}
<h2>Devices</h2>

<table class="display data">
  <thead>
    <tr>
      <th>Type</th>
      <th>Hostname</th>
      <th>Status</th>
    </tr>
  </thead>
  <tbody>
    {% for device in devices %}
    <tr>
      <td>{{ device.device_type }}</td>
      <td>{{ device.hostname }}</td>
      <td>{{ device.get_status_display }}</td>
    </tr>
    {% endfor %}
  </tbody>
</table>

<h2>Active Jobs</h2>

<table class="data display">
  <thead>
    <tr>
      <th class="id">ID</th>
      <th>Status</th>
      <th>Device</th>
      <th>Submitter</th>
      <th>Submit Time</th>
    </tr>
  </thead>
  <tbody>
    {% for job in jobs %}
    <tr>
      <td><a href="{% url lava_scheduler_app.views.job pk=job.pk %}">{{ job.id }}</a></td>
      <td>{{ job.get_status_display }}</td>
      <td>{{ job.actual_device }}</td>
      <td>{{ job.submitter }}</td>
      <td>{{ job.submit_time }}</td>
    </tr>
    {% endfor %}
  </tbody>
</table>

<a href="{% url lava_scheduler_app.views.alljobs %}">All jobs</a>

<script>
$(document).ready(
  function() {
    $("table.data").dataTable({
      "bJQueryUI": true,
      "aoColumnDefs": [
        { "sType": "num-html", "aTargets": [ "id" ] }
      ]
    });
  }
);
</script>

{% endblock %}