{% extends "global/Page.html" %}
{% load static %}

{% block styles %}
<style>
    .table{
        table-layout:fixed;
        border-collapse:collapse;
        margin-bottom:60px;
    }
    .table th,
    .table td{ border:none }
</style>
{% endblock %}

{% block content %}

<div class="panel-heading">
    <h5>
        <p>Before you start with the task, we would like you to answer a couple of questions.</p>
        <p>Please indicate the extent to which you agree or disagree with the following statements:</p>
    </h5>
</div>

{# ---------- helper macro not allowed, so repeat three blocks --------- #}

<table class="table">
    <tr>
        <th colspan="7">
            {% if treatment == "FreeTool" %}The offer of a free tool
            {% elif treatment == "ComplimentaryTool" %}The offer of a complimentary tool
            {% elif treatment == "Tool" %}The offer of a tool
            {% elif treatment == "AlternativeVersion" %}The offer of an alternative version of the task
            {% endif %}
            I was presented with was suspicious.
        </th>
    </tr>
    <tr>
        <td colspan="2" style="text-align:left;">Strongly disagree</td>
        <td colspan="3" style="text-align:center;">Neither agree nor disagree</td>
        <td colspan="2" style="text-align:right;">Strongly agree</td>
    </tr>
    <tr>
        {% for choice in form.fair_3 %}
        <td style="text-align:center; padding:3px 6px 1px 6px;">{{ choice.label }}</td>
        {% endfor %}
    </tr>
    <tr>
        {% for choice in form.fair_3 %}
        <td style="text-align:center; padding:0 6px;">{{ choice|safe }}</td>
        {% endfor %}
    </tr>
</table>

<table class="table">
    <tr>
        <th colspan="7">
            {% if treatment == "FreeTool" %}The offer of a free tool
            {% elif treatment == "ComplimentaryTool" %}The offer of a complimentary tool
            {% elif treatment == "Tool" %}The offer of a tool
            {% elif treatment == "AlternativeVersion" %}The offer of an alternative version of the task
            {% endif %}
            I was presented with was questionable.
        </th>
    </tr>
    <tr>
        <td colspan="2" style="text-align:left;">Strongly disagree</td>
        <td colspan="3" style="text-align:center;">Neither agree nor disagree</td>
        <td colspan="2" style="text-align:right;">Strongly agree</td>
    </tr>
    <tr>
        {% for choice in form.fair_1 %}
        <td style="text-align:center; padding:3px 6px 1px 6px;">{{ choice.label }}</td>
        {% endfor %}
    </tr>
    <tr>
        {% for choice in form.fair_1 %}
        <td style="text-align:center; padding:0 6px;">{{ choice|safe }}</td>
        {% endfor %}
    </tr>
</table>

<table class="table">
    <tr>
        <th colspan="7">
            {% if treatment == "FreeTool" %}The offer of a free tool
            {% elif treatment == "ComplimentaryTool" %}The offer of a complimentary tool
            {% elif treatment == "Tool" %}The offer of a tool
            {% elif treatment == "AlternativeVersion" %}The offer of an alternative version of the task
            {% endif %}
            I was presented with was honest.
        </th>
    </tr>
    <tr>
        <td colspan="2" style="text-align:left;">Strongly disagree</td>
        <td colspan="3" style="text-align:center;">Neither agree nor disagree</td>
        <td colspan="2" style="text-align:right;">Strongly agree</td>
    </tr>
    <tr>
        {% for choice in form.fair_2 %}
        <td style="text-align:center; padding:3px 6px 1px 6px;">{{ choice.label }}</td>
        {% endfor %}
    </tr>
    <tr>
        {% for choice in form.fair_2 %}
        <td style="text-align:center; padding:0 6px;">{{ choice|safe }}</td>
        {% endfor %}
    </tr>
</table>



{% next_button %}
{% endblock %}