{% extends "layout.html" %}
{% block content %}
<div class="row text-center">
    <div class="col-md-12">
        <h2>Playbook runs for playbook: <span style="font-style: italic;">"{{ playbook }}"</span></h2>
    </div>
</div>
<br>
{% for run in playbook_data %}
{% set stats = stats_data[run.id] %}
{% set tasks = task_data[run.id] %}
<div class="row" style="display: flex; align-items: center;">
    <div class="col-md-1 text-center">
        <h2>Info</h2>
    </div>
    <div class="col-md-11">
        <table class="table table-striped table-hover table-condensed table-bordered" style="margin: 0 auto !important; float;">
            <thead>
                <tr>
                    <th class="text-center">Playbook</th>
                    <th class="text-center">UUID</th>
                    <th class="text-center">Start</th>
                    <th class="text-center">End</th>
                    <th class="text-center">Duration</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td class="text-center"><a href="/playbook/{{ run.playbook }}">{{ run.playbook }}</a></td>
                    <td class="text-center"><a href="/run/{{ run.id }}">{{ run.id }}</a></td>
                    <td class="text-center">{{ run.start |datetime(format='%Y-%m-%d %H:%M:%S') }}</td>
                    <td class="text-center">{{ run.end |datetime(format='%Y-%m-%d %H:%M:%S') }}</td>
                    <td class="text-center">{{ run.duration |truncate(6) }}s</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
<br>
<div class="row" style="display: flex; align-items: center;">
    <div class="col-md-1 text-center">
        <h2>Stats</h2>
    </div>
    <div class="col-md-11">
        <table class="table table-striped table-hover table-condensed table-bordered" style="margin: 0 auto !important; float;">
            <thead>
                <tr>
                    <th class="text-center">Host</th>
                    <th class="text-center"><a href="/playbook/{{ playbook }}/ok"><label class="label OK">OK</label></a></th>
                    <th class="text-center"><a href="/playbook/{{ playbook }}/changed"><label class="label CHANGED">CHANGED</label></th>
                    <th class="text-center"><a href="/playbook/{{ playbook }}/skipped"><label class="label SKIPPED">SKIPPED</label></th>
                    <th class="text-center"><a href="/playbook/{{ playbook }}/failed"><label class="label FAILED">FAILED</label></th>
                </tr>
            </thead>
            <tbody>
                {% for row in stats %}
                <tr>
                    <td class="text-center">{{ row.host }}</td>
                    <td class="text-center">{{ row.ok }}</td>
                    <td class="text-center">{{ row.changed }}</td>
                    <td class="text-center">{{ row.skipped }}</td>
                    <td class="text-center">{{ row.failures }}</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</div>
<br>
<hr>
<br>
<div class="row" style="display: flex; align-items: center;">
    <div class="col-md-offset-6 col-md-6 text-right">
        <h3>Filter by status</h3>
        <a href="/playbook/{{ playbook }}/ok"><label class="label status-filter OK" style="margin-right: 5px;">OK</label></a>
        <a href="/playbook/{{ playbook }}/changed"><label class="label status-filter CHANGED" style="margin-right: 5px;">CHANGED</label></a>
        <a href="/playbook/{{ playbook }}/skipped"><label class="label status-filter SKIPPED" style="margin-right: 5px;">SKIPPED</label></a>
        <a href="/playbook/{{ playbook }}/failed"><label class="label status-filter FAILED" style="margin-right: 5px;">FAILED</label></a>
        <a href="/playbook/{{ playbook }}/ignored"><label class="label status-filter SKIPPED" >IGNORED</label></a>
        <a href="/playbook/{{ playbook }}"><label class="label status-filter label-default" >ALL</label></a>
    </div>
</div>
<br>
<div class="row">
    <table class="table table-striped table-hover table-condensed table-bordered" style="margin: 0 auto !important; float;">
        <thead>
            <tr>
                <th>Timestamp</th>
                <th class="text-center">Status</th>
                <th>Host</th>
                <th>Play > Task > Module</th>
            </tr>
        </thead>
        <tbody>
            {% for row in tasks %}
            <tr class="task">
                <td id="{{ row.end |datetime }}" style="white-space: nowrap;">
                    <a href="#{{ row.end |datetime }}">{{ row.end |datetime }}</a>
                </td>
                <td class="text-center">
                    <a href="/playbook/{{ playbook }}/{{ row |pick_status |lower }}"><label class="label {{ row |pick_status }}">{{ row |pick_status }}</label></a><br>
                    {% if row.failed and row.ignore_errors %}
                    <a href="/playbook/{{ playbook }}/ignored"><label class="label SKIPPED">IGNORED</label></a><br>
                    {% endif %}
                    {{ row.duration |truncate(5) }}s
                </td>
                <td><a href="/host/{{ row.host }}">{{ row.host }}</a></td>
                <td style="white-space: nowrap;">
                    <ul>
                        {% if row.play %}
                        <li><strong>Play:</strong> <a href="/play/{{ row.play }}">{{ row.play }}</a></li>
                        {% else %}
                        <li><strong>Play:</strong> <span style="font-style: italic">No name provided</span></li>
                        {% endif %}
                        <ul>
                            {% if row.task %}
                            <li><strong>Task:</strong> <a href="/task/{{ row.task }}">{{ row.task }}</a></li>
                            {% else %}
                            <li><strong>Task:</strong> <span style="font-style: italic">No name provided</span></li>
                            {% endif %}
                            <ul>
                                <li><strong>Module:</strong> {{ row.module }}</li>
                            </ul>
                        </ul>
                    </ul>
                </td>
            </tr>
            <tr class="results" style="display: none;">
                <td colspan="4">{{ row.result |to_nice_json }}</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
</div>
{% if not loop.last %}
<br>
<hr style="border: 2px dashed black;">
<br>
{% endif %}
{% endfor %}
{% endblock %}