{% extends "LtF/Base.html" %}
{% load staticfiles otree %}
{% load i18n %}

{% block title %}
   {% trans "Rank"  %}
{% endblock %}

{% block content %}



{% if player.role == 'CB'%}
   <h3> <strong>{% trans "Congratulation!" %}</strong> </h3>
<p>
The experiment is over
</p>
    {% endif %}

<div class="fullwidth">

    <div id="tabera">
        <table class="table" id="table2" >
            <thead>
                <tr>
                    <th> # </th>
                    <th> {% trans "Output" %}</th>
                    <th> {% trans "Interest" %}</th>
                    <th> {% trans "Inflation" %}</th>
                    <th> {% trans "Expectation" %}</th>
                    <th> {% trans "Score" %}</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    {% for p in player_in_all_rounds %}

                    {% if p.subsession.round_number == now %}
                    <td> {{tomorrow}} </td>
                    <td style="width:90px;">    </td>
                    <td style="width:70px;">    </td>
                    <td style="width:70px;">    </td>
                    <td style="width:100px;"> {{p.guess_pi}}% </td>
                    <td style="width:55px;">  </td>
                    {% endif %}
                    {% endfor %}


            </tr>
                {% for seed in temp_A %}
                {% for p in player_in_all_rounds %}

                {% if p.subsession.round_number == seed %}
                    <tr>
                        <td> {{p.subsession.round_number }}</td>
                        <td> {{p.group.y_an}}%</td>
                        <td> {{p.group.i_an}}% </td>
                        <td> {{p.group.pi_an}}%</td>
                        {% if p.guess_pi_lag == None %}
                        <td>  </td>
                             {% elif p.guess_pi_lag != None %}
                        <td>     {{p.guess_pi_lag}}% </td>
                             {% endif %}

                        {% if p.score == None %}
                        <td>  </td>
                             {% elif p.score != None %}
                        <td>     {{p.score}}  </td>
                             {% endif %}
                    </tr>
                {% endif %}
                {% endfor %}
                {% endfor %}
                                        <td> 0</td>
                <td>  {{Constants.y_init2_an}}%</td>
                <td> {{Constants.i_init2_an}}% </td>
                <td> {{Constants.p_init2_an}}%</td>
                <td></td>
                <td></td>
                    </tr>
                <tr>
                <td> -1</td>
                <td>  {{Constants.y_init1_an}}%</td>
                <td> {{Constants.i_init1_an}}% </td>
                <td> {{Constants.p_init1_an}}%</td>
                <td></td>
                <td></td>
                    </tr>

            <tr>
                <td> -2</td>
                <td>  {{Constants.y_init0_an}}%</td>
                <td> {{Constants.i_init0_an}}% </td>
                <td> {{Constants.p_init0_an}}%</td>
                <td></td>
                <td style="width:50px;"></td>
                    </tr>
            </tbody>
        </table>
    </div>

    <div id="resultgraphs">
    <div style="width:100%;height:100%;overflow-x:auto;overflow-y:hidden;direction:ltr">
    <div style="height:100%;width:150%;direction:ltr" >
    <div id="chart_exp" style=" height: 50%;width:100%;"></div>
    <div  id="chart_fund" style=" height: 50%;width:100%;"></div>
    </div>
        </div>
        </div>


</div>

<div class="periodblock">
<b> {% blocktrans trimmed %} Click next after you have carefully read your new instructions, and answered the questions written at the end of the instructions.{% endblocktrans %}</b>
</div>
   

</div>

<div class="nextblock">
{% next_button %}
</div>



	




    {%block script%}
        <script>
                    // Change the selector if needed
var $table = $('table.table'),
    $bodyCells = $table.find('tbody tr:eq(1)').children(),
    colWidth;

// Adjust the width of thead cells when window resizes
$(window).resize(function() {
    // Get the tbody columns width array
    colWidth = $bodyCells.map(function() {
        return $(this).width();
    }).get();

    // Set the width of thead columns
    $table.find('thead tr').children().each(function(i, v) {
        $(v).width(colWidth[i]);
    });
}).resize(); // Trigger resize handler

            {% include "LtF/FinalResults.js" %}
            {% include "LtF/Exp.js" %}
        </script>
    {%endblock%}

{% endblock %}