{{ block title }}General attitude towards AI systems{{ 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>Now, we would like you to answer some questions about your general attitude towards artificial intelligence.</b>
    </p>
    <p>
        Please give your personal assessment of the following questions.
    </p>
<br>


<div>
    <table class="likert">
        <col span="1" class="wide">
        <tr>
            <th></th>
            <th>Strongly disagree</th>
            <th>Disagree</th>
            <th>Rather disagree</th>
            <th>Neutral</th>
            <th>Rather agree</th>
            <th>Agree</th>
            <th>Strongly agree</th>
        </tr>
        <tr>
            <td class="likert_label">{{ form.ATAI_fear.label }}</td>
            {{ for choice in form.ATAI_fear }}
            <td class="likert_choice">{{ choice }}</td>
            {{ endfor }}
        </tr>
        <tr>
            <td class="likert_label">{{ form.ATAI_trust.label }}</td>
            {{ for choice in form.ATAI_trust }}
            <td class="likert_choice">{{ choice }}</td>
            {{ endfor }}
        </tr>
        <tr>
            <td class="likert_label">{{ form.ATAI_destroy_humankind.label }}</td>
            {{ for choice in form.ATAI_destroy_humankind }}
            <td class="likert_choice">{{ choice }}</td>
            {{ endfor }}
        </tr>
        <tr>
            <td class="likert_label">{{ form.ATAI_benefit.label }}</td>
            {{ for choice in form.ATAI_benefit }}
            <td class="likert_choice">{{ choice }}</td>
            {{ endfor }}
        </tr>
        <tr>
            <td class="likert_label">{{ form.ATAI_job_loss.label }}</td>
            {{ for choice in form.ATAI_job_loss }}
            <td class="likert_choice">{{ choice }}</td>
            {{ endfor }}
        </tr>
    </table>
</div>

<br>
<br>

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

{{ endblock }}