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



{% block title %}
Twitter News Experiment
{% endblock %}

{% block content %}
<h1 style="font-size:40px;">Online Research Survey</h1>


<p><b>Thank you for deciding to help us with our research!</b> In the first section, you will be asked some basic questions about yourself and your political views.
    While your responses to these questions are important for our research, we understand your time is limited. <b>These questions are optional and will not impact
        your chances at winning the bonus.</b></p>

<br>
<h2>Section I. Demographics, Political Ideology and Social Interactions</h2>

{% formfield player.yearBirth %}
{% formfield player.gender %}
{% formfield player.education %}
{% formfield player.ethnicity %}


<!--{{form.errors}}-->
<br>
<br>
<p>Next, we would like to ask you some questions about your political views and your perception of your Twitter friends.
    We hear a lot of talk these days about liberals and conservatives. Here is a scale on which the political views that people might
    hold are arranged from extremely liberal to extremely conservative. Where would you place yourself, the people you follow on Twitter
    and the people who follow you  on this scale?</p>

<!--<table class="table">-->




<table class="table" style="width: 100%">
	<col style="width:16%">
	<col style="width:12%">
	<col style="width:12%">
    <col style="width:12%">
    <col style="width:12%">
    <col style="width:12%">
    <col style="width:12%">
    <col style="width:12%">
	<thead>
    <tr>
        <th> </th>
        <td style="text-align:center"> Extremely liberal </td>
        <td style="text-align:center"> Liberal </td>
        <td style="text-align:center"> Slightly liberal </td>
        <td style="text-align:center"> Moderate </td>
        <td style="text-align:center"> Slightly conservative </td>
        <td style="text-align:center"> Conservative </td>
        <td style="text-align:center"> Extremely conservative </td>
    </tr>
	</thead>
	<tbody>


    <tr>
        <th>{{ form.ideology.label }}</th>
        {% for choice in form.ideology %}

            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>


    <tr>
        <th>{{ form.ideologyTwitterFollowers.label }}</th>
        {% for choice in form.ideologyTwitterFollowers %}
            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>

    <tr>
        <th>{{ form.ideologyTwitterFollow.label }}</th>
        {% for choice in form.ideologyTwitterFollow %}
            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>
	</tbody>
</table>




<br> <br>
<p>On an average day in the last week, how much free time (i.e. excluding work) did you spend <b>per day</b>...</p>



<table class="table" style="width: 100%">
    <col style="width:28%">
	<col style="width:12%">
	<col style="width:12%">
    <col style="width:12%">
    <col style="width:12%">
    <col style="width:12%">
    <col style="width:12%">
    <tr>
        <td></td>
        <td style="text-align:center">0 minutes</td>
        <td style="text-align:center">Between 1 and 30 minutes</td>
        <td style="text-align:center">Between 31 minutes and 1 hour</td>
        <td style="text-align:center">Between 1 and 2 hours</td>
        <td style="text-align:center">Between 2 and 3 hours</td>
        <td style="text-align:center">More than 3 hours</td>
    </tr>
    <tr>
        <th>{{ form.timeFamily.label }}</th>
        {% for choice in form.timeFamily %}
            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>

    <tr>
        <th>{{ form.timeFriends.label }}</th>
        {% for choice in form.timeFriends %}
            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>

    <tr>
        <th>{{ form.timeAlone.label }}</th>
        {% for choice in form.timeAlone %}
            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>

    <tr>
        <th>{{ form.timeTwitter.label }}</th>
        {% for choice in form.timeTwitter %}
            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>

    <tr>
        <th>{{ form.timeSocialMedia.label }}</th>
        {% for choice in form.timeSocialMedia %}
            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>

    <tr>
        <th>{{ form.timeNews.label }}</th>
        {% for choice in form.timeNews %}
            <td style="text-align:center">{{ choice }}</td>
        {% endfor %}
    </tr>
</table>

To complete this section we will briefly ask you a few questions about your relationship with others.
{% formfield player.loneliness %}
{% formfield player.trustOthers %}
{% formfield player.othersFairness %}

    {% next_button %}

<br><br>
<footer class="text-muted">
     <div class="container">
        <p>This study is conducted by researchers at MIT. For help please contact <a href="mailto:NewsConsumptionProject@mit.edu" style="color: blue">NewsConsumptionProject@mit.edu</a></p>
    </div>
</footer>

{% endblock %}


<!--{{form.yearBirth.label}} {{form.yearBirth}}-->

<!--{%formfield Player.yearBirth%}-->
<!--    {% formfields %}-->

<!--'yearBirth', 'country', 'state', 'zipCode', 'gender', 'education', 'ethnicity'-->