{% 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 == 'd6_jQXoS0rs' %}
        <p>
            Please answer the following questions.
        </p>

        <div class="form-group">
            <div class="row">
            {% formfield player.question1 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question2 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question3 %}
            </div>
        </div>

        <div class="form-group">
            <div class="row">
            {% formfield player.question4 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question5 %}
            </div>
        </div>
        <div class="form-group">
            <div class="row">
            {% formfield player.question6 %}
            </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="http://booksurvey.herokuapp.com/room/empathy">click here.</a>
        </p>
    {% endif %}
    <div class="center">
    </div>
{% endblock %}