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

{% block head_title %}
    Study
{% endblock %}

{% block styles %}

    <style type="text/css">
        h1 {text-align: center; font-size: 35px;}
        td {
          border: none !important;
        }
        .radiobutton input[type="radio"]{
            margin-right:8px;
        }
    </style>

{% endblock %}


{% block content %}

    <h1>Round 5 of 5</h1>

    <p style="text-align: justify; font-size: 18px;">
        <br> For each of the following decisions, please indicate how you would like to be paid.<br>
    </p>




<div class="table">

        <table style="width:100%; border:none; font-size: 18px;">
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice1" id="10" value="60" onclick="myfunction1()"><label for="10"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice1" id="11" value="15" onclick="myfunction2()"><label for="11"> 15 seconds per game with a starting budget  of £10</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice2" id="20" value="60" onclick="myfunction3()"><label for="20"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice2" id="21" value="15" onclick="myfunction4()"><label for="21"> 15 seconds per game with a starting budget  of £11</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice3" id="30" value="60" onclick="myfunction5()"><label for="30"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice3" id="31" value="15" onclick="myfunction6()"><label for="31"> 15 seconds per game with a starting budget  of £12</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice4" id="40" value="60" onclick="myfunction7()"><label for="40"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice4" id="41" value="15" onclick="myfunction8()"><label for="41"> 15 seconds per game with a starting budget  of £13</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice5" id="50" value="60" onclick="myfunction9()"><label for="50"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice5" id="51" value="15" onclick="myfunction10()"><label for="51"> 15 seconds per game with a starting budget  of £14</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice6" id="60" value="60" onclick="myfunction11()"><label for="60"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice6" id="61" value="15" onclick="myfunction12()"><label for="61"> 15 seconds per game with a starting budget  of £15</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice7" id="70" value="60" onclick="myfunction13()"><label for="70"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice7" id="71" value="15" onclick="myfunction14()"><label for="71"> 15 seconds per game with a starting budget  of £16</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice8" id="80" value="60" onclick="myfunction15()"><label for="80"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice8" id="81" value="15" onclick="myfunction16()"><label for="81"> 15 seconds per game with a starting budget  of £17</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice9" id="90" value="60" onclick="myfunction17()"><label for="90"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice9" id="91" value="15" onclick="myfunction18()"><label for="91"> 15 seconds per game with a starting budget  of £18</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice10" id="100" value="60" onclick="myfunction19()"><label for="100"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice10" id="101" value="15" onclick="myfunction20()"><label for="101"> 15 seconds per game with a starting budget  of £19</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice11" id="110" value="60" onclick="myfunction21()"><label for="110"> 60 seconds per game with a starting budget  of £10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice11" id="111" value="15" onclick="myfunction22()"><label for="111"> 15 seconds per game with a starting budget  of £20</label></span></td>
            </tr>
        </table>
    </div>



    <p id="abc" style="color: black; text-align: center;"></p>


    <center><button class="otree-btn-next btn btn-primary" onclick="myFunction()">Next</button></center>






{% endblock %}




{% block scripts %}
    <script type="text/javascript">
        function myFunction() {
              if (!$("input[name='choice1']:checked").val()) {
                   document.getElementById('abc').innerHTML = "Please select one of the options!";
                   event.preventDefault();
              }
        }

        function myfunction1(){
            document.getElementById('10').checked = true;
            document.getElementById('21').checked = true;
            document.getElementById('31').checked = true;
            document.getElementById('41').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction2(){
            document.getElementById('11').checked = true;
            document.getElementById('21').checked = true;
            document.getElementById('31').checked = true;
            document.getElementById('41').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction3(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('31').checked = true;
            document.getElementById('41').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction4(){
            document.getElementById('10').checked = true;
            document.getElementById('21').checked = true;
            document.getElementById('31').checked = true;
            document.getElementById('41').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction5(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('41').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction6(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('31').checked = true;
            document.getElementById('41').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction7(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction8(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('41').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction9(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction10(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('51').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction11(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction12(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('61').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction13(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction14(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('71').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction15(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('80').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction16(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('81').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction17(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('80').checked = true;
            document.getElementById('90').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction18(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('80').checked = true;
            document.getElementById('91').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction19(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('80').checked = true;
            document.getElementById('90').checked = true;
            document.getElementById('100').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction20(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('80').checked = true;
            document.getElementById('90').checked = true;
            document.getElementById('101').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction21(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('80').checked = true;
            document.getElementById('90').checked = true;
            document.getElementById('100').checked = true;
            document.getElementById('110').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }


        function myfunction22(){
            document.getElementById('10').checked = true;
            document.getElementById('20').checked = true;
            document.getElementById('30').checked = true;
            document.getElementById('40').checked = true;
            document.getElementById('50').checked = true;
            document.getElementById('60').checked = true;
            document.getElementById('70').checked = true;
            document.getElementById('80').checked = true;
            document.getElementById('90').checked = true;
            document.getElementById('100').checked = true;
            document.getElementById('111').checked = true;
            //document.getElementById('abc').innerHTML = "Good job!" ;
        }




    </script>
{% endblock %}