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



{% block content %}



<div class="card bg-light instructions">
<div class="card-body">
            {{ paragraph1 | safe }}
</div>
</div>

<br> <br>



<div style="text-align: center;">
    <input type="submit" id="button1" onclick="return submitForm();" class="btn btn-primary btn-large" value="{{confirm}}" style="color: white; font-size: 1.2em; padding: 10px 20px;">
</div>

<br> <br>


<!-- tabswitches & focustime -->


<input type="hidden" id="tab_instructions_general_part1" name="tab_instructions_general_part1" value="0">
<input type="hidden" id="focus_instructions_general_part1" name="focus_instructions_general_part1" value="0">
<input type="hidden" id="totaltime_instructions_general_part1" name="totaltime_instructions_general_part1" value="0">
<script>
    function submitForm() {
        if($tabswitches == 0){
            $time_total = (Date.now() - $start)/1000;
            $time_focus = $time_total;
        }

        document.getElementById("tab_instructions_general_part1").setAttribute('value', $tabswitches);
        document.getElementById("focus_instructions_general_part1").setAttribute('value', $time_focus);
        document.getElementById("totaltime_instructions_general_part1").setAttribute('value', $time_total);


        return true;
    }
</script>



{% endblock %}