{% extends "global/Base.html" %}
{% load staticfiles otree_tags %}
{% load staticfiles %}

{% block title %}
    Survey on Speech Perception: Recording {{ player.round_number }} of {{ Constants.num_rounds }}
{% endblock %}

{% block content %}

    <div id="aPlayer">
        <center>
            <audio controls="controls" preload="auto" id="audio" controlsList="nodownload">
                <source src={{ audio }} type="audio/mpeg">
                Your browser does not support the audio tag.
            </audio>
        </center>

    </div>

    <p><strong> 1. Please provide your impression of the voice recording in the matrix below: </strong></p>
        <center>
        <table class="table table-hover">

        {% for adj_left, adj_right, name, value in list %}
            <tr><td width="10%" align="right">{{ adj_left }}</td>
            {% for v in value %}
            <td width="3%" align="center">
                <input type="radio" name="{{ name }}" value={{ v }}>
            </td>
            {% endfor %}
            <td width="10%" align="left">{{ adj_right }}</td></tr>

        {% endfor %}


        </table>
        </center>


    <p><strong> 2. Assuming that this is a lawyer arguing a case in front of a panel of judges. How likely do you think this
    lawyer will win the case? </strong></p>
        <table class="table table-hover">

            <tr><td width="10%" align="right">{{ adj_list_left_2 }}</td>

            {% for v in value_2 %}
            <td width="3%" align="center">
                <input type="radio" name="{{ name_2 }}" value={{ v }}>
            </td>
            {% endfor %}

            <td width="10%" align="left">{{ adj_list_right_2 }}</td></tr>


        </table>

    <p><strong> 3. How good is the quality of the recording? </strong></p>
        <table class="table table-hover">


            <tr><td width="10%" align="right">{{ adj_list_left_3 }}</td>

            {% for v in value_3 %}
            <td width="3%" align="center">
                <input type="radio" name="{{ name_3 }}" value={{ v }}>
            </td>
            {% endfor %}

            <td width="10%" align="left">{{ adj_list_right_3 }}</td></tr>


        </table>

    {{ form.errors }}
<div align="right" style="margin: 5em 5em">

    {% next_button %}
</div>

{% endblock %}