{% extends "admin/base_site.html" %}
{% load i18n static postgres_metrics %}

{% block extrastyle %}
    {{ block.super }}
    <link rel="stylesheet" type="text/css" href="{% static "admin/css/changelists.css" %}" />
    <link rel="stylesheet" type="text/css" href="{% static "postgres_metrics/css/base.css" %}" />
{% endblock %}

{% block bodyclass %}{{ block.super }} app-{{ opts.app_label }} model-{{ opts.model_name }} change-list{% endblock %}

{% block breadcrumbs %}
<div class="breadcrumbs">
    <a href="{% url 'admin:index' %}">{% trans 'Home' %}</a>
    &rsaquo; <a href="{% url 'admin:index' %}#postgres-metrics">{% trans 'PostgreSQL Metrics' %}</a>
    &rsaquo; <span aria-current="page">{{ metric.label }}</span>
</div>
{% endblock %}

{% block coltype %}flex{% endblock %}

{% block content %}
<div id="content-main">
    {% if metric.description %}
    <div id="toolbar">
        {{ metric.description|safe }}
    </div>
    {% endif %}
    {% for result in results %}
    <div class="module filtered" id="changelist">
        {% if forloop.first %}
            <div id="changelist-filter">
                <h2>{% trans 'PostgreSQL Metrics' %}</h2>
                {% get_postgres_metrics as postgres_metrics %}
                <ul>
                    {% for iter_metric in postgres_metrics %}
                    {% url "postgres-metrics:show" name=iter_metric.slug as metric_url %}
                        <li{% if metric.slug == iter_metric.slug %} class="selected"{% endif %}>
                            <a href="{{ metric_url }}" title="{{ iter_metric.label }}" {% if metric.slug == iter_metric.slug %}aria-current="page"{% endif %}>{{ iter_metric.label }}</a>
                        </li>
                    {% endfor %}
                </ul>
            </div>
        {% endif %}
        <div class="results">
            <table id="result_list">
                <caption>{{ result.alias }} ({{ result.dsn }})</caption>
                <thead>
                    <tr>
                        {% for header in metric.headers %}
                        <th scope="col" class="sortable{% if header.sort_priority > 0 %} sorted {% if header.ascending %}ascending{% else %}descending{% endif %}{% endif %}">
                            {% if header.sort_priority > 0 %}
                            <div class="sortoptions">
                                <a class="sortremove" href="?o={{ header.url_remove }}" title="{% trans "Remove from sorting" %}"></a>
                                <span class="sortpriority" title="{% blocktrans with priority_number=header.sort_priority %}Sorting priority: {{ priority_number }}{% endblocktrans %}">{{ header.sort_priority }}</span>
                                <a href="?o={{ header.url_toggle }}" class="toggle {% if header.ascending %}ascending{% else %}descending{% endif %}" title="{% trans "Toggle sorting" %}"></a>
                            </div>
                            {% endif %}
                            <div class="text"><a href="?o={{ header.url_primary }}">{{ header }}</a></div>
                            <div class="clear"></div>
                        </th>
                        {% endfor %}
                    </tr>
                </thead>
                <tbody>
                    {% if result.holds_data %}
                        {% for record in result.records %}
                        <tr class="{% cycle 'row1' 'row2' %} {% record_style %}">{% for item in record %}<td class="{% record_item_style %}">{{ item }}</td>{% endfor %}</tr>
                        {% endfor %}
                        {% resetcycle %}
                    {% else %}
                        <tr class="pgm-critical"><td colspan="{{ metric.headers|length }}">{{ result.reason }}</td></tr>
                    {% endif %}
                </tbody>
            </table>
        </div>
    </div>
    {% endfor %}
</div>
{% endblock %}
