{% block styles %}
<link href="{% static 'sliders.css' %}" rel="stylesheet" />
{% endblock %}

{{ block title }}
Your Choice
{{ endblock }}

{{ block content }}

<p>You are player A. You have {{ C.ENDOWMENT_AGENT }}.</p>

{{ if group.minimum_amount == "Yes" }}
<p>Player B chose to set a minimum amount of {{ player.control }}. Each slider counts 5 points, therefore at least one
    slider has to be moved to the middle. Please move the sliders to state your choice. You have one trial per slider to
    put the dot in the middle.</p>
{{ endif }}

{{ if group.minimum_amount == "No" }}
<p>Player B chose not to set a minimum amount of {{ player.control }}. Each slider counts 5 points. Please move the
    sliders
    to state your choice. You have one trial per slider to put the dot in the middle.</p>
{{ endif }}

<div class="d-flex flex-column align-items-center">
    <canvas id="canvas" class="m-2"></canvas>
</div>
<br>

{{ if group.minimum_amount == "No"}}
<button class="otree-btn-next btn btn-primary" id="next_button">Next</button>
{{ endif }}

{{ if group.minimum_amount == "Yes"}}
<button class="otree-btn-next btn btn-primary" id="next_button" disabled>Next</button>
{{ endif }}



{{ endblock }}

{{ block scripts }}
<script src="{{ static 'sliders.js' }}"></script>
{{ endblock }}