{{ block title }}
{{ if player.participant.id_in_session < 319 }}
    Applicant 5: {{name}}
{{ endif }}
{{ if player.participant.id_in_session > 318 }}
    Applicant 5
{{ endif }}
<br>
<span style="font-size:50%;">This page is same for every applicant; only the information in <b><span style="color:blue;">bold blue font</span></b> will change.</span>
{{ endblock }}
{{ block content }}



<p>
<b><span style="font-size:110%;">Cognitive Skill Test</span></b>
    <ul>
    <li><b><span style="color:blue;">{{name}}</span></b> took a multiple choice math test and a short answer math test.</li>
    <li><b><span style="color:blue;">{{name}}</span></b>'s score for the <b>multiple choice</b> math questions is
        <b><span style="font-size:110%; color:blue;">{{multi}}</span></b>. </li>
    <li>What is your guess for their score for <b>short answer</b> math questions (out of 20)?</li>
    <label for="cog">&nbsp;My guess for the score is </label>
    <input name= 'cog_5' type="text" id="cog" size="8"/>
                {{ formfield_errors 'cog_5' }}
    </ul>
</p>

<p>
   <b><span style="font-size:110%;">Social Skill Test</span></b>
   <ul>
    <li><b><span style="color:blue;">{{name}}</span></b> played 4 kinds of games with another player.
        Each game was played first without communicating, then again with communication.</li>
    <li> You can see the details of each game by clicking a button (For example, "Test 1 First Game Details"). </li>
    <li> <b>The details of each game are the same for all applicants.</b></li>
    <li> Since your payoff depends on the accuracy of your guess, <b>you should know the details of the games to maximize your payoff; </b>
     if you forget anything about the games, please click the button to see the details.</li>
    <li> For each game (decision making problem), the applicant is randomly paired with a partner (undergraduate student).</li>
    </ul>
<ol>
   <li>Test 1</li>
    <ul>
        <li> <b>Test 1 First Game</b> </li>
        <ul>
            <input type="button" onclick="ShowAndHide1()" value="Test 1 First Game Details"/>
            <div id="test1" style="display:none">
            <li>The applicant played the following game twice: once without communication, and once with communication. </li>
             <li>When <b>communication</b> is allowed, there was <b>a 1/4 chance</b> the applicant got <b>an additional 0.5 points</b> by luck.</li>
            <li>Here is the payoff table:</li>
                <img src="{{ static 'bos1eval.png' }}" width="300"/>
            <li>The applicant played as the <b>row player</b>.</li>
            <li>The row player chooses a row and the column player simultaneously chooses a column.</li>
            <li>In each cell, the first number is the row player's payoff and the second number is the column player's payoff.</li>
            <li>For example, if both players choose Football, then the row player gets 15 pts and the column player gets 10 pts.</li>
            </div>

            <li>
                {{ if BoSid == 1 }}
                    When <b>communication</b> was allowed, <b><span style="color:blue;">{{name}}</span></b>'s payoff was <b><span style="font-size:115%; color:blue;">higher</span></b>
                    than without communication. This could be because their choices changed, or due to luck.
                {{ endif }}
                {{ if BoSid == -1 }}
                    When <b>communication</b> was allowed, <b><span style="color:blue;">{{name}}</span></b>'s payoff was <b><span style="font-size:115%; color:blue;">lower</span></b>
                    than without communication.
                {{ endif }}
                {{ if BoSid == 0 }}
                    <b><span style="color:blue;">{{name}}</span></b> earned <b><span style="font-size:115%; color:blue;">the same</span></b> with communication as they did without communication.
                {{ endif }}
                </li>
        </ul>


        <br>
        <li><b>Test 1 Second Game</b></li>
        <ul>
            <input type="button" onclick="ShowAndHide1_a()" value="Test 1 Second Game Details"/>
            <div id="test1_a" style="display:none">
            <li>The applicant played the following game twice as the row player: once without communication, and once with communication. </li>
            <li>In <b>both cases</b> there was <b>no</b> chance that the applicant got additional points by luck .</li>
            <img src="{{ static 'bos2eval.png' }}" width="300"/>
            </div>
            <li>When <b><span style="color:blue;">{{name}}</span></b> played the following game <b>without communication</b>,
            <b><span style="color:blue;">{{name}}</span></b>'s payoff was  <b><span style="font-size:110%; color:blue;">{{BoSno}}</span></b>.</li>
        </ul>
        <br>
        <label for="g1">Compared to without communication, I think the payoff in the second game</label>
        <select name="game1_5" id="g1">
            <option value="" >--Please choose an option--</option>
            <option value="1">was higher when communication is allowed.</option>
            <option value="2">was lower when communication is allowed.</option>
            <option value="3">stayed the same when communication is allowed.</option>
        </select>
            {{ formfield_errors 'game1_5' }}
        <label for="g1a">I think the payoff amount was changed by</label> (if you think it stayed the same, please put 0 here)
        <input name= 'game1amount_5' type="text" id="g1a" size="8"/>
            {{ formfield_errors 'game1amount_5' }}
    </li>
        </ul>
    <br>
    <li>Test 2</li>
        <ul>
        <li> <b>Test 2 First Game</b> </li>
        <ul>
             <input type="button" onclick="ShowAndHide2()" value="Test 2 First Game Details"/>
            <div id="test2" style="display:none">
            <li>The applicant played the following game twice as the row player: once without communication, and once with communication. </li>
            <li>When <b>communication</b> is allowed, there was <b>a 1/4 chance</b> the applicant got <b>an additional 0.5 points</b> by luck.</li>
             <img src="{{ static 'pd1eval.png' }}" width="300"/>
            </div>
        <li>{{ if PDid == 1 }}
            When <b>communication</b> was allowed, <b><span style="color:blue;">{{name}}</span></b>'s payoff was <b><span style="font-size:115%; color:blue;">higher</span></b>
            than without communication. This could be because their choices changed, or due to luck.
            {{ endif }}
            {{ if PDid == -1 }}
            When <b>communication</b> was allowed, <b><span style="color:blue;">{{name}}</span></b>'s payoff was <b><span style="font-size:115%; color:blue;">lower</span></b>
            than without communication.
            {{ endif }}
            {{ if PDid == 0 }}
            <b><span style="color:blue;">{{name}}</span></b> earned <b><span style="font-size:115%; color:blue;">the same</span></b>
            with communication as they did without communication.
            {{ endif }}</li>
             </ul>

        <br>
        <li><b>Test 2 Second Game</b></li>
            <ul>
            <input type="button" onclick="ShowAndHide2_a()" value="Test 2 Second Game Details"/>
            <div id="test2_a" style="display:none">
            <li>The applicant played the following game twice as the row player: once without communication, and once with communication. </li>
            <li>In <b>both cases</b> there was <b>no</b> chance that the applicant got additional points by luck .</li>
                    <img src="{{ static 'pd2eval.png' }}" width="300"/>
            </div>
            <li>When <b><span style="color:blue;">{{name}}</span></b> played the following game <b>without communication</b>,
            <b><span style="color:blue;">{{name}}</span></b>'s payoff was <b><span style="font-size:110%; color:blue;">{{PDno}}</span></b>.</li>
            </ul>
            <br>
            <label for="g2">Compared to without communication, I think the payoff in the second game</label>
            <select name="game2_5" id="g2">
            <option value="" >--Please choose an option--</option>
            <option value="1">was higher when communication is allowed.</option>
            <option value="2">was lower when communication is allowed.</option>
            <option value="3">stayed the same when communication is allowed.</option>
            </select>
            {{ formfield_errors 'game2_5' }}
            <label for="g2a">I think the payoff amount was changed by</label> (if you think it stayed the same, please put 0 here)
            <input name= 'game2amount_5' type="text" id="g2a" size="8"/>
            {{ formfield_errors 'game2amount_5' }}

    </ul>
    </ul>
    <li>Test 3</li>
     <ul>
        <li> <b>Test 3 First Game</b> </li>
        <ul>
            <input type="button" onclick="ShowAndHide3()" value="Test 3 First Game Details"/>
        <div id="test3" style="display:none">
        <li> The applicant had to decide how to divide <b>40 pts</b> between themselves and their partner.</li>
        <li> Then their partner decided whether to accept the offer (the divided amount).</li>
        <li> If the applicant chose to keep X pts and the partner accepted, they got X and their partner got 40-X.</li>
        <li>If the partner rejected, they both got 0.</li>
        <li>The applicant played this game twice: once without communication, and once with communication. </li>
        <li>When <b>communication</b> is allowed, there was <b>a 1/4 chance</b> the applicant got <b>an additional 0.5 points</b> by luck.</li>
        </div>

        <li>{{ if Ultid == 1 }}
            When <b>communication</b> was allowed, <b><span style="color:blue;">{{name}}</span></b>'s payoff was
            <b><span style="font-size:115%; color:blue;">higher</span></b>
            than without communication. This could be because their choices changed, or due to luck.
        {{ endif }}
            {{ if Ultid == -1 }}
            When <b>communication</b> was allowed, <b><span style="color:blue;">{{name}}</span></b>'s payoff was
            <b><span style="font-size:115%; color:blue;">lower</span></b> than without communication.
        {{ endif }}
        {{ if Ultid == 0 }}
            <b><span style="color:blue;">{{name}}</span></b> earned <b><span style="font-size:115%; color:blue;">the same</span></b>
            with communication as they did without communication.
        {{ endif }}
        </li>
        </ul>
         <br>

         <li> <b>Test 3 Second Game</b> </li>
        <ul>
            <input type="button" onclick="ShowAndHide3_a()" value="Test 3 Second Game Details"/>
         <div id="test3_a" style="display:none">
         <li>In the next game, the applicant had to decide how to divide <b>30 pts</b> instead of 40.</li>
         <li>The applicant played this game twice: once without communication, and once with communication. </li>
         <li>In <b>both cases</b> there was <b>no</b> chance that the applicant got additional points by luck .</li>
         </div>

        <li>When <b><span style="color:blue;">{{name}}</span></b> played the game <b>without communication</b>, <b><span style="color:blue;">{{name}}</span></b>’s payoff was <b><span style="font-size:110%; color:blue;">{{Ultno}}</span></b>.</li>

       </ul>
         <label for="g3">Compared to without communication, I think the payoff in the second game</label>
        <select name="game3_5" id="g3">
            <option value="" >--Please choose an option--</option>
            <option value="1">was higher when communication is allowed.</option>
            <option value="2">was lower when communication is allowed.</option>
            <option value="3">stayed the same when communication is allowed.</option>
        </select>
            {{ formfield_errors 'game3_5' }}
        <label for="g3a">I think the payoff amount was changed by</label> (if you think it stayed the same, please put 0 here)
        <input name= 'game3amount_5' type="text" id="g3a" size="8"/>
            {{ formfield_errors 'game3amount_5' }}
        </ul>
        <br>


    <li>Test 4</li>
    <ul>
        <li> <b>Test 4 First Game</b> </li>
        <ul>
        <input type="button" onclick="ShowAndHide4()" value="Test 4 First Game Details"/>
        <div id="test4" style="display:none">
        <li>The applicant played the following game twice: once without communication, and once with communication. </li>
        <li>Both players started with 10 pts. Both had to decide how many points to put into a pot.</li>
        <li>If the pot contained <b>at least 10 pts total</b>, then each earned <i><b>19 - their contribution</b></i>.</li>
        <li>If the pot contained <b>fewer</b> than 10 pts, then each earned <i><b>10 - their contribution</b></i>.</li>
        <li>When <b>communication</b> is allowed, there was <b>a 1/4 chance</b> the applicant got <b>an additional 0.5 points</b> by luck.</li>
        </div>

        <li>
        {{ if Pubid == 1 }}
            When <b>communication</b> was allowed, <b><span style="color:blue;">{{name}}</span></b>'s payoff was
            <b><span style="font-size:115%; color:blue;">higher</span></b> than without communication.
            This could be because their choices changed, or due to luck.
        {{ endif }}
        {{ if Pubid == -1 }}
            When <b>communication</b> was allowed, <b><span style="color:blue;">{{name}}</span></b>'s payoff was
            <b><span style="font-size:115%; color:blue;">lower</span></b> than without communication.
        {{ endif }}
        {{ if Pubid == 0 }}
            <b><span style="color:blue;">{{name}}</span></b> earned <b><span style="font-size:115%; color:blue;">the same</span></b>
            with communication as they did without communication.
        {{ endif }}</li>
            </ul>
            <br>

            <li> <b>Test 4 Second Game</b> </li>
        <ul>

            <input type="button" onclick="ShowAndHide4_a()" value="Test 4 Second Game Details"/>
            <div id="test4_a" style="display:none">
            <li>Then the applicant played another version of this game twice: once without communication, and once with communication. </li>
            <li>In <b>both cases</b> there was <b>no</b> chance that the applicant got additional points by luck .</li>
            <li>In this game, If the pot contained at least <b>12 pts</b>, then each earned <i><b>23 - their contribution</b></i>.</li>
            <li>Otherwise, their payoff was <i><b>12 - their contribution</b></i>.</li>
            </div>

            <li>When <b><span style="color:blue;">{{name}}</span></b> played the game <b>without communication</b>, <b><span style="color:blue;">{{name}}</span></b>’s payoff was <b><span style="font-size:110%; color:blue;">{{Pubno}}</span></b>.</li>
        </ul>
        <label for="g4">Compared to without communication, I think the payoff in the second game</label>
        <select name="game4_5" id="g4">
            <option value="" >--Please choose an option--</option>
            <option value="1">was higher when communication is allowed.</option>
            <option value="2">was lower when communication is allowed.</option>
            <option value="3">stayed the same when communication is allowed.</option>
        </select>
            {{ formfield_errors 'game4_5' }}
            <label for="g4a">I think the payoff amount was changed by</label> (if you think it stayed the same, please put 0 here)
            <input name= 'game4amount_5' type="text" id="g4a" size="8"/>
            {{ formfield_errors 'game4amount_5' }}
        </ul>
    </ul>

</ol>

</p>


<p>


<b><span style="font-size:110%;">Combined (Cognitive Skill + Social Skill) Test</span></b>
    <ul>
    <li> The Combined Test required both cognitive skills and social skills.</li>
    <input type="button" onclick="ShowAndHide5()" value="Combined Test Details"/>
        <div id="test5" style="display:none">
        <ul>
        <li>The math game is called Twenty-Four. Four numbers are given, and one point is earned if they fill out operators correctly to make 24.<br>
            For example, if " 9, 3, 2, 1" are given, they can get to 24 by filling out operators, "9*3-2-1=24."</li>
    <li>They had 5 minutes to solve up to 20 questions, and could pass on any question if needed.</li>
    <li>For each correctly solved problem, a group earns one point (Problem-Solving Score).</li>
        <li>After 5 minutes, the leader decided how to divide the group score (Problem-Solving Score) between the two of them.</li>
    <ul>
        <li>The <b>applicant</b> from the resume played as a <b>leader</b>.</li>
        <li>The team member solved the problems.</li>
        <li>While the team member solved a problem, the leader could not see the numbers they were given.</li>
        <li>However, the leader could send a message to the member to improve the performance and the member could react to that by sending "Thumbs Up" or "Thumbs Down."</li>
        <ul>
            <li>For example, they could ask the team member to pass on the question if it took too long.</li>
            <li>Or, they could incentivize the member by promising to pay them more for performance.</li>
        </ul>
        <li>After the member solved each question, the leader graded whether the member was correct (Grading Score).</li>
        <ul>
            <li>If the member was correct and the leader correctly graded that the member was correct, the leader got an additional 1 point for themselves.</li>
            <li>If the member was wrong and the leader correctly graded that the member was wrong, the leader got additional 0.5 points for themselves.</li>
        </ul>
        </ul>
    </ul>
        </div>
    <li>Using the <b><span style="color:blue;">{{name}}</span></b>'s cognitive skill test and social skill test results,
    please infer the score for the Combined Test. </li>
                {{ formfield_errors 'combG_5' }}


    <label for="comb1">&nbsp;I think the Problem-Solving score was (from 0 to 20) </label>
    <input name= 'combG_5' type="text" id="comb1" size="6"/>

    <label for="comb2">&nbsp;I think the Grading score was (from 0 to 20) </label>
    <input name= 'combI_5' type="text" id="comb2" size="6"/>
                {{ formfield_errors 'combI_5' }}

    </ul>



</p>
    {{ next_button }}

<!--<p>Click the "Try it" button to toggle between hiding and showing the DIV element:</p>-->



<!--<p> The element will not take up any space when the display property set to "none".</p>-->

<script>
function ShowAndHide1() {
    var x = document.getElementById('test1');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>

<script>
function ShowAndHide2() {
    var x = document.getElementById('test2');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>

<script>
function ShowAndHide3() {
    var x = document.getElementById('test3');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>

<script>
function ShowAndHide4() {
    var x = document.getElementById('test4');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>

<script>
function ShowAndHide5() {
    var x = document.getElementById('test5');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>

<script>
function ShowAndHide1_a() {
    var x = document.getElementById('test1_a');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>



<script>
function ShowAndHide2_a() {
    var x = document.getElementById('test2_a');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>

<script>
function ShowAndHide3_a() {
    var x = document.getElementById('test3_a');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>

<script>
function ShowAndHide4_a() {
    var x = document.getElementById('test4_a');
    if (x.style.display == 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
}
</script>


{{ endblock }}