{% extends "global/Page.html" %}
{% load staticfiles otree_tags %}

{% load staticfiles %}

{% block title %}
    Results	
	
{% endblock %}



 

{% block content %}

	
<table style="width:100%; border: 1px solid black;">
<tr>
  <th colspan=2></th>
  <th colspan = "9" style="border: 1px solid black"> Minimum choice in group </th>
</tr>

<tr>
  <th colspan=2></th>
  {% for lvl in Constants.difficulty_levels %}
    {% if forloop.counter == player.min_group %}
      <td align = "center" style="background-color: #ff8888"><b>{{lvl}}</b></th>
    {% else %}
      <td align = "center"><b>{{lvl}}</b></th>
    {% endif %}
  {% endfor %}
</tr>


{% for row in Constants.payoffmatrix %}
  {% if forloop.counter == player.problem_difficulty %}
  <tr  align = "center" style = "background-color: #ffffbc">
  {% else %}
  <tr  align = "center">
  {% endif %}
    {% if forloop.first %}
      <th rowspan = "8" style = "background-color: #ffffff"> Own choice </th>
    {% endif %}
    <th> {{forloop.counter}} </th>
  {% for item in row %}
  
    {% if forloop.counter == player.min_group %}
      {% if forloop.parentloop.counter == player.problem_difficulty %}
        <td style="background-color: #ffbb7f "> {{item}} </td>
      {% else %}
        <td style="background-color: #ff8888 "> {{item}} </td>
      {% endif %}
      
    {% else %}
      <td> {{item}} </td>
    {% endif %}
    
  {% endfor %}
  </tr>
{% endfor %}

</table>


{% if is_control %}

	<p></p>
	<p>Your level of effort shown in yellow was: {{player.problem_difficulty}}</p>
	<p>The minimum effort of the group shown in red was: {{player.min_group}}</p>
	<p>As shown in the payoff matrix above, you earned: {{player.payoff}}</p>

{% endif %}

<p style="padding-top: 50px"></p>


{% if not is_control %}

    <table style="width:100%; border: 1px solid black;">
      <tr>
      <th style="border: 1px solid black"> Level of effort </th>
      <th style="border: 1px solid black"> Payoff </th>
      </tr>   
      
	  
      
        {%if player.problem_difficulty == player.min_group%}
          <tr style="background-color: #ff8888">
          <td style="border: 1px solid black; background-color: #FFBB7F">{{player.problem_difficulty}} effort units</td>
          <td style="border: 1px solid black; background-color: #FFBB7F">{{player.payoff}}</td>
          </tr>
        {% else %}
          <tr style="background-color: #ffffbc">
          <td style="border: 1px solid black; background-color: #FFFFBC">{{player.problem_difficulty}} effort units</td>
          <td style="border: 1px solid black; background-color: #FFFFBC">{{player.payoff}}</td>
          </tr>
        {% endif %}
      

		{% for a in agents %}
	  
	  
		{% if a.get_last_choice == player.min_group %}


		  <tr style="background-color: #ff7f7f">
		  <td style="border: 1px solid black; background-color: #ff8888">{{a.get_last_choice}} effort units</td>
		  <td style="border: 1px solid black; background-color: #ff8888">{{a.get_last_payoff}} points</td>
		  </tr>
		{% else %}

		  <tr>
		  <td style="border: 1px solid black">{{a.get_last_choice}} effort units</td>
		  <td style="border: 1px solid black">{{a.get_last_payoff}} points</td>
		  </tr>
		{% endif %}

	{% endfor %}
    </table>
	<br>
    {% if player.problem_difficulty == player.min_group %}
      <p> You chose the minimum effort, so you are highlighted in orange.  Other players who chose the minimum effort are in red </p>
      <p></p>
    {% else %}
      <p> You are highlighted in yellow, and the minimum effort is highlighted in red </p>
    {% endif %}

{% endif %}


You have earned {{cum_payoff}} so far, out of a maximum possible {{possible_payoff}} points.  
<br>

<br>
<div id="next">
    {% next_button %}
</div>

<div style="display: none">
    {% formfield player.timeonpage_Results %}
</div>

<script>
start=new Date().getTime()
timebox=document.getElementById("id_timeonpage_Results")

function getPageTime(){
    pagetime=(new Date().getTime() - start)/1000
    return pagetime;
}

function compute_page_vals(){
    timebox.value=getPageTime()
}

document.getElementById("next").addEventListener("click", compute_page_vals);
</script>

{% endblock %}