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

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

{% block content %}
<h1 style="font-size:40px;">Follow up</h1>
    <p><b>Thank you so much for participating in our experiment and helping us with our research!</b></p>

    <p>You have now been entered into the lotteries.</p>

    <p><b>In a few weeks, we would like to conduct a shorter follow-up survey to complement our study.</b>
    If useful, we will give you information about how your preferences would have changed since today. If you are willing
    to help us, please write an email address where we can send you the link of the follow-up survey. In addition to the
    invitation, we will send you a one-page summary of the findings of the first part of the experiment in case you are interested.
    If you participate in the follow-up survey, you will be offered either a small reward or a chance to participate in a
    lottery for a larger reward.</p>



{% formfield "email" %}

    <br>

<h1 style="font-size:40px;">Feedback</h1>

<p>
    The questions below are completely optional, but your answers
    would be very useful in refining our research design. You will be entered into the
    lottery as described regardless of your answers. Thank you! <b>If you don't want to complete these questions simply
scroll down and clik "Next" to finish the survey</b>.


</p>

<p>
    Could you tell us if any of these factors play a role to influence your
    decision to follow or unfollow any news publishers during the study?
</p>
    <table class="table" >
	<col style="width:70%">
	<col style="width:10%">
	<col style="width:10%">
    <col style="width:10%">
    <thead>
    <tr>
        <th> </th>
        <td style="text-align:center"> Yes </td>
        <td style="text-align:center"> More or less </td>
        <td style="text-align:center"> No </td>
    </tr>
	</thead>
	<tbody>

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

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

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

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

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

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

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

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

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

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

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

{% formfield "debrief_why_publisher" %}
{% formfield "debrief_why_publisher_any_other" %}

{{ form.debrief_tweet_scale.label }}
<div style="overflow-x:auto">
<table class="table" style="width: 100%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 10%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
    <tr>
    {% for choice in form.debrief_tweet_scale %}
        <td style="text-align:center"> &nbsp &nbsp &nbsp {{ choice }}</td>
    {% endfor %}
    </tr>
    <tr>
        <td style="text-align:center">0</td>
        <td style="text-align:center">1</td>
        <td style="text-align:center">2</td>
        <td style="text-align:center">3</td>
        <td style="text-align:center">4</td>
        <td style="text-align:center">5</td>
        <td style="text-align:center">6</td>
        <td style="text-align:center">7</td>
        <td style="text-align:center">8</td>
        <td style="text-align:center">9</td>
        <td style="text-align:center">10</td>

    </tr>
</table>
</div>



    {{ form.debrief_retweet_scale.label }}
<div style="overflow-x:auto">
<table class="table" style="width: 100%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 10%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
    <tr>
    {% for choice in form.debrief_retweet_scale %}
        <td style="text-align:center"> &nbsp &nbsp &nbsp {{ choice }}</td>
    {% endfor %}
    </tr>
    <tr>
        <td style="text-align:center">0</td>
        <td style="text-align:center">1</td>
        <td style="text-align:center">2</td>
        <td style="text-align:center">3</td>
        <td style="text-align:center">4</td>
        <td style="text-align:center">5</td>
        <td style="text-align:center">6</td>
        <td style="text-align:center">7</td>
        <td style="text-align:center">8</td>
        <td style="text-align:center">9</td>
        <td style="text-align:center">10</td>

    </tr>
</table>
</div>

    {{ form.debrief_retweet_scale_selected.label }}
<div style="overflow-x:auto">
<table class="table" style="width: 100%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 10%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
<col style="width: 9%">
    <tr>
    {% for choice in form.debrief_retweet_scale_selected %}
        <td style="text-align:center"> &nbsp &nbsp &nbsp {{ choice }}</td>
    {% endfor %}
    </tr>
    <tr>
        <td style="text-align:center">0</td>
        <td style="text-align:center">1</td>
        <td style="text-align:center">2</td>
        <td style="text-align:center">3</td>
        <td style="text-align:center">4</td>
        <td style="text-align:center">5</td>
        <td style="text-align:center">6</td>
        <td style="text-align:center">7</td>
        <td style="text-align:center">8</td>
        <td style="text-align:center">9</td>
        <td style="text-align:center">10</td>

    </tr>
</table>
</div>


    {% formfield "debrief_tweet_question" %}
    {% formfield "debrief_tweet_why" %}

    {% formfield "debrief_summary_stat" %}
{% formfield "debrief_instructions" %}

{% formfield "debrief_technical_glitches" %}

    <br><br>

    {% 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 %}

{% block scripts %}
<style>
table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  border: 1px solid #ddd;
}

th, td {
  text-align: center;
  padding: 8px;

}
tr:nth-child(even){background-color: #f2f2f2}
</style>

{% endblock %}