{% load filters %}

<div class="row">

    {% include "activity/activity_laps.html" %}


    {% if activity.trace_file.avg_cadence and activity.trace_file.max_cadence %}
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Cadence</h4>
                </div>
                <div class="card-body">
                    <table class="table table-hover table-borderless text-muted table-sm">
                        {% if activity.trace_file.avg_cadence %}
                            <tr data-toggle="tooltip" data-placement="left" title="Average Cadence">
                                <td><i class="fas fa-shoe-prints"></i><small> avg</small></td>
                                <td>{{ activity.trace_file.avg_cadence }}</td>
                            </tr>
                        {% endif %}
                        <tr data-toggle="tooltip" data-placement="left" title="Max Cadence">
                            <td><i class="fas fa-shoe-prints" style="color: grey"></i><small style="color: grey"> max</small>
                            </td>
                            <td>{{ activity.trace_file.max_cadence }}</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    {% endif %}

    {% if activity.trace_file.avg_speed and activity.trace_file.max_speed %}
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Speed</h4>
                </div>
                <div class="card-body">
                    <table class="table table-hover table-borderless text-muted table-sm">
                        <tr data-toggle="tooltip" data-placement="left" title="Average Speed">
                            <td><i class="fas fa-tachometer-alt" style="color: grey"></i><small style="color: grey"> avg</small>
                            </td>
                            <td>{{ activity.trace_file.avg_speed | m_per_s_to_km_per_h }} km/h</td>
                        </tr>
                        <tr data-toggle="tooltip" data-placement="left" title="Max Speed">
                            <td><i class="fas fa-tachometer-alt" style="color: grey"></i><small style="color: grey"> max</small>
                            </td>
                            <td>{{ activity.trace_file.max_speed | m_per_s_to_km_per_h }} km/h</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    {% endif %}

    {% if activity.trace_file.total_ascent and activity.trace_file.total_descent %}
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Elevation</h4>
                </div>
                <div class="card-body">
                    <table class="table table-hover table-borderless text-muted table-sm">
                        <tr data-toggle="tooltip" data-placement="left" title="Total Ascent">
                            <td><i class="fas fa-arrow-up" style="color: grey"></i><small style="color: grey"> up</small>
                            </td>
                            <td>{{ activity.trace_file.total_ascent }} m</td>
                            {% if evaluates_for_awards %}
                                {% include "activity/ascent_ranking_icon.html" %}
                            {% endif %}
                        </tr>
                        <tr data-toggle="tooltip" data-placement="left" title="Total Descent">
                            <td><i class="fas fa-arrow-down" style="color: grey"></i><small style="color: grey"> down</small>
                            </td>
                            <td>{{ activity.trace_file.total_descent }} m</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    {% endif %}

    {% if activity.trace_file.avg_speed and activity.trace_file.max_speed %}
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Pace</h4>
                </div>
                <div class="card-body">
                    <table class="table table-hover table-borderless text-muted table-sm">
                        <tr data-toggle="tooltip" data-placement="left" title="Average Pace">
                            <td><i class="fas fa-stopwatch" style="color: grey"></i><small style="color: grey"> avg</small></td>
                            <td>{{ activity.trace_file.avg_speed | speed_to_pace }} min/km</td>
                        </tr>
                        <tr data-toggle="tooltip" data-placement="left" title="Best Pace">
                            <td><i class="fas fa-stopwatch" style="color: grey"></i><small style="color: grey"> high</small>
                            </td>
                            <td>{{ activity.trace_file.max_speed | speed_to_pace }} min/km</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    {% endif %}

    {% if activity.trace_file.aerobic_training_effect and activity.trace_file.anaerobic_training_effect %}
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Trainings Effect</h4>
                </div>
                <div class="card-body">
                    <table class="table table-hover table-borderless text-muted table-sm">
                        <tr>
                            <td>Aerobic</td>
                            <td>{{ activity.trace_file.aerobic_training_effect }}</td>
                        </tr>
                        <tr>
                            <td>Anaerobic</td>
                            <td>{{ activity.trace_file.anaerobic_training_effect }}</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    {% endif %}

    {% if activity.trace_file.avg_heart_rate and activity.trace_file.max_heart_rate %}
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Heart Rate</h4>
                </div>
                <div class="card-body">
                    <table class="table table-hover table-borderless text-muted table-sm">
                        <tr data-toggle="tooltip" data-placement="left" title="Min Heart Rate">
                            <td><i class="fas fa-heartbeat" style="color: grey"></i><small style="color: grey"> min</small></td>
                            <td>{{ activity.trace_file.min_heart_rate }}</td>
                        </tr>
                        <tr data-toggle="tooltip" data-placement="left" title="Average Heart Rate">
                            <td><i class="fas fa-heartbeat" style="color: grey"></i><small style="color: grey"> avg</small></td>
                            <td>{{ activity.trace_file.avg_heart_rate }}</td>
                        </tr>
                        <tr data-toggle="tooltip" data-placement="left" title="Max Heart Rate">
                            <td><i class="fas fa-heartbeat" style="color: grey"></i><small style="color: grey"> max</small></td>
                            <td>{{ activity.trace_file.max_heart_rate }}</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    {% endif %}

    {% if activity.trace_file.min_temperature and activity.trace_file.avg_temperature and activity.trace_file.max_temperature %}
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Temperature</h4>
                </div>
                <div class="card-body">
                    <table class="table table-hover table-borderless text-muted table-sm">
                        <tr data-toggle="tooltip" data-placement="left" title="Min Temperature">
                            <td><i class="fas fa-thermometer-empty" style="color: grey"></i><small style="color: grey">
                                min</small></td>
                            <td>{{ activity.trace_file.min_temperature }} °C</td>
                        </tr>
                        {% if activity.trace_file.avg_temperature %}
                            <tr data-toggle="tooltip" data-placement="left" title="Average Temperature">
                                <td><i class="fas fa-thermometer-half" style="color: grey"></i><small style="color: grey">
                                    avg</small></td>
                                <td>{{ activity.trace_file.avg_temperature }} °C</td>
                            </tr>
                        {% endif %}
                        <tr data-toggle="tooltip" data-placement="left" title="Max Temperature">
                            <td><i class="fas fa-thermometer-full" style="color: grey"></i><small style="color: grey">
                                max</small></td>
                            <td>{{ activity.trace_file.max_temperature }} °C</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>
    {% endif %}

    {% if activity.description %}
        <div class="col">
            <div class="card">
                <div class="card-header">
                    <h4 class="card-title">Description</h4>
                </div>
                <div class="card-body">
                    {{ activity.description }}
                </div>
            </div>
        </div>
    {% endif %}

</div>
