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


{% block title %}
Summary of the Game
{% endblock %}

{% block content %}
<block style="font-size:110%;">
<p>
Below is a summary of the game:
<ol>
    <li>You are choosing a diagnostic accuracy level to diagnose the problem for your client;</li>
    <li>The cost of diagnosis is increasing with the level of diagnostic accuracy;</li>
    <li>{% if player.expert_altruism == 1 %}You will earn <u>100 tokens</u> if the client's problem is solved{% else %}You will earn <u>no extra tokens</u> from solving the client's problem{% endif %}; </li>
    <li>Your diagnostic accuracy is {% if player.treatment == 1 %}NOT{% endif %} observable to your client;</li>
    <li>PASSIVE client will always follow your diagnosis and recommendation;</li>
    <li>ACTIVE clients will make the final decision about which solution to implement, based on their self-diagnosis and your diagnosis and recommendation;</li>
    <li>Your income in a round = <u>80 tokens</u> {% if player.expert_altruism == 1%}+ <u>100 token only when problem is solved</u> {% endif %} – <u>cost of diagnosis</u></li>
</ol>

</p>
<div id="hidden-container">
        <input type="hidden" name="qual_check" id="qual_check" value="1" />
    </div>

    <p>
        Once you are clear about the information above, please click "Next" to start playing the game!
    </p>
    {% next_button %}


{% endblock %}



{% block scripts %}
    <script>
    var time_thres = 3000;

    $(document).ready(function(){
        var start_time = new Date().getTime();
        $(".otree-btn-next").click(function() {
            var end_time = new Date().getTime();
            var diff = end_time - start_time;
            if (end_time - start_time < time_thres) {
                $("#qual_check").val(0);
            }
        });
    });
    </script>
{% endblock %}