{% extends "global/Page.html" %}
{% load otree %}
{% block content %}
{% include "joint_inference/_styles.html" %}

<h2>Results</h2>
<p>Below is a summary of all your trials.</p>

<h3>Per-trial results</h3>
<table style="border-collapse: collapse; margin: 16px 0; font-size: 0.9em;">
<thead>
<tr style="background:#eee;">
<th style="padding:6px 10px; border:1px solid #ccc;">Trial</th>
<th style="padding:6px 10px; border:1px solid #ccc;">Sample size</th>
<th style="padding:6px 10px; border:1px solid #ccc;">True red</th>
<th style="padding:6px 10px; border:1px solid #ccc;">Your draw</th>
<th style="padding:6px 10px; border:1px solid #ccc;">Report A / B</th>
<th style="padding:6px 10px; border:1px solid #ccc;">Partner</th>
<th style="padding:6px 10px; border:1px solid #ccc;">Q1</th>
<th style="padding:6px 10px; border:1px solid #ccc;">Q3</th>
<th style="padding:6px 10px; border:1px solid #ccc;">Paid Q</th>
<th style="padding:6px 10px; border:1px solid #ccc;">Points</th>
</tr>
</thead>
<tbody>
{% for t in trials %}
<tr {% if t.is_practice %}style="color:#888;"{% endif %}>
<td style="padding:6px 10px; border:1px solid #ccc;">{{ t.round_number }}{% if t.is_practice %} (practice){% endif %}</td>
<td style="padding:6px 10px; border:1px solid #ccc;">{{ t.n_i }}</td>
<td style="padding:6px 10px; border:1px solid #ccc;">{{ t.true_red }}</td>
<td style="padding:6px 10px; border:1px solid #ccc;">{{ t.k_i }}/{{ t.n_i }}</td>
<td style="padding:6px 10px; border:1px solid #ccc;">{{ t.k_a }} / {{ t.k_b }}</td>
<td style="padding:6px 10px; border:1px solid #ccc;">{% if t.a_is_partner %}A{% else %}B{% endif %}</td>
<td style="padding:6px 10px; border:1px solid #ccc;">{{ t.q1 }}</td>
<td style="padding:6px 10px; border:1px solid #ccc;">{{ t.q3 }}</td>
<td style="padding:6px 10px; border:1px solid #ccc;">{{ t.paid_q }}</td>
<td style="padding:6px 10px; border:1px solid #ccc;"><b>{{ t.pay }}</b></td>
</tr>
{% endfor %}
</tbody>
</table>

<h3 style="margin-top:24px;">Total</h3>
<p style="font-size:1.2em;">Total points: <b>{{ total_payoff }}</b></p>

{{ next_button }}
{% endblock %}