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

{% block title %}

{% endblock %}

{% block content %}

{% if player.role == 'Sender' %}
<p>Please choose one of the two options</p>

{% formfield player.decisionSender label=''%}
{% endif %}

{% if player.role == 'Receiver' %}
<p>Remember that the Senders in this experiment...</p>

<p style="margin-left: 40px"> <b>Option A:</b> Sender gets ${{Constants.optionA_Spay}}.00, Receiver gets ${{Constants.optionA_Rpay}}.00.<br>
<b>Option B:</b> Sender gets ${{Constants.optionB_pay}}.00, Receiver gets ${{Constants.optionB_pay}}.00.</p>
<br>

<p>In today's experiment there are {{subsession.number_of_groups}} participants in the role of Senders.</p>

<p><b>How many out of the {{subsession.number_of_groups}} senders do you think selected Option A and wanted to keep ${{Constants.optionA_Spay}}.00 for themselves?</b></p>
{% formfield player.guessReceiver label=''%}

{% endif %}
<br>

    {% next_button %}


<style>
    .otree-timer {
        display: none;
    }
</style>

<script>
    $(function () {
        $('.otree-timer__time-left').on('update.countdown', function (event) {
            if (event.offset.totalSeconds === 10) {
                $('.otree-timer').show();
            }
        });
    });
</script>

{% endblock %}