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

{% block title %}
    Time Allocation
{% endblock %}

{% block content %}
<br>
The bonus rate is: {{ group.bonus}}
<br>
Please select your amount of time devoted to Activity A:
<br>
<br>
{% formfield player.effort label="" %}
<br>

As a reminder, your payoff is determined by your choice of time on Activity A and your group's time spent on Activity A as shown below:
<br>
<br>

<table class="table" width = "1000">
    <tr>
        <th>Your time spent on Activity A</th>
        <th> </th>
        <th colspan="5">Minimum time spent on Activity A by all other group members</th>
    </tr>
    <tr>
        <th> </th> <td> </td> <th>0</th><th>10</th><th>20</th><th>30</th><th>40</th>
    </tr>
    <tr>
        <th>0</th> <td> </td> <td>200</td> <td>200</td> <td>200</td> <td>200</td> <td>200</td>
    </tr>
    <tr>
        <th>10</th> <td> </td>  <td>150</td> <td>230</td> <td>230</td> <td>230</td> <td>230</td>
    </tr>
    <tr>
        <th>20</th> <td> </td> <td>100</td> <td>180</td> <td>260</td> <td>260</td> <td>260</td>
    </tr>
    <tr>
        <th>30</th> <td> </td>  <td>50</td> <td>130</td> <td>210</td> <td>290</td> <td>290</td>
    </tr>
    <tr>
        <th>40</th> <td> </td>  <td>0</td> <td>80</td> <td>160</td> <td>240</td> <td>320</td>
    </tr>
</table>
<br>
<br>
<br>
<br>
{% chat %}
<br>
<br>

    {% next_button %}
{% endblock %}



{% block scripts %}

    <script>
        document.querySelector('.otree-chat__input').style.visibility="hidden";
        document.querySelector('.otree-chat__btn-send').style.visibility="hidden";
    </script>

{% endblock %}