{% extends "squad/base.html" %}
{% load squad %}
{% load static %}

{% block content %}
{% include "squad/build-nav.html" %}

<div ng-app='Filter'>

<h2>Metadata</h2>
{% include "squad/_metadata.html" %}

<div ng-controller='FilterController' data-param="filter-tests">
<h2>Test results</h2>
<div class='row row-bordered'>
    <div class='col-md-12 col-sm-12'>
        <form class='filter'>
            <span class='fa fa-search'></span>
            <input ng-model='filter' name='filter' type='text' placeholder='Filter results ...'/>
        </form>
    </div>
</div>
<div class='test-results highlight-row'>
{% for status in statuses %}
{% if status.suite and status.has_tests %}
<a href="{% testrun_suite_tests_url status %}" class="status-fail{{status.tests_fail}}" {% if status.tests_fail == 0%}style='display: none'{% endif%} id='tests-{{status.id}}' ng-show='match("tests-" + {{status.id}})'>
<div class='row row-bordered {% if status.tests_fail%}fail{% else %}nofail{%endif%}'>
    <div class='col-md-3 col-sm-3' title='Test suite'>
        <i class='fa fa-list'></i>
        <strong>{{status.suite}}</strong>
    </div>

    <div class='col-md-3 col-sm-3' title='Environment'>
        <i class='fa fa-microchip'></i>
        {{status.test_run.environment}}
    </div>

    <div class='col-md-4 col-sm-4' title='Test results'>
        <i class='fa fa-check-square-o'></i>
        <span class="badge" data-toggle="tooltip" data-placement="top" title="Total">{{status.tests_total}} tests</span>
        {% if status.tests_pass > 0 %}
        <span class="badge alert-success" data-toggle="tooltip" data-placement="top" title="Pass">{{status.tests_pass}} pass</span>
        {% endif %}
        {% if status.tests_skip > 0 %}
        <span class="badge alert-warning" data-toggle="tooltip" data-placement="top" title="Skip">{{status.tests_skip}} skip</span>
        {% endif %}
        {% if status.tests_fail > 0 %}
        <span class="badge alert-danger" data-toggle="tooltip" data-placement="top" title="Fail">{{status.tests_fail}} fail</span>
        {% endif %}
    </div>

    <div class='col-md-2 col-sm-2' title='Test run'>
        <i class='fa fa-cog'></i>
        {{status.test_run.job_id}}
    </div>
</div>
</a>
{% endif %}
{% endfor %}
</div>
{% if count_statuses_nofail > 0 %}
<div class='row row-bordered'>
    <div class='col-md-12 col-sm-12'>
        <em>
            <span class='badge alert-success'><span ng-bind='count_visible({{count_statuses_fail}})'></span>/{{count_statuses_nofail}}</span>
            test suites with no failures
            <span class='status-fail0-show'>hidden</span>
            <span class='status-fail0' style='display: none'>shown</span>
        </em>
        <a href='#' class='status-fail0-show' onclick="$('.status-fail0, .status-fail0-show').toggle(); return false">Show</a>
        <a href='#' class='status-fail0'      onclick="$('.status-fail0, .status-fail0-show').toggle(); return false" style='display: none'>Hide</a>
    </div>
</div>
{% endif %}
</div> <!-- ng-controller=FilterController -->

<div ng-controller='FilterController' data-param="filter-metrics">
<h2>Metrics</h2>
<div class='row row-bordered'>
    <div class='col-md-12 col-sm-12'>
        <form class='filter'>
            <span class='fa fa-search'></span>
            <input ng-model='filter' name='filter' type='text' placeholder='Filter metrics ...'/>
        </form>
    </div>
</div>
<div class='metrics highlight-row'>
{% for test_run in build.test_runs.all %}
{% for status in test_run.status.all %}
{% if status.suite and status.has_metrics %}
<a href="{% testrun_suite_metrics_url status %}" id="metrics-{{status.id}}" ng-show="match('metrics-{{status.id}}')">
<div class='row row-bordered'>
    <div class='col-md-3 col-sm-3' title='Metrics suite'>
        <i class='fa fa-list'></i>
        <strong>{{status.suite}}</strong>
    </div>

    <div class='col-md-3 col-sm-3' title='Environment'>
        <i class='fa fa-microchip'></i>
        {{test_run.environment}}
    </div>

    <div class='col-md-4 col-sm-4' title='Metrics summary'>
        <i class='fa fa-line-chart'></i>
        {{status.metrics_summary|floatformat:3}}
    </div>

    <div class='col-md-2 col-sm-2' title='Test runs'>
        <i class='fa fa-cog'></i>
        {{test_run.job_id}}
    </div>
</div>
</a>
{% endif %}
{% endfor %}
{% endfor %}
</div>
</div> <!-- ng-content=FilterController -->

<div class='testruns highlight-row'>
    <h2>Test runs</h2>
    {% for test_run in build.test_runs.all %}
        <a href="{% project_url test_run %}">
            <div class='row row-bordered'>
                <div class='col-md-3 col-sm-3' title='Job ID'>
                    <i class='fa fa-list'></i>
                    <strong>{{test_run.job_id}}</strong>
                </div>
                <div class='col-md-3 col-sm-3' title='Environment'>
                    <i class='fa fa-microchip'></i>
                    {{test_run.environment}}
                </div>

                <div class='col-md-4 col-sm-4' title='Date &amp; time'>
                    <i class='fa fa-calendar'></i>
                    {{test_run.datetime}}
                </div>

                <div class='col-md-2 col-sm-2' title='Completed: {{test_run.completed}}'>
                    {% if test_run.completed %}
                        <i class='fa fa-check-square-o'></i>
                    {% else %}
                        <i class='fa fa-square-o'></i>
                    {% endif %}
                    {{test_run.job_status|default:""}}
                </div>
            </div>
        </a>
    {% endfor %}
</div>

</div> <!-- ng-app=Filter -->

{% endblock %}

{% block javascript %}
<script type="text/javascript" src='{% static "squad/filter.js" %}'></script>
{% endblock %}
