{{ block title }}Initial questionnaire{{ endblock }}

{{ block global_styles  }}

    <link rel="stylesheet" href="{{ static 'global/style_sheet.css' }}">

{{ endblock }}


{{ block content }}

<script>
    // When players click on table cell radio button gets selected
            $(document).on("click","td",function(){
                $(this).find("input:radio").prop("checked", true);
            })
;
</script>


<br>
<p>
    <b>Please fill in the following fields truthfully:</b>
</p>
<p>
    {{ formfield "age" }}
    {{ if form.age.errors }}
    {{ form.age.errors }}
    {{ endif }}
</p>
<p>
<br>
    {{ formfield "sex" }}
    {{ if form.sex.errors }}
    {{ form.sex.errors }}
    {{ endif }}
</p>
<p>
<br>
    {{ formfield "germborn" }}
    {{ if form.germborn.errors }}
    {{ form.germborn.errors }}
    {{ endif }}
</p>
<p>
<br>
    {{ formfield "income" }}
    {{ if form.income.errors }}
    {{ form.income.errors }}
    {{ endif }}
</p>
<p>
<br>
    {{ formfield "education" }}
    {{ if form.education.errors }}
    {{ form.education.errors }}
    {{ endif }}
</p>



<br>
    <label for="feet"><b>Your body height (Feet and inches):</b></label>
            <div class="input-group">
                <input type="number" class="form-control" id="feet" name="height_feet" placeholder="Feet" required style="margin-right: 10px;">
                <span style="margin-top: 5px;">feet</span>
                <input type="number" class="form-control" id="inches" name="height_inches" placeholder="Inches" required style="margin-right: 10px; margin-left: 10px">
                <span style="margin-top: 5px;">inches</span>
    </div>

<br>
<br>
<p>
    <b>How satisfied are you with... <br></b>(0 = Completely dissatisfied; 10 = Completely satisfied)
    <table class="likert">
    <col span="1" >
    <tr>
        <th></th>
        {{for choice in form.sat_socialLife.choices}}
            <th>{{choice}}</th>
        {{endfor}}
{{ if player.seed_questionnaire_1 > 5000 }}
    </tr>
        <tr>
        <td class="likert_label">{{ form.sat_socialLife.label }}</td>
        {{ for choice in form.sat_socialLife }}
            <td class="likert_choice">{{ choice }}</td>
        {{ endfor }}
    </tr>
        <tr>
        <td class="likert_label">{{ form.sat_health.label }}</td>
        {{ for choice in form.sat_health }}
            <td class="likert_choice">{{ choice }}</td>
        {{ endfor }}
    </tr>
{{ else }}
    <tr>
        <td class="likert_label">{{ form.sat_health.label }}</td>
        {{ for choice in form.sat_health }}
            <td class="likert_choice">{{ choice }}</td>
        {{ endfor }}
    </tr>
    </tr>
        <tr>
        <td class="likert_label">{{ form.sat_socialLife.label }}</td>
        {{ for choice in form.sat_socialLife }}
            <td class="likert_choice">{{ choice }}</td>
        {{ endfor }}
    </tr>
{{ endif }}
</table>

<br>

<p>
    <br>
    <b>Different things are important to different people. How important are the following things to you?</b>
    <table class="likert">
    <col span="1" >
    <tr>
        <th></th>
        <th>Unimportant</th>
        <th>Less Important</th>
        <th>Important</th>
        <th>Very important</th>
    </tr>
{{ if player.seed_questionnaire_2 > 5000 }}
    <tr>
        <td class="likert_label">{{ form.importance_religion.label }}</td>
        {{ for choice in form.importance_religion }}
            <td class="likert_choice">{{ choice }}</td>
        {{ endfor }}
    </tr>
    <tr>
        <td class="likert_label">{{ form.importance_involvement.label }}</td>
        {{ for choice in form.importance_involvement }}
            <td class="likert_choice">{{ choice }}</td>
        {{ endfor }}
    </tr>
{{ else }}
        <tr>
        <td class="likert_label">{{ form.importance_involvement.label }}</td>
        {{ for choice in form.importance_involvement }}
            <td class="likert_choice">{{ choice }}</td>
        {{ endfor }}
    </tr>
        <tr>
        <td class="likert_label">{{ form.importance_religion.label }}</td>
        {{ for choice in form.importance_religion }}
            <td class="likert_choice">{{ choice }}</td>
        {{ endfor }}
    </tr>
{{ endif }}
</table>

</p>
<br>
{{ if player.seed_questionnaire_3 > 5000 }}
<p>
    {{ formfield "check_account" }}
</p>
<br>
<p>
    {{ formfield "alcohol" }}
</p>
{{ else }}
<p>
    {{ formfield "alcohol" }}
</p>
<br>
<p>
    {{ formfield "check_account" }}
</p>
{{ endif }}
<p>
<p>
<br>
    {{ formfield "smoke" }}
</p>
<br>

<button id="next_button" class="otree-btn-next btn btn-primary"> Next </button>

{{ endblock }}