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

{% block head_title %}

        Study

{% endblock %}

{% block styles %}

    <style type="text/css">
        h1 {text-align: center; font-size: 35px;}

        .otree-timer {
            display: none;
        }
    </style>

{% endblock %}

{% block content %}

<h1>Result</h1>

<script>

        $(function deductiontimer() {
                var seconds, minutes;
                $('.otree-timer__time-left').on('update.countdown', function (event) {
                    seconds = event.offset.totalSeconds%60;
                    minutes = Math.floor(event.offset.totalSeconds/60);
                    seconds = seconds;
                    document.querySelector('#deductiontimer').textContent =  seconds;
                });
            })

        </script>

<div class="card bg-light m-3">
    <div class="card-body">
        <div class="justify">
            <p style="font-size:18px; text-align:center;">

                {% if subsession.round_number <= 10 %}

                        {% if time_spent < my_page_timeout_seconds %}

                            {% if player.correct == 1 %}

                                You chose the <span style="font-weight:bold;">correct answer</span>  for Game {{game_number}}. <br>

                                {% if question_chosen == 34 %}
                                    <br> You have solved {{number_correct|floatformat:0}} question(s) so far. <br>
                                {% endif  %}

                                {% if question_chosen < 34 %}
                                    <br> Your remaining payoff is <span style="font-weight:bold;">&pound;{{payoff1|floatformat:2}}</span>. <br>
                                {% endif  %}

                            {% else %}

                                You chose the <span style="font-weight:bold;">wrong answer</span>  for Game {{game_number}}. <br>

                                {% if question_chosen == 34 %}
                                    <br> You have solved {{number_correct|floatformat:0}} question(s) so far. <br>
                                {% endif  %}

                                {% if question_chosen < 34 %}
                                    <br> Your remaining payoff is <span style="font-weight:bold;">&pound;{{payoff1|floatformat:2}}</span>. <br>
                                {% endif  %}

                            {% endif %}
                        {% endif %}

                        {% if time_spent == my_page_timeout_seconds %}

                            {% if player.correct == 1 %}

                                You chose the <span style="font-weight:bold;">correct answer</span>  for Game {{game_number}}. <br>

                                {% if question_chosen == 34 %}
                                    <br> You have solved {{number_correct|floatformat:0}} question(s) so far. <br>
                                {% endif  %}


                                {% if question_chosen < 34 %}
                                    <br> Your remaining payoff is <span style="font-weight:bold;">&pound;{{payoff1|floatformat:2}}</span>. <br>
                                {% endif  %}

                            {% else %}

                                You chose the <span style="font-weight:bold;">wrong answer</span>  for Game {{game_number}} or you were <span style="font-weight: bold;">too slow</span>. <br>

                                {% if question_chosen == 34 %}
                                    <br> You have solved {{number_correct|floatformat:0}} question(s) so far. <br>
                                {% endif  %}


                                {% if question_chosen < 34 %}
                                    <br> Your remaining payoff is <span style="font-weight:bold;">&pound;{{payoff1|floatformat:2}}</span>. <br>
                                {% endif %}
                            {% endif %}
                        {% endif %}

                {% endif  %}

                {% if subsession.round_number == 10 %}

                        {% if question_chosen == 34 %}
                            <br> You have solved {{number_correct|floatformat:0}} question(s) in this round. <br>
                        {% endif  %}

                        {% if question_chosen < 34 %}
                            <br>  Your payoff for this round is <span style="font-weight:bold;"> &pound;{{payoff1|floatformat:2}}</span>. <br>
                        {% endif  %}
                {% endif  %}



            </p>

        </div>
    </div>
</div>



    <div>
        <p style="font-size:15px; color: black;  margin-Left:35px; text-align:right;"> Seconds left on this page: <span id="deductiontimer"  style="color:black;
        text-align:right; font-size: 15px; font-weight: bold;"> </span>  </p>
    </div>




    <input type="hidden"   name="payoff1"               id="id_payoff1"                />
    <input type="hidden"   name="time_spent"           id="id_time_spent"              />




{{ form.errors }}


{% endblock %}



{% block scripts %}
    <script type="text/javascript">
        var payoff1 = js_vars.payoff1;
        var time_spent = js_vars.time_spent;




        document.getElementById('id_payoff1').value = payoff1;
        document.getElementById('id_time_spent').value = time_spent;




    </script>
{% endblock %}