{% extends request.session.from_app|yesno:"base/app.html,base/base.html" %}
{% load i18n %}
{% load chunks %}
{% load thumbnail %}
{% load club %}

{% block titleextra %}{% trans "Join us in freeing the books!" %}{% endblock %}
{% block metadescription %}{% trans "„Wolne Lektury należy wspierać, bo są” - Filip Springer" %}{% endblock %}


{% block body %}
  <div class="white-box normal-text">

    <h1>{% trans "Support Wolne Lektury" %}</h1>
    <h2 style="margin-bottom:2em;">
      {% if membership %}
        {# Displays to members. #}
        {% trans "Thank you for your support! Support us again!" %}
      {% else %}
        {# Displays to non-supporters. #}
        {% trans "Thank you for wanting to free the books with us!" %}
      {% endif %}</h2>

      {% with schedule=request.user|active_schedule %}
        {% if schedule %}
          <p><a href="{{ schedule.get_absolute_url }}">{% trans "See your past support." %}</a></p>
        {% endif %}
      {% endwith %}

      <div class='twocol'>

      <form method="POST" action="" id="payment-form" class="wlform">
        {% csrf_token %}

        {% chunk 'club_form_top' %}

	{% if supporters_target %}
        {% club_monthly_since supporters_since as supporters %}
        {% club_monthly_missing_since supporters_since supporters_target as missing_supporters %}
	<p>
	  {% blocktrans %}Help us get 100 new Friends by the end of the school semester.{% endblocktrans %}
	  {% blocktrans count supporters=supporters %}
	    So far <b style="color: #0d7e85">{{ supporters }}</b> reader has already supported us with a regular donation,
	    {% plural %}
	    So far <b style="color: #0d7e85">{{ supporters }}</b> readers have already supported us with a regular donation,
	  {% endblocktrans %}
	  {% blocktrans count missing_supporters=missing_supporters %}
	    <b style="color: #0d7e85">{{ missing_supporters }}</b> is missing.
            {% plural %}
            <b style="color: #0d7e85">{{ missing_supporters }}</b> are missing.
	  {% endblocktrans %}
        </p>
        <div class="funding" style="background: none;"><div class="description"><div class="progress" style="text-align: center; background-size: {{ supporters }}% 1px;"><span class="piece progress-collected">&nbsp;{{ supporters }}</span><span class="piece progress-target">{{ missing_supporters }}&nbsp;</span><div style="clear: both"></div></div></div></div>
	{% endif %}

        {% include "club/payment_form.html" %}

        {% chunk 'club_form_bottom' %}

      </form>

      <div class="club-form-info">
        {% if ambassador %}
	<div class="ambassador {% if ambassador.photo %}with-photo{% endif %}">
            <div>
              <em>
                {{ ambassador.text }}
              </em>
              <div style="font-size: 1.2em">{{ ambassador.name }}</div>
            </div>
            {% if ambassador.photo %}
              <img src="{% thumbnail ambassador.photo "100x100" as thumb %}{{ thumb.url }}{% empty %}{{ ambassador.photo.url }}{% endthumbnail %}">
            {% endif %}
          </div>
        {% endif %}

        {% include "club/payment_info.html" %}
</div>
</div>

</div>

{% endblock %}