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

{% block title %}
    Part 1: Game {{ player.match }}, Round {{ player.round_in_match }} – Make Your Choice!
{% endblock %}

{% block styles %}
    <link rel="stylesheet" type="text/css" href="{% static 'global/matrix.css' %}" />

    <style>
        td {
            border: 1px solid black;
            border-collapse: collapse;
            padding: 15px;
            font-size:16px;
        }

        th {
            padding: 15px;
            text-align:center;
            font-weight:normal;
        }

        table.center {
            margin-left: auto;
            margin-right: auto;
        }

        .strat{
            width:200px;
	        height:150px; word-wrap:break-word;
        }

        .orange{
	        color:orange;
        }

        .purple{
	        color:purple;
        }
    </style>

{% endblock %}

{% block content %}

    <div>
        <h4>Your Rule</h4>
        <p style="color:blue;font-size:20px">
            {% if AD_assigned %}
                <b>Always choose A</b>
            {% elif TFT_assigned %}
                <b>In round 1 choose B. After round 1: choose whatever your counterpart chose last round</b>
            {% else %}
                <b>In rounds 1, 2 and 3 choose B. After round 3: choose A if your counterpart chose A in all of the previous 3 rounds; otherwise choose B</b>
            {% endif %}
        </p>
    </div>
<hr>
    <div>
        <h4>Your Choice in this Round (Round {{ player.round_in_match }})</h4>
        {% formfields %}
        <input type="submit" value="Submit">
    </div>

{% if show_history %}
    <div style="overflow-y:auto;">
        <h5 style="text-align:center">Round History</h5>
        <table class="table table-bordered text-center" style="border:1px solid black;border-collapse:collapse;width: auto; margin: auto">
            <tr>
                <th>Round</th>
                <th> <span class="orange">Counterpart Choice</span> </th>
                <th> <span class="purple">Your Choice</span> </th>
            </tr>
            {% for p in player_in_previous_rounds_reverse %}
                <tr>
                    <td>{{ p.round_in_match }}</td>
                    <td><span class="orange">{{ p.counterpartdecision }}</span></td>
                    {% if p.checkaction %}
                        <td><span class="purple">{{ p.decision }}</span></td>
                    {% else %}
                        <td style="background-color:rgba(255, 0, 0, 0.1)"><span class="purple">{{ p.decision }}</span></td>
                    {% endif %}
                </tr>
            {% endfor %}
        </table>
    </div>
{% endif %}


{% endblock %}