{% extends "master.html" %}

{% block title %}Projects Monitored · Anitya{% endblock %}

{% block body %}

{% if distroname %}
{% set page_url = url_for('anitya_ui.distro', distroname=distroname) %}
{% else %}
{% set page_url = url_for('anitya_ui.projects') %}
{% endif %}

<div class="d-flex flex-wrap justify-content-between align-items-center mb-3 gap-2">
  <div>
    <h1>Projects {% if distroname %}of {{ distroname }}{% endif %} monitored</h1>
    <span class="badge bg-secondary">{{ projects_count }} projects found</span>
  </div>
  <div>
    {% if distroname %}
    <form action="{{ url_for('anitya_ui.distro_projects_search', distroname=distroname)}}" role="form" class="d-flex gap-2">
    {% else %}
    <form action="{{ url_for('anitya_ui.projects_search') }}" role="form" class="d-flex gap-2">
    {% endif %}
      <input type="text" name="pattern" placeholder="Project name" class="form-control form-control-sm"/>
      <button type="submit" class="btn btn-sm btn-outline-success text-nowrap">
        Search
      </button>
    </form>
  </div>
</div>

{% if total_page > 1 %}
<div class="d-flex justify-content-end mb-3">
  <nav aria-label="Projects pagination">
    <ul class="pagination pagination-sm mb-0">
      {% if page > 1 %}
      <li class="page-item">
        <a class="page-link" href="{{ page_url }}?page={{ page - 1 }}{% if sort %}&sort={{ sort }}{% endif %}">«</a>
      </li>
      {% else %}
      <li class="page-item disabled">
        <span class="page-link">«</span>
      </li>
      {% endif %}
      <li class="page-item disabled">
        <span class="page-link">{{ page }} / {{ total_page }}</span>
      </li>
      {% if page < total_page %}
      <li class="page-item">
        <a class="page-link" href="{{ page_url }}?page={{ page + 1 }}{% if sort %}&sort={{ sort }}{% endif %}">»</a>
      </li>
      {% else %}
      <li class="page-item disabled">
        <span class="page-link">»</span>
      </li>
      {% endif %}
    </ul>
  </nav>
</div>
{% endif %}

<div class="table-responsive shadow-sm rounded border mb-3">
  {% if projects %}
  <table class="table table-striped table-hover align-middle mb-0 w-100">
    <thead>
      <tr>
        <th scope="col" style="width: 30%;">
          Name 
          <a href="?page={{ page }}&sort=name_asc" class="text-decoration-none {% if sort == 'name_asc' %}text-primary fw-bold{% else %}text-muted{% endif %}" title="Sort Ascending">▲</a> 
          <a href="?page={{ page }}&sort=name_desc" class="text-decoration-none {% if sort == 'name_desc' %}text-primary fw-bold{% else %}text-muted{% endif %}" title="Sort Descending">▼</a>
        </th>
        <th scope="col">
          Homepage 
          <a href="?page={{ page }}&sort=homepage_asc" class="text-decoration-none {% if sort == 'homepage_asc' %}text-primary fw-bold{% else %}text-muted{% endif %}" title="Sort Ascending">▲</a> 
          <a href="?page={{ page }}&sort=homepage_desc" class="text-decoration-none {% if sort == 'homepage_desc' %}text-primary fw-bold{% else %}text-muted{% endif %}" title="Sort Descending">▼</a>
        </th>
        <th scope="col" style="width: 20%;">
          Backend 
          <a href="?page={{ page }}&sort=backend_asc" class="text-decoration-none {% if sort == 'backend_asc' %}text-primary fw-bold{% else %}text-muted{% endif %}" title="Sort Ascending">▲</a> 
          <a href="?page={{ page }}&sort=backend_desc" class="text-decoration-none {% if sort == 'backend_desc' %}text-primary fw-bold{% else %}text-muted{% endif %}" title="Sort Descending">▼</a>
        </th>
      </tr>
    </thead>
    <tbody>
      {% for project in projects %}
      <tr>
        <td class="text-break">
          <a href="{{ url_for('anitya_ui.project', project_id=project.id) }}">{{ project.name }}</a>
        </td>
        <td class="text-break">
                <a href="{{ project.homepage }}" target="_blank" rel="noopener noreferrer">
                  {{ project.homepage }}
                </a>
        </td>
        <td>
          <span class="badge bg-body-tertiary text-body border">{{ project.backend }}</span>
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
  {% else %}
  <blockquote>
      Oops, this is embarrassing. It seems that no projects are being
      monitored currently.
  </blockquote>
  {% endif %}
</div>

{% if total_page > 1 %}
<div class="d-flex justify-content-end mb-3">
  <nav aria-label="Projects pagination bottom">
    <ul class="pagination pagination-sm mb-0">
      {% if page > 1 %}
      <li class="page-item">
        <a class="page-link" href="{{ page_url }}?page={{ page - 1 }}{% if sort %}&sort={{ sort }}{% endif %}">«</a>
      </li>
      {% else %}
      <li class="page-item disabled">
        <span class="page-link">«</span>
      </li>
      {% endif %}
      <li class="page-item disabled">
        <span class="page-link">{{ page }} / {{ total_page }}</span>
      </li>
      {% if page < total_page %}
      <li class="page-item">
        <a class="page-link" href="{{ page_url }}?page={{ page + 1 }}{% if sort %}&sort={{ sort }}{% endif %}">»</a>
      </li>
      {% else %}
      <li class="page-item disabled">
        <span class="page-link">»</span>
      </li>
      {% endif %}
    </ul>
  </nav>
</div>
{% endif %}

{% endblock %}