{% extends 'base.html' %}
{% load wagtailimages_tags wagtailcore_tags static core_tags gem_tags %}

{% block content %}
<div class="{% if self.your_words_competition %}yourwords{% elif self.display_form_directly %}polls{% else %}surveys{% endif %}">
  <div class="{% if self.your_words_competition %}yourwords{% elif self.display_form_directly %}polls{% else %}surveys{% endif %}__wrapper">
    {% if self.your_words_competition %}
      <div class="heading heading--hero">
        <h1 class="heading__component">
          {% trans 'Share your story' %}
        </h1>
      </div>
    {% elif self.contact_form %}
    {% else %}
      <div class="heading heading--secondary">
        <h1 class="heading__title">
          {% if self.display_form_directly %}
            {% trans 'Vote' %}
          {% elif self.article_form_only %}
            {% trans 'Reaction Questions' %}
          {% else %}
            {% trans 'Quiz' %}
          {% endif %}
        </h1>
      </div>
    {% endif %}

    <div class="{% if self.your_words_competition %}yourwords{% elif self.display_form_directly %}polls{% else %}surveys{% endif %}__inner">
      <section>
        <h2 class="heading__headline">{{self.title}}</h2>
        {% if self.introduction %}
          <p class="heading__subtitle">
            {{page.introduction|smarttruncatechars:550|safe}}
          </p>
        {% endif %}
        {% if self.description %}
          <div class="{% if self.your_words_competition %}yourwords{% elif self.display_form_directly %}polls{% else %}surveys{% endif %}__excerpt">
            {% for block in self.description %}
              {% if forloop.counter %}
                {% if block.block_type == 'heading' %}
                  <h3 class="{% if self.your_words_competition %}yourwords{% elif self.display_form_directly %}polls{% else %}surveys{% endif %}__title">
                    {{ block.value }}
                  </h3>
                {% else %}
                  {{ block }}
                {% endif %}
              {% endif %}
            {% endfor %}
          </div>
        {% endif %}
        {% if page.terms_and_conditions.exists and page.terms_and_conditions.first.terms_and_conditions.live %}
          <h4 class="{% if self.your_words_competition %}yourwords{% elif self.display_form_directly %}polls{% else %}surveys{% endif %}__terms">
            {% trans "Read:" %}
            <a href="{% pageurl page.terms_and_conditions.first.terms_and_conditions %}" class="call-to-action__item call-to-action__item-text">
              {{page.terms_and_conditions.first.terms_and_conditions.title}}
            </a>
          </h4>
        {% endif %}

        {% if self.contact_form %}
          {% include 'forms/form.html' %}
        {% else %}

          {% if user.is_authenticated and user.is_active or request.is_preview or self.allow_anonymous_submissions %}
            {% if fields_step and fields_step.paginator.num_pages > 1 %}
              <div class="pagination pagination--multi-step">
                <p class="call-to-action__item--text call-to-action__item--text-current">
                  {% if self.your_words_competition %}
                    {% blocktrans with pages=fields_step.paginator.num_pages %}
                    This competition has {{pages}} pages {% endblocktrans %}
                  {% elif not self.display_form_directly %}
                    {% blocktrans with pages=fields_step.paginator.num_pages %}This survey has {{pages}} pages{% endblocktrans %}
                  {% endif %}
                </p>
              </div>
            {% endif %}
            {% include 'forms/form.html' %}
          {% else %}
            <nav>
              <div class="call-to-action--group">
                <a href="{% url LOGIN_URL %}?next={{request.path}}" class="call-to-action__button call-to-action__button--primary">
                  {% trans "Log in to take" %} {% if self.your_words_competition %}{% trans 'competition' %}{% elif self.display_form_directly %}{% trans 'poll' %}{% else %}{% trans 'survey' %}
                  {% endif %}
                </a>
              </div>
            </nav>
          {% endif %}
        {% endif %}
      </section>
      {% if self.image %}
        <aside>
          {% image self.image width-480 as tmp_photo %}
          <img src="{{ tmp_photo.url }}" alt="{{ tmp_photo.title }}" class="{% if self.your_words_competition %}yourwords{% elif self.display_form_directly %}polls{% else %}surveys{% endif %}__image" />
        </aside>
      {% endif %}
    </div>
  </div>
</div>

{% endblock %}
