{% extends "aggregator/base.html" %}

{% block head %}


{% endblock %}

{% block content %}

<div class="page-header">
  <h1>Celery quick monitor</h1>
</div>

<h2>Active Tasks</h2>

{% if active_tasks %}
  <div class="row">
    <div class="col-md-12">
      <table class="table table-striped">
        <thead>
          <tr>
            <th>Task ID</th>
            <th>Name, Args</th>
            <th>State</th>
            <th>Worker</th>
            <th>Progress</th>
            <th>%</th>
          </tr>
        </thead>
        <tbody>
          {% for task in active_tasks %}

          <script>
          function update_progressbar_{{ task.task_id_sanitized }}() {
              $.ajax({ dataType:"json",
                  url: "/registry/update_progressbar/{{ task.task_id }}",
                      success: function(data){
                          $("#status_{{ task.task_id_sanitized }}").html(data.status);
                          $("#state_{{ task.task_id_sanitized }}").html(data.state);
                          $("#progressbar_{{ task.task_id_sanitized }}").progressbar({
                              value: data.progressbar
                          });
                      }
              });
          };

          update_progressbar_{{ task.task_id_sanitized }}();

          setInterval(function(){
              update_progressbar_{{ task.task_id_sanitized }}()
          }, 3000);
          </script>

            <tr>
              <td>{{ task.task_id }}</td>
              <td>{{ task.name }}, {{ task.args }}</td>
              <td><div id="state_{{ task.task_id_sanitized }}"></div></td>
              <td>{{ task.worker }}</td>
              <td><div id="progressbar_{{ task.task_id_sanitized }}"></div></td>
              <td><div id="status_{{ task.task_id_sanitized }}"></div></td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
{% else %}
  <p>No active tasks at this time.</p>
{% endif %}

<h2>Reserved Tasks</h2>

<script>
function update_jobs_number() {
    $.ajax({ dataType:"json",
        url: "/registry/update_jobs_number",
            success: function(data){
                $("#jobs_number").text(data.jobs);
            }
    });
};

setInterval(function(){
    update_jobs_number();
}, 3000);
</script>

<span id="jobs_number">{{ jobs }}</span> jobs are in the queue, these are the reserved (prefetched) ones:

{% if active_tasks %}
  <div class="row">
    <div class="col-md-12">
      <table class="table table-striped">
        <thead>
          <tr>
            <th>Task ID</th>
            <th>Name</th>
            <th>Args</th>
          </tr>
        </thead>
        <tbody>
          {% for task in reserved_tasks %}
            <tr>
              <td>{{ task.task_id }}</td>
              <td>{{ task.name }}</td>
              <td>{{ task.args }}</td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
{% else %}
  <p>No reserved tasks at this time.</p>
{% endif %}

{% if user.is_superuser %}

<h2>Admin Commands</h2>

<form action="." method="post">
  {% csrf_token %}
  <input type="submit" name='check_all' value="Check all services">
  <input type="submit" name='index_all' value="Reindex all layers">
  <input type="submit" name='clear_index' value="Clear Index">
</form>
{% endif %}

{% endblock %}
