{% extends "otree_tools/BaseToolsAdmin.html" %}
{% load static %}
{% block title %}
    Focused/unfocused time spent per page
    <h4>(<code>{% verbatim %}{%&nbsp;tracking_time&nbsp;%}{% endverbatim %}</code> tag)</h4>
{% endblock %}

{% block content %}

    {% if focusevents %}
        <table class="table table-hover table-striped table-resonsive">
            <thead>
            <th>Session code</th>
            <th>Participant code</th>
            <th>App name</th>
            <th>Round number</th>
            <th>Page name</th>
            <th>Focused time</th>
            <th>Unfocused time</th>
            </thead>
            <tbody>
            {% for s in focusevents %}
                <tr>
                    <td>{{ s.participant__session__code }}</td>
                    <td>{{ s.participant__code }}</td>
                    <td>{{ s.app_name }}</td>
                    <td>{{ s.round_number }}</td>
                    <td>{{ s.page_name }}</td>
                    <td>{{ s.focused_time|default_if_none:0 }}</td>
                    <td>{{ s.unfocused_time|default_if_none:0 }}</td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
        {% include 'otree_tools/includes/pagination_footer.html' %}
    {% else %}
        No information about focus tracking is available. If you want to track time spent per page, insert
        <code>{% verbatim %} {%&nbsp;tracking_time&nbsp;%} {% endverbatim %}</code> to a corresponding template.
    {% endif %}
{% endblock %}


{% block internal_scripts %}
    {{ block.super }}

    <script>
        var tracker_type = 'focus_per_page';
    </script>
    <script src="{% static "otree_tools/js/export.js" %}"></script>
{% endblock %}

