{% extends 'base.html' %}

{% block title %} | Air Quality{% endblock %}

{% block main %}
{% include 'aq_header.html' %}

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <h3 class="header">
                <span>Statistics</span>

                <a role="button" href="{% url 'geokey_airquality:export' 'measurements' %}.csv" class="btn btn-sm btn-primary pull-right {% if total_measurements == 0 %}disabled{% endif %}">
                    <span class="glyphicon glyphicon-export"></span>
                    <span>Export CSV</span>
                </a>
            </h3>

            <div id="statistics" class="row">
                <div class="col-sm-6">
                    <span class="number">{{ total_locations }}</span>
                    <p>location{{ total_locations|pluralize }} added</p>
                </div>

                <div class="col-sm-6">
                    <span class="number">{{ total_measurements }}</span>
                    <p>active measurement{{ total_measurements|pluralize }}</p>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-12">
            <h3 class="header">
                <span>Manage projects</span>

                {% if projects %}
                    <a role="button" href="{% url 'geokey_airquality:add' %}" class="btn btn-sm btn-success pull-right">
                        <span class="glyphicon glyphicon-plus"></span>
                        <span>Add new project</span>
                    </a>
                {% endif %}
            </h3>

            <ul class="list-unstyled overview-list">
                {% for project in projects %}
                    <li>
                        <h3><a href="{% url 'geokey_airquality:project' project.id %}">{{ project.project.name }}</a></h3>
                        <p>{% if project.status == 'inactive' %}<a href="{% url 'geokey_airquality:project' project.id %}" class="label label-default" data-loader="true">Inactive</a>{% endif %}</p>
                        <p class="meta">Added by {{ project.creator.display_name }} {{ project.created|timesince }} ago</p>
                    </li>
                {% empty %}
                    <li>
                        <div class="well empty-list">
                            <p class="lead">We couldn't find any projects you are eligible to manage.</p>
                            <p>You can add a new project if you want it to be used with the Air Quality app.</p>
                            <a href="{% url 'geokey_airquality:add' %}" class="btn btn-lg btn-success">Add a new project</a>
                        </div>
                    </li>
                {% endfor %}
            </ul>
        </div>
    </div>
</div>
{% endblock %}