{% 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;
        }

        .radiobutton input[type="radio"]:disabled{
            -webkit-appearance: none;
            -moz-appearance: none;
            appearance: none;
            border-radius: 50%;
            width: 14px;
            height: 14px;
            border: 1px solid #cccccc;
            margin-right: 8px;
            position: relative;
            top: 4px;
        }

        .radiobutton input[type="radio"]:checked {
          border: 4px solid #8c8c8c;
        }

    </style>

{% endblock %}


{% block content %}

    <h1>Round 5 of 5</h1>


        <div class="card bg-light m-3">
            <div class="card-body">
                <div class="justify">

                    <p id="def" style="color: black; text-align: justify; font-size: 18px; font-weight: bold;"></p>

                </div>
            </div>
        </div>


    <p style="text-align: justify; font-size: 18px;">



        {% if choice27_1 == 300 %}

        <br> On the previous page, you chose between "60 seconds per game with a starting budget of &euro;14"
             and "No time limit per game with a starting budget of &euro;10". We will now ask you to make the
             same choice for different starting budgets. <br>

        <br> You will note that some of the choices have already been filled out for you.
             This is because on the previous page you chose “No time limit per game with
             a starting budget of &euro;10” over “60 seconds per game with a starting budget of &euro;14”.
             We therefore assume that you would still prefer no time limit with a starting budget of &pound;10
             over the shorter time limit if you
             received an even smaller starting budget for the shorter time limit. <br>

        <br> Please make your choice for the remaining starting budgets below. <br>
        {% endif  %}


        {% if choice27_1 == 60 %}

        <br> On the previous page, you chose between "60 seconds per game with a starting budget of &euro;14"
             and "No time limit per game with a starting budget of &euro;10". We will now ask you to make the
             same choice for different starting budgets. <br>

        <br> You will note that some of the choices have already been filled out for you.
             This is because on the previous page you chose "60 seconds per game with a starting
             budget of &euro;14" over "No time limit per game with a starting budget of &euro;10".
             We therefore assume that you would still prefer the shorter time limit if you
             received an even larger starting budget for it. <br>

        <br> Please make your choice for the remaining starting budgets below. <br>

        {% endif  %}
    </p>




<div class="table">

        <table style="width:100%; border:none; font-size: 18px;">
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice23_1" id="230" value="300" onclick="myfunction1()"><label for="230"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice23_1" id="231" value="25" onclick="myfunction2()"><label for="231"> 60 seconds per game with a starting budget  of &euro;10</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice24_1" id="240" value="300" onclick="myfunction3()"><label for="240"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice24_1" id="241" value="25" onclick="myfunction4()"><label for="241"> 60 seconds per game with a starting budget  of &euro;11</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice25_1" id="250" value="300" onclick="myfunction5()"><label for="250"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice25_1" id="251" value="25" onclick="myfunction6()"><label for="251"> 60 seconds per game with a starting budget  of &euro;12</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice26_1" id="260" value="300" onclick="myfunction7()"><label for="260"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice26_1" id="261" value="25" onclick="myfunction8()"><label for="261"> 60 seconds per game with a starting budget  of &euro;13</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice27_1" id="270" value="300" onclick="myfunction9()"><label for="270"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice27_1" id="271" value="25" onclick="myfunction10()"><label for="271"> 60 seconds per game with a starting budget  of &euro;14</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice28_1" id="280" value="300" onclick="myfunction11()"><label for="280"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice28_1" id="281" value="25" onclick="myfunction12()"><label for="281"> 60 seconds per game with a starting budget  of &euro;15</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice29_1" id="290" value="300" onclick="myfunction13()"><label for="290"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice29_1" id="291" value="25" onclick="myfunction14()"><label for="291"> 60 seconds per game with a starting budget  of &euro;16</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice30_1" id="300" value="300" onclick="myfunction15()"><label for="300"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice30_1" id="301" value="25" onclick="myfunction16()"><label for="301"> 60 seconds per game with a starting budget  of &euro;17</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice31_1" id="310" value="300" onclick="myfunction17()"><label for="310"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice31_1" id="311" value="25" onclick="myfunction18()"><label for="311"> 60 seconds per game with a starting budget  of &euro;18</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice32_1" id="320" value="300" onclick="myfunction19()"><label for="320"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice32_1" id="321" value="25" onclick="myfunction20()"><label for="321"> 60 seconds per game with a starting budget  of &euro;19</label></span></td>
            </tr>
            <tr>
                <td><span class="radiobutton"><input type="radio" name="choice33_1" id="330" value="300" onclick="myfunction21()"><label for="330"> No time limit per game with a starting budget of &euro;10</label></span></td>
                <td><span class="radiobutton"><input type="radio" name="choice33_1" id="331" value="25" onclick="myfunction22()"><label for="331"> 60 seconds per game with a starting budget  of &euro;20</label></span></td>
            </tr>
        </table>
    </div>







    <input type="hidden"   name="choice23_1"                id="id_choice23_1"              />
    <input type="hidden"   name="choice24_1"                id="id_choice24_1"              />
    <input type="hidden"   name="choice25_1"                id="id_choice25_1"              />
    <input type="hidden"   name="choice26_1"                id="id_choice26_1"              />
    <input type="hidden"   name="choice27_1"                id="id_choice27_1"              />
    <input type="hidden"   name="choice29_1"                id="id_choice29_1"              />
    <input type="hidden"   name="choice28_1"                id="id_choice28_1"              />
    <input type="hidden"   name="choice30_1"                id="id_choice30_1"              />
    <input type="hidden"   name="choice31_1"                id="id_choice31_1"              />
    <input type="hidden"   name="choice32_1"                id="id_choice32_1"              />
    <input type="hidden"   name="choice33_1"                id="id_choice33_1"              />
    <input type="hidden"   name="multiple_switching3_1"     id="id_multiple_switching3_1"   />

    {{ form.errors }}

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


{% endblock %}


{% block scripts %}
    <script type="text/javascript">
        var choice23_1 = js_vars.choice23_1;
        var choice24_1 = js_vars.choice24_1;
        var choice25_1 = js_vars.choice25_1;
        var choice26_1 = js_vars.choice26_1;
        var choice27_1 = js_vars.choice27_1;
        var choice28_1 = js_vars.choice28_1;
        var choice29_1 = js_vars.choice29_1;
        var choice30_1 = js_vars.choice30_1;
        var choice31_1 = js_vars.choice31_1;
        var choice32_1 = js_vars.choice32_1;
        var choice33_1 = js_vars.choice33_1;

        var multi = 0;



        if (choice27_1==300){
                document.getElementById('230').checked = true;
                document.getElementById('240').checked = true;
                document.getElementById('250').checked = true;
                document.getElementById('260').checked = true;
                document.getElementById('270').checked = true;
                document.getElementById('230').disabled = true;
                document.getElementById('240').disabled = true;
                document.getElementById('250').disabled = true;
                document.getElementById('260').disabled = true;
                document.getElementById('270').disabled = true;
                document.getElementById('231').disabled = true;
                document.getElementById('241').disabled = true;
                document.getElementById('251').disabled = true;
                document.getElementById('261').disabled = true;
                document.getElementById('271').disabled = true;
                document.getElementById('id_choice26_1').value = 300;
                document.getElementById('id_choice25_1').value = 300;
                document.getElementById('id_choice24_1').value = 300;
                document.getElementById('id_choice23_1').value = 300;

            if (choice28_1==300){
                    document.getElementById('280').checked = true;
                    document.getElementById('id_choice28_1').value = 300;
            }

            if (choice28_1==60){
                    document.getElementById('281').checked = true;
                    document.getElementById('id_choice28_1').value = 60;
            }

            if (choice29_1==300){
                    document.getElementById('290').checked = true;
                    document.getElementById('id_choice29_1').value = 300;
            }

            if (choice29_1==60){
                    document.getElementById('291').checked = true;
                    document.getElementById('id_choice29_1').value = 60;
            }

            if (choice30_1==300){
                    document.getElementById('300').checked = true;
                    document.getElementById('id_choice30_1').value = 300;
            }

            if (choice30_1==60){
                    document.getElementById('301').checked = true;
                    document.getElementById('id_choice30_1').value = 60;
            }

            if (choice31_1==300){
                    document.getElementById('310').checked = true;
                    document.getElementById('id_choice31_1').value = 300;
            }

            if (choice31_1==60){
                    document.getElementById('311').checked = true;
                    document.getElementById('id_choice31_1').value = 60;
            }

            if (choice32_1==300){
                    document.getElementById('320').checked = true;
                    document.getElementById('id_choice32_1').value = 300;
            }

            if (choice32_1==60){
                    document.getElementById('321').checked = true;
                    document.getElementById('id_choice32_1').value = 60;
            }

            if (choice33_1==300){
                    document.getElementById('330').checked = true;
                    document.getElementById('id_choice33_1').value = 300;
            }

            if (choice33_1==60){
                    document.getElementById('331').checked = true;
                    document.getElementById('id_choice33_1').value = 60;
            }

            if (document.getElementById('281').checked == true) {
                if (document.getElementById('290').checked == true | document.getElementById('300').checked == true |
                    document.getElementById('310').checked == true | document.getElementById('320').checked == true | document.getElementById('330').checked == true) {
                    document.getElementById('def').innerHTML = "You chose the 60-second time limit option with a starting budget of &euro;15 but did not choose this option with a higher starting budget. Please make sure this is really how you would like to decide before pressing Next.";
                }
            }

            if (document.getElementById('280').checked == true) {
                if (document.getElementById('291').checked == true) {
                    if (document.getElementById('300').checked == true | document.getElementById('310').checked == true | document.getElementById('320').checked == true | document.getElementById('330').checked == true) {
                        document.getElementById('def').innerHTML = "You chose the 60-second time limit option with a starting budget of &euro;16 but did not choose this option with a higher starting budget. Please make sure this is really how you would like to decide before pressing Next.";
                    }
                }
            }

            if (document.getElementById('280').checked == true) {
                if (document.getElementById('290').checked == true) {
                    if (document.getElementById('301').checked == true) {
                        if (document.getElementById('310').checked == true | document.getElementById('320').checked == true | document.getElementById('330').checked == true) {
                            document.getElementById('def').innerHTML = "You chose the 60-second time limit option with a starting budget of &euro;17 but did not choose this option with a higher starting budget. Please make sure this is really how you would like to decide before pressing Next.";
                        }
                    }
                }
            }

            if (document.getElementById('280').checked == true) {
                if (document.getElementById('290').checked == true) {
                    if (document.getElementById('300').checked == true) {
                        if (document.getElementById('311').checked == true) {
                            if (document.getElementById('320').checked == true | document.getElementById('330').checked == true) {
                                document.getElementById('def').innerHTML = "You chose the 60-second time limit option with a starting budget of &euro;18 but did not choose this option with a starting budget of &euro;20. Please make sure this is really how you would like to decide before pressing Next.";
                            }
                        }
                    }
                }
            }

            if (document.getElementById('280').checked == true) {
                if (document.getElementById('290').checked == true) {
                    if (document.getElementById('300').checked == true) {
                        if (document.getElementById('310').checked == true) {
                            if (document.getElementById('321').checked == true){
                                if (document.getElementById('330').checked == true) {
                                    document.getElementById('def').innerHTML = "You chose the 60-second time limit option with a starting budget of &euro;19 but did not choose this option with a starting budget of &euro;20. Please make sure this is really how you would like to decide before pressing Next.";
                                }
                            }
                        }
                    }
                }
            }

        }


        if (choice27_1==60){
                document.getElementById('271').checked = true;
                document.getElementById('281').checked = true;
                document.getElementById('291').checked = true;
                document.getElementById('301').checked = true;
                document.getElementById('311').checked = true;
                document.getElementById('321').checked = true;
                document.getElementById('331').checked = true;
                document.getElementById('271').disabled = true;
                document.getElementById('281').disabled = true;
                document.getElementById('291').disabled = true;
                document.getElementById('301').disabled = true;
                document.getElementById('311').disabled = true;
                document.getElementById('321').disabled = true;
                document.getElementById('331').disabled = true;
                document.getElementById('270').disabled = true;
                document.getElementById('280').disabled = true;
                document.getElementById('290').disabled = true;
                document.getElementById('300').disabled = true;
                document.getElementById('310').disabled = true;
                document.getElementById('320').disabled = true;
                document.getElementById('330').disabled = true;
                document.getElementById('id_choice28_1').value = 60;
                document.getElementById('id_choice29_1').value = 60;
                document.getElementById('id_choice30_1').value = 60;
                document.getElementById('id_choice31_1').value = 60;
                document.getElementById('id_choice32_1').value = 60;
                document.getElementById('id_choice33_1').value = 60;

                if (choice23_1==300){
                    document.getElementById('230').checked = true;
                    document.getElementById('id_choice23_1').value = 300;
                }

                if (choice23_1==60){
                        document.getElementById('231').checked = true;
                        document.getElementById('id_choice23_1').value = 60;
                }

                if (choice24_1==300){
                        document.getElementById('240').checked = true;
                        document.getElementById('id_choice24_1').value = 300;
                }

                if (choice24_1==60){
                        document.getElementById('241').checked = true;
                        document.getElementById('id_choice24_1').value = 60;
                }

                if (choice25_1==300){
                        document.getElementById('250').checked = true;
                        document.getElementById('id_choice25_1').value = 300;
                }

                if (choice25_1==60){
                        document.getElementById('251').checked = true;
                        document.getElementById('id_choice25_1').value = 60;
                }

                if (choice26_1==300){
                        document.getElementById('260').checked = true;
                        document.getElementById('id_choice26_1').value = 300;
                }

                if (choice26_1==60){
                        document.getElementById('261').checked = true;
                        document.getElementById('id_choice26_1').value = 60;
                }


                if (document.getElementById('260').checked == true) {
                      if (document.getElementById('251').checked == true | document.getElementById('241').checked == true | document.getElementById('231').checked == true) {
                          document.getElementById('def').innerHTML = "You did not select the 60-second time limit option with a starting budget of &euro;13 but did select this option with a lower starting budget. Please make sure this is really how you would like to decide before pressing Next.";
                      }
                }

                if (document.getElementById('261').checked == true) {
                      if (document.getElementById('250').checked == true) {
                          if (document.getElementById('241').checked == true | document.getElementById('231').checked == true) {
                              document.getElementById('def').innerHTML = "You did not select the 60-second time limit option with a starting budget of &euro;12 but did select this option with a lower starting budget. Please make sure this is really how you would like to decide before pressing Next.";

                          }
                      }
                }

                if (document.getElementById('261').checked == true) {
                      if (document.getElementById('251').checked == true) {
                          if (document.getElementById('240').checked == true) {
                              if (document.getElementById('231').checked == true) {
                                  document.getElementById('def').innerHTML = "You did not select the 60-second time limit option with a starting budget of &euro;11 but did select this option with a starting budget of &euro;10. Please make sure this is really how you would like to decide before pressing Next.";
                              }
                          }
                      }
                }
        }


        function myFunction() {
              if (choice27_1==300) {

                  if (document.getElementById('281').checked == true) {
                        if (document.getElementById('290').checked == true | document.getElementById('300').checked == true | document.getElementById('310').checked == true |
                            document.getElementById('320').checked == true | document.getElementById('330').checked == true) {
                                multi = 1;
                        }
                  }

                  if (document.getElementById('280').checked == true) {
                        if (document.getElementById('291').checked == true) {
                            if (document.getElementById('300').checked == true | document.getElementById('310').checked == true |
                                document.getElementById('320').checked == true | document.getElementById('330').checked == true) {
                                    multi = 1;
                            }
                        }
                  }

                  if (document.getElementById('280').checked == true) {
                        if (document.getElementById('290').checked == true) {
                            if (document.getElementById('301').checked == true) {
                                if (document.getElementById('310').checked == true | document.getElementById('320').checked == true | document.getElementById('310').checked == true) {
                                    multi = 1;
                                }
                            }
                        }
                  }

                  if (document.getElementById('280').checked == true) {
                        if (document.getElementById('290').checked == true) {
                            if (document.getElementById('300').checked == true) {
                                if (document.getElementById('311').checked == true) {
                                    if (document.getElementById('320').checked == true | document.getElementById('330').checked == true) {
                                        multi = 1;
                                    }
                                }
                            }
                        }
                  }

                  if (document.getElementById('280').checked == true) {
                        if (document.getElementById('290').checked == true) {
                            if (document.getElementById('300').checked == true) {
                                if (document.getElementById('310').checked == true) {
                                    if (document.getElementById('321').checked == true){
                                        if (document.getElementById('330').checked == true) {
                                            multi = 1;
                                        }
                                    }
                                }
                            }
                        }
                  }

                  if (document.getElementById('280').checked == true) {
                    document.getElementById('id_choice28_1').value = 300;
                  }
                  if (document.getElementById('281').checked == true) {
                    document.getElementById('id_choice28_1').value = 60;
                  }

                  if (document.getElementById('290').checked == true) {
                    document.getElementById('id_choice29_1').value = 300;
                  }
                  if (document.getElementById('291').checked == true) {
                    document.getElementById('id_choice29_1').value = 60;
                  }

                  if (document.getElementById('300').checked == true) {
                    document.getElementById('id_choice30_1').value = 300;
                  }
                  if (document.getElementById('301').checked == true) {
                    document.getElementById('id_choice30_1').value = 60;
                  }

                  if (document.getElementById('310').checked == true) {
                    document.getElementById('id_choice31_1').value = 300;
                  }
                  if (document.getElementById('311').checked == true) {
                    document.getElementById('id_choice31_1').value = 60;
                  }

                  if (document.getElementById('320').checked == true) {
                    document.getElementById('id_choice32_1').value = 300;
                  }
                  if (document.getElementById('321').checked == true) {
                    document.getElementById('id_choice32_1').value = 60;
                  }

                  if (document.getElementById('330').checked == true) {
                    document.getElementById('id_choice33_1').value = 300;
                  }
                  if (document.getElementById('331').checked == true) {
                    document.getElementById('id_choice33_1').value = 60;
                  }

              }

              if (choice28_1==60) {
                  if (document.getElementById('260').checked == true) {
                        if (document.getElementById('251').checked == true | document.getElementById('241').checked == true | document.getElementById('231').checked == true) {
                            multi = 1;
                        }
                  }

                  if (document.getElementById('261').checked == true) {
                        if (document.getElementById('250').checked == true) {
                            if (document.getElementById('241').checked == true | document.getElementById('231').checked == true) {
                                multi = 1;
                            }
                        }
                  }

                  if (document.getElementById('261').checked == true) {
                        if (document.getElementById('251').checked == true) {
                            if (document.getElementById('240').checked == true) {
                                if (document.getElementById('231').checked == true) {
                                    multi = 1;
                                }
                            }
                        }
                  }



                  if (document.getElementById('230').checked == true) {
                    document.getElementById('id_choice23_1').value = 300;
                  }
                  if (document.getElementById('231').checked == true) {
                    document.getElementById('id_choice23_1').value = 60;
                  }

                  if (document.getElementById('240').checked == true) {
                    document.getElementById('id_choice24_1').value = 300;
                  }
                  if (document.getElementById('241').checked == true) {
                    document.getElementById('id_choice24_1').value = 60;
                  }

                  if (document.getElementById('250').checked == true) {
                    document.getElementById('id_choice25_1').value = 300;
                  }
                  if (document.getElementById('251').checked == true) {
                    document.getElementById('id_choice25_1').value = 60;
                  }

                  if (document.getElementById('260').checked == true) {
                    document.getElementById('id_choice26_1').value = 300;
                  }
                  if (document.getElementById('261').checked == true) {
                    document.getElementById('id_choice26_1').value = 60;
                  }

              }

        document.getElementById('id_multiple_switching3_1').value = multi;
        document.getElementById('id_choice27_1').value = choice27_1;
        }

        document.getElementById('id_multiple_switching3_1').value = multi;
        document.getElementById('id_choice27_1').value = choice27_1;

    </script>
{% endblock %}