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

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

{% block content %}
    <br><br>
    <p>
        Round {{ subsession.round_number }}
        <br><br>
        Accident happens or not in this round: {{ player.accident_happen }}
        <br><br>
        Your loss in this round: {{ player.loss_level }}
        <br><br>
        Your premium in this round: {{ player.premium }}
        <br><br>
        Your deductible in this round: {{ player.deductible }}
        <br><br>
        Your remaining assets in this round: {{ player.payoffs }}
        <br><br>
        Your payoffs in this round: ${{ player.earnings }}
        <br><br>
    </p>
    {% next_button %}
    <br>
    <p>
        <button id="btn_reminder" class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collpaseExample"
            aria-expanded="false" aria-controls="collapseExample">
        Tips (show/hide)
        </button>
    </p>
        <div class="collapse" id="collapseExample">
            <div class="card card-body">
        Your car values ECU25,000.
        Once an accident occurs, it can cause slight loss (ECU500), half loss (ECU12,500), or total loss (ECU18,750)
        with equal probability, i.e. each of the losses could happen at 1/3 (33.33%).
        <p style="color:#8b000c">
        property value = Value of your car in the end of this round - Premium - Loss/Deductible (which is lower)<br>
        <p style="color:#030303">Note that for slight loss and half loss, you can get full reimbursement except for the deductible. While for total loss, you can only
        have 75% of your car value, i.e. 18,750, except for the deductible.<br>
        Your payoff rate is ECU1,000 = $1

            </div>
        </div>
{% endblock %}

{% block script %}
    <script>
        $('#btn_reminder').click(function() {
            $('#collapseExample').toggle();
           // $(this).html( $(this).html() == 'Show instructions' ? 'Hide instructions' : 'Show instructions' );
        });
    </script>
{% endblock %}