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

{% block head_title %}

        Study

{% endblock %}

{% block styles %}

    <style type="text/css">
        h1 {text-align: center; font-size: 35px;}
    </style>

{% endblock %}

{% block content %}

<h1>End of Study</h1>

<p style="font-size:18px; text-align: justify">

    <br> Thank you for participating in the study. <br>

    <br> Your results for each round were the following:

     <table class="table">
        <tr style="text-align: center">
            <th>      Round                                </th>
            <th>      Final Earnings (&euro;)                   </th>

        </tr>

        <tr style="text-align: center">
                <td>                 1                                                                  </td>
                <td>        {{ payoff_round1|floatformat:2 }}                                            </td>

        </tr>

        <tr style="text-align: center">
                <td>                 2                                                                  </td>
                <td>        {{ payoff_round2|floatformat:2 }}                                          </td>

        </tr>

        <tr style="text-align: center">
                <td>                 3                                                                  </td>
                <td>        {{ payoff_round3|floatformat:2 }}                                            </td>

        </tr>

        <tr style="text-align: center">
                <td>                 4                                                                  </td>
                <td>        {{ payoff_round4|floatformat:2 }}                                          </td>

        </tr>



        <tr style="text-align: center">
                <td>                 5                                                                  </td>
                <td>        {{ payoff_round5|floatformat:2 }}                                            </td>

        </tr>

     </table>


    <p style="font-size:18px; text-align: justify">

    <br> The computer randomly selected round {{ paying_round }} for payment. <br>

    <br> Your final earnings for this round are &euro;{{ payoff_final|floatformat:2 }}.<br>

    <br> Your additional payoff from the previous survey is &euro;{{lottery_payoff|floatformat:2}}. <br>

    <br> Including your participation fee of &euro;4.00, your total earnings for the study are &euro;{{final_final_payoff|floatformat:2}}. <br>

    <br> Your payment will be transferred to your bank account within 5 working days. <br>

    <br> Please press "Next" to end the study. <br>

    <center> <br> <br> {% next_button %}</center>


</p>


<input type="hidden"   name="paying_round"                     id="id_paying_round"                 >
<input type="hidden"   name="payoff_final"                     id="id_payoff_final"                 >
<input type="hidden"   name="final_final_payoff"               id="id_final_final_payoff"           >


{{ form.errors }}


{% endblock %}



{% block scripts %}
    <script type="text/javascript">

        var final_final_payoff = js_vars.final_final_payoff;


        document.getElementById('id_final_final_payoff').value = final_final_payoff;


        $('#id_paying_round').val(js_vars.paying_round);

        $('#id_payoff_final').val(js_vars.payoff_final);


    </script>
{% endblock %}