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

{% block styles %}
    <link href="{% static 'global/empty.css' %}" rel="stylesheet">
{% endblock %}

{% block title %}
    Part 2 - First payment opportunity
{% endblock %}

{% block content %}


<style>
    .otree-timer {
        display: none;
    }
    p.time {
      background-color: white;
      color: grey;
      text-align: right;
    }
</style>

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

    <p class="time">
        Time: {{ time }} seconds. 
    </p>

    <div class="wrapper instructions"> 
        <p>
            <b>Your number is {{ player.p_value }}</b>
        </p>
    
        <p>
            If the average of your number, and the numbers of 
            {% if player.r_aux_g2 >= 0.5  %}
            your fellow team members
            {% else %}
            the other two participants
            {% endif %}
            is
            {% if player.r_aux_g1 == 1 %} larger than 54, 
            {% elif player.r_aux_g1 == 2 %} smaller than 46, 
            {% else %} an even number (a multiple of 2), 
            {% endif %} 
                {% if player.r_aux_g2 >= 0.5  %}
                you and your fellow team members will each get a payment of $2.00.
                {% else %}
                you will get a payment of $2.00.
                {% endif %}
        </p>
    
        <p>
            Please click "Next" to continue. 
        </p>
    </div>     

    {% next_button %}

{% endblock %}