{{ block title }}
    Commitment Stage
{{ endblock }}
{{ block content }}

<div class="card bg-light m-3">
    <div class="card-body">
        <p>
            {{ if player.switch }}
            <p>
                You just switched to another door in the second stage.
            </p>
            <p>
                Do you want to commit to the strategy "Switch"?
            </p> 
            {{ else }}
            <p>
                You just stayed with your first-stage choice.
            </p>
            <p>
                Do you want to commit to the strategy "Stay"?
            </p> 
            {{ endif }}
        </p>
        
        <div id="voting" style="width:100%;height:200px; float:left; border:3px double; padding: 5px; margin:10px 0px">
            <p>
                <span style="color:red">Warning:</span><br>
                By choosing Yes,<br>
                {{ if player.switch }}
                    you get an additional 1 game point for each following rounds, but you must <span style="color:red">switch your answer</span> after you click "Reveal a goat".
                {{ else }}
                    you get an additional 1 game point for each following rounds, but you must <span style="color:red">stay with your first-stage choice</span> after you click "Reveal a goat".
                {{ endif }}
                
            </p>
            
            <div>
                <!-- set checked="checked" so No is default -->
                <input class="form-check-input" type="radio" id="No" name="commit" style="font-size: 20px">
                <label style="font-size: 18px;">No</label>
            </div>
            <div>
                <input class="form-check-input" type="radio" id="Yes" name="commit" style="font-size: 20px">
                <label style="font-size: 18px;">Yes</label>
            </div>
            {{ formfield_errors 'commit' }}
        </div>
        
    </div>
</div>
    

    <br>
    {{ next_button }}

    <style>
        p{
            font-size: 18px;
        }
    </style>

    <script>
        document.getElementById('No').value = -1;
        if (js_vars.switch) {
            document.getElementById('Yes').value = 1;
        } else {
            document.getElementById('Yes').value = 2;
        }
        
    </script>

{{ endblock }}