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


{% block title %}
    Thank you for participating! <hr>
{% endblock %}

{% block content %}

You will be paid a fixed reward of {{ fee }}. <br><br>

{% if not participant.vars.failed_comprehension %}

<h4>Bonus</h4>
{% if participant.vars.failed_comprehension_dots or participant.vars.failed_answer %}
<p>For completing section 1 and section 3 of this study you receive a fixed bonus of {{ partial_fixed_bonus }}.</p>
{% else %}
<p>For completing this study you receive a fixed bonus of {{ fixed_bonus }}.</p>
{% endif %}
{%  if participant.vars.guess_correct %}
<p>Since you made an almost correct guess of the true number of dots, you receive an additional bonus of {{ correct_bonus }}.</p>
{% endif %}

{% if participant.vars.lucky == 0 %}
You are selected to get an additional bonus from the lottery.
The row selected for your payment are:
<br>
<br>
Given the 50/50 lottery over {{ min }} and {{ max }}:
<br>
<div id="lottery_div1" style="text-align: center; width: 100%;">
    <table class="table table-bordered">
        <colgroup>
          <col width="40%">
          <col width="15%">
          <col width="40%">
        </colgroup>
        <tr>
            <td align="center"><b>Option A</b></td>
            <td></td>
            <td align="middle"><b>Option B</b></td>
        </tr>
        <tr>
            <td style="vertical-align: top; text-align: center" rowspan="1">
                {% if select_pay == "wta" %}
                <b>Keep</b> your lottery
                {% else %}
                <b>Keep</b> your money
                {% endif %}
            </td>
            <td align="middle" style="text-align: center;">
                <input id = "left" type="radio" name="amount1" value="left" disabled>&nbsp;&nbsp; &nbsp;&nbsp; &nbsp;&nbsp;
                <input id = "right" type="radio" name="amount1" value="right" data-amount="2" disabled>
            </td>
            <td align="middle" style="text-align: center;">
                {% if select_pay == "wta" %}
                <b>Sell</b> the lottery for <b>{{ rhs }}</b>
                {% else %}
                <b>Buy</b> the lottery for <b>{{ rhs }}</b>
                {% endif %}
            </td>
        </tr>
    </table>
</div>
<p>Your additional bonus from the lottery is {{ lottery_pay }}</p>
{% endif %}

<br>
<h4>Total Payment</h4>
<p>In total, you receive a payment of <b>{{ total_payment }}</b>.</p>

{% endif %}
<p> Thank you for your participation. <b><u>Your completion code is 4F6BC9E8</u></b>. Click “Next” to submit the study to Prolific.</p> <br>

<br><br>
<div style="text-align: right;">
    {% next_button %}
</div>
{% endblock %}

{% block scripts %}
<script>
    let left = js_vars.left;
    if (left == 1){
        document.getElementById("left").checked = true;
    }
    else{
        document.getElementById("right").checked = true;
    }
</script>

{% endblock %}