{% extends "base.html" %}
{% load i18n static core_tags wagtailsettings_tags wagtailcore_tags %}
{% get_settings %}

{% block content %}
<div class="profiles">
  <div class="profiles__wrapper">
    <div class="heading heading--hero">
      <h1 class="heading__component">{% trans "Register" %}</h1>
    </div>
    <div class="profiles__caption">
      <h3 class="heading__subtitle">{% trans "Already a member?" %}</h3>
      <a href="{% url "molo.profiles:auth_login" %}" class="call-to-action__item call-to-action__item--text">{% trans "Login" %}</a>
    </div>
    <div class="profiles__inner">
      <h2 class="heading__headline">{% trans "Not a member yet?" %}</h2>
      <h3 class="heading__subtitle">
        {% trans "Join us by signing up below." %}
      </h3>
      <form method="post" action="{% url "molo.profiles:user_register" %}" class="profiles__form" novalidate>
      {% csrf_token %}
        <fieldset>
          <label for="id_username">{% trans "Choose A Username" %}</label>
          {{ form.username }}
          {{ form.username.errors}}
          <span class="input-hint">
            {% trans "This name you will use to log in and won't appear to other users. Only you will see this" %}.
          </span>
        </fieldset>
        <fieldset>
          <label for="id_password">{% trans "Choose A 4-Digit PIN" %}</label>
          {{ form.password }}
          {{ form.password.errors}}
          <span class="input-hint">({% trans "e.g. 2086" %})</span>
        </fieldset>
        {% if settings.profiles.UserProfilesSettings.activate_display_name and settings.profiles.UserProfilesSettings.capture_display_name_on_reg %}
        <fieldset>
          <label for="alias">{% trans "Choose A Display Name" %}</label>
          {{ form.alias }}
          {{ form.alias.errors}}
          <span class="input-hint">{% trans "Girl Effect values your online security, therefore we hide your username and allow you to comment and interact with the site anonymously. If you would like to interact with other people, like your friends to be able to see you as a username and not anonymous, update your username here" %}</span>
        </fieldset>
        {% endif %}
        {% if settings.profiles.UserProfilesSettings.activate_dob and settings.profiles.UserProfilesSettings.capture_dob_on_reg %}
        <fieldset>
          <label for="date_of_birth">{% trans "Select Date of Birth" %}</label>
          {{ form.date_of_birth }}
          {{ form.date_of_birth.errors}}
          <span class="input-hint">{% trans "Let us know your birthday to get access to exclusive content." %}</span>
        </fieldset>
        {% endif %}
        {% if settings.profiles.UserProfilesSettings.activate_gender and settings.profiles.UserProfilesSettings.capture_gender_on_reg %}
        <fieldset>
          <label for="gender">{% trans "I Identify My Gender As:" %}</label>
          {{ form.gender }}
          {{ form.gender.errors}}
          <span class="input-hint">{% trans "Only you will see this" %}.</span>
        </fieldset>
        {% endif %}
        {% if settings.profiles.UserProfilesSettings.activate_location and settings.profiles.UserProfilesSettings.capture_location_on_reg %}
        <fieldset>
          <label for="location">{% trans "Where Do You Live?" %}</label>
          {{ form.location }}
          {{ form.location.errors}}
          <span class="input-hint">{% trans "Only you will see this" %}.</span>
        </fieldset>
        {% endif %}
        {% if settings.profiles.UserProfilesSettings.show_mobile_number_field and settings.profiles.UserProfilesSettings.country_code %}
          <fieldset>
            <label for="mobile_number">{% trans "Enter your mobile number" %}</label>
            {{ form.mobile_number }}
            {{ form.mobile_number.errors}}
            <span class="input-hint">{% trans "(e.g. 0754556789)" %}</span>
          </fieldset>
        {% endif %}
        {% if settings.profiles.UserProfilesSettings.show_email_field %}
          <fieldset>
            <label for="id_email">{% trans "Enter your email address" %}</label>
            {{ form.email }}
            {{ form.email.errors}}
            <span class="input-hint">{% trans "(e.g. example@foo.com)" %}</span>
          </fieldset>
        {% endif %}
        {% if settings.profiles.UserProfilesSettings.activate_education_level and settings.profiles.UserProfilesSettings.capture_education_level_on_reg %}
          <fieldset>
            <label for="education_level">{% trans "What is your highest level of education?" %}</label>
            {{ form.education_level }}
            {{ form.education_level.errors}}
            <span class="input-hint">{% trans "Only you will see this" %}.</span>
          </fieldset>
        {% endif %}
        {% if settings.profiles.UserProfilesSettings.show_security_question_fields  %}
          {% for field in form %}
            {% if field in form.security_questions %}
              <fieldset>
                <label for="{{ field.id_for_label }}">
                  {% trans field.label_tag %}
                </label>
                {{ field }}
                {{ field.errors}}
              </fieldset>
            {% endif %}
          {% endfor %}
        {% endif %}
        <fieldset>
          {{ form.terms_and_conditions }}
          {% if settings.profiles.UserProfilesSettings.terms_and_conditions %}
            <label for="id_terms_and_conditions" class="profiles__terms">
              <a href="{% pageurl settings.profiles.UserProfilesSettings.terms_and_conditions %}" class="profiles__terms--link">{% trans "I accept the Terms and Conditions" %}
              </a>
            </label>
          {% else %}
            <label for="id_terms_and_conditions" class="profiles__terms">
              {% trans "I accept the Terms and Conditions" %}
            </label>
          {% endif %}
          {% if form.terms_and_conditions.errors %}
            <p class="error-list__item">
              {% trans "Please accept the T&amp;Cs in order to complete the registration" %}
            </p>
          {% endif %}
        </fieldset>
        <div class="call-to-action--group">
          <button type="submit" class="call-to-action__button call-to-action__button--primary">{% trans "Register" %}</button>
          <input type="hidden" name="next" value="{% url "molo.profiles:registration_done" %}"/>
        </div>
      </form>
    </div>
  </div>
</div>
{% endblock %}
