{{ block title }}Your last Decision{{ endblock }}
{{ block content }}

    <p>    Recently, another person (also, "Participant 1"), same as you, have decided to share: </p>

        {{ if player.shared <= 25 }}
            <div style="font-size: 60px;">
             <strong>100, and keep 0 for herself</strong>
            </div>
        {{ elif player.shared > 25 && player.shared <= 50 }}
            <div style="font-size: 60px;">
             <strong>75, and keep 25 for herself</strong>
            </div>
        {{ elif player.shared > 50 && player.shared <= 75 }}
            <div style="font-size: 60px;">
             <strong>25, and keep 75 for herself</strong>
            </div>
        {{ else }}
            <div style="font-size: 60px;">
             <strong>0, and keep 100 for herself</strong>
            </div>
        {{ endif }}

    <p>
        You are still <strong>Participant 1</strong>.
        Please decide how much of the {{ C.ENDOWMENT }}
        you will share with <strong>Participant 2</strong>.
    </p>
    <p>
        Remember: You have shared {{ player.shared }} in the previous round.
    </p>


<!-- Slider -->
<p>(Move the slider to decide how much to give.)</p>

<div style="display: flex">
<input type="range" name="shared2" min="0" max="{{ C.ENDOWMENT }}" style="flex: 0.5" oninput="updateDescription(this)">
<p id="description"></p>
</div>
<!-- by leaving the description blank initially, we prompt the user to move the slider,
reducing the anchoring/default effect. -->

<script>
    let description = document.getElementById('description');
    function updateDescription(input) {
        let give2 = parseInt(input.value);
        let keep2 = js_vars.endowment - give2;
        description.innerText = ` Give ${give2} points and keep ${keep2} for yourself.`
    }
</script>


<!-- Pop-up: reconfirmar decision -->
<button type="button" class="btn btn-primary" onclick="checkSubmit()">Next</button>

    <script>
        function checkSubmit() {
            let form = document.getElementById('form');
            let isValid = form.reportValidity();
            if (!isValid) return;

            let warnings = [];

            let shared2 = document.getElementsByName('shared2')[0].value;
            if (shared2 >= '0') {
                warnings.push("Are you sure to share that amount?");
            }

            if (warnings.length > 0) {
                warnings.push("Press OK to proceed anyway.")
                let confirmed = window.confirm(warnings.join('\r\n'));
                if (!confirmed) return;
            }

            form.submit();
        }
    </script>

    {{ include C.INSTRUCTIONS_TEMPLATE }}

{{ endblock }}