{% extends "otree/Page.html" %}
{% load otree static %}

{% block styles %}
    <link rel="stylesheet" type="text/css" href="{% static 'global/main.css' %}">
{% endblock %}

{% block title %}
    <div class="center">
        Book Survey
    </div>
{% endblock %}

{% block content %}
    {% if player.weblink == 'cocPv6dXU-U' %}
        <p>
            Based on your learning from the video, please relook at the following questions.
        </p>

        <div class="form-group">
            <div class="row">
            {% formfield player.question1_1 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question2_1 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question3_1 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question4_1 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question5_1 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question6_1 %}
            </div>
        </div>
        <div class="center">
            <button class="otree-btn-next btn btn-primary">
                Next
            </button>
        </div>

    {% else %}
        <p>
            You are assigned to the Empathy Book, please <a href="https://booksurvey.herokuapp.com/room/empathy">click here.</a>
        </p>
    {% endif %}
    <div class="center">
<!--        <button class="otree-btn-next btn btn-primary">-->
<!--            Next-->
<!--        </button>-->
    </div>
{% endblock %}