{% extends 'base.html' %}
{% block title %}Inspect Cluster{% endblock %}
{% block page_content %}
  <div class="enterClusterID">
    <form class="formGroup" action="/inspect" method="GET">
      <div class="formGroup">
        <label for="clusterID">Enter Cluster ID :</label>
        <input
          type="text"
          id="clusterID"
          name="clusterID"
          class="formControl"
          placeholder="Cluster ID"
        />
      </div>
      <button type="submit" class="btn btnDefault">Submit</button>
    </form>
  </div>
  <div class="clusterAffiliates">
    {% if affiliates %}
      <h1>The affiliates associated with given cluster ID: {{ clusterID }}</h1>
      <ol>
      {% for a in affiliates %}
        <li class="affiliateID">Affliate ID: {{ a }}</li>
        <ul>
          <li class="affiliateData">
            <span> Affliate Data: {{ affiliates[a].data }} </span>
          </li>
          {% if affiliates[a].endpoints %}
            <li class="affiliateEndpoints">
              Affiliate Endpoints:
              <ul>
                {% for e in affiliates[a].endpoints %}
                  <li>{{ e.data }}</li>
                {% endfor %}
              </ul>
            </li>
          {% else %}
            <p>No endpoints found</p>
          {% endif %}
        </ul>
      {% endfor %}
      </ol>
    {% elif clusterID %}
      <h1>No Affiliate data found in cluster: {{ clusterID }}</h1>
    {% else %}
    {% endif %}
  </div>
{% endblock %}