{% extends "layout.html" %}
{% block nav %}
    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
        <div class="container-fluid">
            <a class="navbar-brand" href="#">Feature HTML Test Report</a>

            <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
              <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
                <li class="nav-item active">
                  <a class="nav-link" href="index.html" title="go to index report">Index</a>
                </li>
                <li class="align-middle">
                  <div style="padding: 8px">Started {{ feature['started_at'] }} for {{ feature['duration'] }}s</div>
                </li>
              </ul>
            </div>
        </div>
    </nav>
{% endblock %}
{% block content %}
    <table class="table table-hover">
        <tr class="remove-table-hover"><span style="display: inline; color: mediumturquoise">{{ feature['tags'] }}</span><br/></tr>
        <tr class="remove-table-hover">
            <span style="display: inline; color: maroon">Feature: </span><span style="display: inline; color: grey" title="{{ escape(feature['name']) }}">{{ escape(feature['name']) }}</span>
            <br/>
            <span>Status: </span>
            {% if feature['status'] == 'passed' %}
                <span style="display: inline; color: green">{{ feature['status'] }}</span>
            {% elif (feature['status'] == 'failed') or (feature['status'] == 'errored') %}
                <span style="display: inline; color: red">{{ feature['status'] }}</span>
            {% elif feature['status'] == 'skipped' %}
                <span style="display: inline; color: blue">{{ feature['status'] }}</span>
            {% elif feature['status'] == 'untested' %}
                <span style="display: inline; color: gray">{{ feature['status'] }}</span>
            {% endif %}
        </tr>
    </table>
    <table class="table table-hover datatable">
        <thead>
            <tr class="align-text-top">
                <th class="text-center">Offset</th>
                <th>Scenario</th>
                <th class="text-center">Steps</th>
                <th class="text-center">Status</th>
                <th class="text-center">Duration (s)</th>
            </tr>
        </thead>
        {% for scenario in scenarios %}
            <!--- ignore Backgrounds for the time being -->
            {% if scenario['keyword'] != 'Background' %}
            <tr>
                <td class="text-center">
                {% if scenario['time_offset'] %}
                    {{ scenario['time_offset'].strftime("%H:%M:%S") }}
                {% endif %}
                </td>
                <td>
                    <a href="{{ urlencode(escape(feature['folder_name'])) }}/{{ urlencode(escape(scenario['folder_name'])) }}/index.html"><span style="display: inline; color: grey">{{ escape(scenario['name']) }}</span></a><br/>
                    <span style="display: inline; color: darkslateblue">{{ scenario['tags'] }}</span>
                </td>
                <td class="text-center">{{ scenario['total_steps'] }}</td>
                <td class="text-center"><span class="status-{{ scenario['status'] }}">{{ scenario['status'] }}</span></td>
                <td class="text-center">{{ scenario['duration'] }}</td>
            </tr>
            {%  endif %}
        {% endfor %}
    </table>

    <script>
    setupReportTables([[1, 'asc']], [{type: 'timestamp', searchable: false}, {type: 'string'}, {type: 'num', searchable: false}, {type: 'html'} , {type: 'timestamp', searchable: false} ])
    </script>
{% endblock %}