{% extends "base.html" %}

{% block title %}Workers · Flower{% end %}

{% block navbar %}
{% module Template("navbar.html", active_tab="workers")%}
{% end %}

{% block container %}
<div class="page-section workers-page">
  <header class="page-header">
    <div>
      <p class="page-eyebrow">Cluster overview</p>
    </div>
    <div class="refresh-status" aria-live="polite">
      <span class="status-dot status-dot-live" id="workers-live-indicator" aria-hidden="true"></span>
      <span id="workers-refresh-status">Connecting…</span>
    </div>
  </header>

  <section class="metric-grid" aria-label="Worker summary">
    <article class="metric-card">
      <p class="metric-label">Online workers</p>
      <p class="metric-value" id="workers-online">—</p>
    </article>
    <article class="metric-card metric-card-active">
      <p class="metric-label">Active tasks</p>
      <p class="metric-value" id="workers-active">—</p>
    </article>
    <article class="metric-card metric-card-success">
      <p class="metric-label">Succeeded</p>
      <p class="metric-value" id="workers-succeeded">—</p>
    </article>
    <article class="metric-card metric-card-danger">
      <p class="metric-label">Failed</p>
      <p class="metric-value" id="workers-failed">—</p>
    </article>
  </section>

  <section class="workers-table-card" aria-label="Workers">
    <figure class="table-responsive mb-0">
      <table id="workers-table" class="workers-table table table-hover align-middle w-100 mb-0">
      <thead>
        <tr>
          <th>Worker</th>
          <th class="text-center">Status</th>
          <th class="text-center">Active</th>
          <th class="text-center">Processed</th>
          <th class="text-center">Failed</th>
          <th class="text-center">Succeeded</th>
          <th class="text-center">Load Average</th>
        </tr>
      </thead>
      <tbody>
        {% for name, info in workers.items() %}
        <tr id="{{ url_escape(name) }}">
          <td>{{ name }}</td>
          <td>{{ info.get('status', None) }}</td>
          <td>{{ format_count(info.get('active')) }}</td>
          <td>{{ format_count(info.get('task-received')) }}</td>
          <td>{{ format_count(info.get('task-failed')) }}</td>
          <td>{{ format_count(info.get('task-succeeded')) }}</td>
          <td>{% raw format_value(info.get('loadavg')) %}</td>
        </tr>
        {% end %}
      </tbody>
      <tfoot>
        <tr>
          <th>Total</th>
          <th></th>
          <th></th>
          <th></th>
          <th></th>
          <th></th>
          <th></th>
        </tr>
      </tfoot>
      </table>
    </figure>
  </section>
</div>
{% end %}

{% block extra_scripts %}
<script type="text/javascript">
  var autorefresh = {{ autorefresh }};
</script>
{% end %}