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

{% block title %}
    Revealed Average
{% endblock %}

{% block content %}

  {% if player.row_problem != None %}
  <p class="solution">
    Solution to the problem from row {{problem_no}} is {{one_row}}.
  </p>
  {% endif %}
  {% if player.col_problem != None %}
  <p class="solution">
    Solution to the problem from column {{problem_no}} is {{one_col}}.
  </p>
  {% endif %}

  <p> {% formfield player.solution %}
  <button class="btn btn-success">Submit</button> </p>

  <p>
    You have revealed {{player.reveal_avg_total}} avearges. You can reveal upto
    {{Constants.avg_reveal}} averages, including both row and column averages.
  </p>
{% endblock %}

{% block styles %}
    <style>
        .otree-timer {
            display: none;
        }
        p.solution{
          font-size: 150%;
          color: RoyalBlue;
        }
    </style>
{% endblock %}

{% block scripts %}
<script>
$(function () {
    $('.otree-timer__time-left').on('update.countdown', function (event) {
        if (event.offset.totalSeconds === 5) {
            $('.otree-timer').show();
        }
    });
});
</script>
{% endblock %}