{{ block title }}
Three Tasks
{{ endblock }}
{{ block content }}
<script src='{{ static 'randomSequences.js'}}'></script>
<style>
table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
    text-align: center;
    vertical-align: middle;
}
</style>

<p>
    Your were randomly paired with another participant (Participant 2) in this session.
</p>
<p>
    The computer selects the Yellow Box with a probability of: 20%, 50%, or 90%.
    Each probability is used in a task where you and Participant 2 have to report the strategy for each sample.
    <strong>
        You and Participant 2 will know the probability that the Yellow Box will be selected in each task.
    </strong>
</p>
<p>
  For every possible sample of four marbles,
    one participant will guess the probability the computer selected either the Yellow or the Green box
    to draw that sample.
    You will have to wait until Participant 2 has reported their guesses before continuing to the next task.
</p>

<h3>Initial Probability of Selecting each Box</h3>

<p>
    The computer can select the Yellow Box with one of these probabilities (in %): 20, 50, or 90.
    You can think of this as selecting randomly one box from one of three different cabinets:
</p>

<!-- Cabinet 1 -->
<p>
<table>
<thead>
  <tr>
    <th colspan="3">Cabinet 1</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Boxes</td>
    <td>Probability of selecting a <strong>Yellow</strong> Box</td>
    <td>Probability of selecting a <strong>Green</strong> Box</td>
  </tr>
  <tr>
    <td>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <BR>

        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
    </td>
    <td>20</td>
    <td>80</td>
  </tr>
</tbody>
</table>
</p>

<!-- Cabinet 2 -->
<p>
<table>
<thead>
  <tr>
    <th colspan="3">Cabinet 2</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Boxes</td>
    <td>Probability of selecting a <strong>Yellow</strong> Box</td>
    <td>Probability of selecting a <strong>Green</strong> Box</td>
  </tr>
  <tr>
    <td>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <BR>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
    </td>
    <td>50</td>
    <td>50</td>
  </tr>
</tbody>
</table>
</p>

<!--cabinet 3-->
<p>
<table>
<thead>
  <tr>
    <th colspan="3">Cabinet 3</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Boxes</td>
    <td>Probability of selecting a <strong>Yellow</strong> Box</td>
    <td>Probability of selecting a <strong>Green</strong> Box</td>
  </tr>
  <tr>
    <td>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <BR>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: yellow;
                border-color:black">
        Yellow Box
        </button>
        <button type="button"
            style="width: 60px; height: 60px;
                background-color: green;
                border-color:black">
        Green Box
        </button>
    </td>
    <td>90</td>
    <td>10</td>
  </tr>
</tbody>
</table>
</p>

<h3>Decisions for each Sample</h3>

<p>
    In each task, each participant must report one of two decisions for every sample:
</p>
<ol>
    <li>a guess on the probability the Yellow Box was selected </li>
    <li>a guess on the decision of another participant</li>
</ol>

<p>
    For example, the next table shows how both participants report their decisions for a sample of 1 yellow and 3 green marbles
    (you will set your guess where the <strong>XX</strong> are):
</p>

<p>
<table>
<thead>
  <tr>
    <th>Sample</th>
    <th>Number of <br>yellow marbles</th>
    <th>Number of <br>green marbles</th>
    <th>What is the probability <br>(in %)<br>the Yellow Box was selected<br>? </th>
    <th>What is the probability <br>(in %)<br><strong>Participant 2</strong> reports<br>the Yellow Box was selected?</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>
        <img src='https://upload.wikimedia.org/wikipedia/commons/a/a5/Wikisource_proofread_yellow.svg' width='30' height='30'/>
        <img src='https://upload.wikimedia.org/wikipedia/commons/8/89/Wikisource_proofread_green_circle.svg' width='30' height='30'/>
        <img src='https://upload.wikimedia.org/wikipedia/commons/8/89/Wikisource_proofread_green_circle.svg' width='30' height='30'/>
        <img src='https://upload.wikimedia.org/wikipedia/commons/8/89/Wikisource_proofread_green_circle.svg' width='30' height='30'/>
    </td>
    <td>1</td>
    <td>3</td>
    <td>
        Your Strategy: <br>
        <strong>XX</strong>
    </td>
    <td>
        Expected Strategy for <strong>Participant 2:</strong> <br>
        <strong>XX</strong>
    </td>
  </tr>
</tbody>
</table>
</p>

<p>
    The accuracy of your answers will determine your chances of getting up to $9 bonus.
    So, it is in your best interest to report the probability you think the Yellow Box was selected
    and what you expect Participant 2 would report.
    Consider carefully your strategies for each possible sample.
</p>

<h4>Box and Sample Selected at the End</h4>

<p>
  After you and Participant 2 reported your decisions in each task:
</p>

<ol>
    <li> The computer will randomly select a Yellow or Green box.</li>
    <li> From the box secretly selected,
        the computer will draw a sequence of {{C.N_size}} marbles,
        recording the color and <strong>replacing</strong> the marble in its box after each draw. </li>
    <li> The computer will apply the probabilities you stated before to determine your payoff. </li>
</ol>

<p>
    After you and Participant 2 have reported your decisions, the computer will use them to determine your payment.
    The computer selects a Yellow or Green box with the probability in that task and generates a random sample from the selected Box.
    The strategy reported by one participant will be implemented.
    This participant will be paid accordingly to the Box selected and their decision,
    and the other participant accordingly to how well they predicted that decision.
</p>

<p>
    The payoffs won't be revealed until the end of the experiment.
</p>

<p>
    Click the 'Next' button if the process to select the box is clear,
    or ask the experimenter if you have any questions.
</p>

<p>
    You will have to complete an understanding test in the next page.
</p>

    {{ formfields }}

    {{ next_button }}

<!--</div>-->

{{ endblock }}