{% extends 'base.html' %}
{% block title %}Queue Data{% endblock %}

{% block content %}
<style>
    table {
        margin: 2%;
        table-layout: fixed;
        width: 96% !important;;
    }
</style>
<div style="width: 100%">
<table class="table table-hover">
  <thead>
    <tr class="table-warning">
      <th scope="col">Item</th>
      <th scope="col">Value</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <th scope="row">Processes Finished</th>
      <td>{{ queue.finished }}</td>
    </tr>
    <tr>
      <th scope="row">Processes Running</th>
      <td>{{ queue.running }}</td>
    </tr>
    <tr>
      <th scope="row">Max Threads At One Moment</th>
      <td>{{ queue.thread_cap }}</td>
    </tr>
    <tr>
      <th scope="row">Total Processes</th>
      <td>{{ queue.total }}</td>
    </tr>
    <tr>
      <th scope="row">Time for Last Process</th>
      <td>{{ queue.time }}</td>
    </tr>
    <tr>
      <th scope="row">Minimum Process Time</th>
      <td>{{ queue.minTime }}</td>
    </tr>
    <tr>
      <th scope="row">Maximum Process Time</th>
      <td>{{ queue.maxTime }}</td>
    </tr>
    <tr class="table-warning">
      <th scope="col">ML Item</th>
      <th scope="col">Value</th>
    </tr>
    <tr>
      <th scope="row">Total Processes</th>
      <td>{{ queue.ml_total }}</td>
    </tr>
    <tr>
      <th scope="row">Time for Last Process</th>
      <td>{{ queue.ml_time }}</td>
    </tr>
    <tr>
      <th scope="row">Finished Processes</th>
      <td>{{ queue.ml_finished }}</td>
    </tr>
    <tr>
      <th scope="row">Running Processes</th>
      <td>{{ queue.ml_running }}</td>
    </tr>

{#    <tr class="table-info">#}
{#      <th scope="row">Info</th>#}
{#      <td>Column content</td>#}
{#    </tr>#}
{#    <tr class="table-light">#}
{#      <th scope="row">Light</th>#}
{#      <td>Column content</td>#}
{#    </tr>#}
{#    <tr class="table-dark">#}
{#      <th scope="row">Dark</th>#}
{#      <td>Column content</td>#}
{#    </tr>#}
  </tbody>
</table>

<table class="table table-hover">
    <tr class="table-success">
        <th>Threads in Docking Queue</th>
    </tr>
    {% for item in queue.queue_contents %}
        <tr>
            <td>{{ item }}</td>
        </tr>
    {% endfor %}
</table>

<table class="table table-hover">
    <tr class="table-success">
        <th>Threads in ML Queue</th>
    </tr>
    {% for item in queue.queue_ml_contents %}
        <tr>
            <td>{{ item }}</td>
        </tr>
    {% endfor %}
</table>

<table class="table table-hover">
    <thead>
        <tr class="table-info">
            <th>Running Threads</th>
        </tr>
    </thead>
    <tbody>
    {% for item in queue.thread %}
        <tr>
            <td>{{ item }}</td>
        </tr>
    {% endfor %}
    </tbody>
</table>

<table class="table table-hover">
    <thead>
        <tr class="table-primary">
            <th>Trained ML Models (all 4 trained) {{ queue.fraction }}</th>
        </tr>
    </thead>
    <tbody>
    {% for item in queue.trained %}
        <tr>
            <td>{{ item }}</td>
        </tr>
    {% endfor %}
    </tbody>
</table>

<table class="table table-hover">
    <tr class="table-danger">
      <th scope="row">Clear Queue</th>
      <td><button onclick="clearQueue()" class="btn btn-dark">Clear Queue</button></td>
    </tr>
</table>

<table class="table table-hover">
    <thead>
        <tr class="table-warning">
            <th colspan="1">Adjust Threads</th>
            <th colspan="2">Current Max Threads</th>
        </tr>
    </thead>
    <tbody>
        <tr>
          <td scope="row">Max Docking Processes</td>
          <td>{{ queue.dockingQ }}</td>
            <td>
                <form method="POST" enctype="multipart/form-data" class="row" target="_blank" action="{{ url_for('docking_thread') }}">
                  <select style="width: 10rem; margin-right: 1rem" name="docking" class="custom-select">
                  <option selected="true" disabled="disabled"></option>
                      <option value="0" selected>0</option>
                        {% for i in range(1, 10) %}
                          <option value="{{ i }}">{{ i }}</option>
                        {% endfor %}
                  </select>
                    <button type="submit" class="btn btn-dark">Submit</button>

              </form>
            </td>
        </tr>
        <tr>
          <td scope="row">Max ML Processes</td>
          <td>{{ queue.mlQ }}</td>
            <td>
                <form method="POST" enctype="multipart/form-data" class="row" target="_blank" action="{{ url_for('ml_thread') }}">
                  <select style="width: 10rem; margin-right: 1rem" name="ml" class="custom-select">
                  <option selected="true" disabled="disabled"></option>
                      <option value="0" selected>0</option>
                        {% for i in range(1, 10) %}
                          <option value="{{ i }}">{{ i }}</option>
                        {% endfor %}
                  </select>
                    <button type="submit" class="btn btn-dark">Submit</button>

              </form>
            </td>
        </tr>
    </tbody>
{#    <tr class="table-danger">#}
{#      <td scope="row">Max Docking Processes</td>#}
{#      <td><button onclick="clearQueue()" class="btn btn-dark">{{ queue.mlQ }}</button></td>#}
{#    </tr>#}
{#    <tr class="table-danger">#}
{#      <td scope="row">Max Docking Processes</td>#}
{#      <td><button onclick="clearQueue()" class="btn btn-dark">{{ queue.dockingQ }}</button></td>#}
{#    </tr>#}
</table>

</div>
{% endblock %}