{% extends "account/base.html" %}

{% load url from future %}
{% load crispy_forms_tags %}

{% block head_title %}Account{% endblock %}

{% block content %}
  <div class="container">
    <div class="row">
      <div class="col-md-5">
        <h2>E-mail Addresses</h2>
        {% if user.emailaddress_set.all %}
          <p>The following e-mail addresses are associated with your account:</p>

          <form action="{% url 'account_email' %}" class="email_list" method="post">{% csrf_token %}
            <fieldset class="blockLabels">

              {% for emailaddress in user.emailaddress_set.all %}
                <div class="ctrlHolder">
                  <label for="email_radio_{{ forloop.counter }}" class="{% if emailaddress.primary %}primary_email{% endif %}">

                  <input id="email_radio_{{ forloop.counter }}" type="radio" name="email" {% if emailaddress.primary %}checked="checked"{% endif %} value="{{ emailaddress.email }}"/>

                  {{ emailaddress.email }}
                  {% if emailaddress.verified %}
                    <span class="verified">Verified</span>
                  {% else %}
                    <span class="unverified">Unverified</span>
                  {% endif %}
                {% if emailaddress.primary %}<span class="primary">Primary</span>{% endif %}
                </label>
              </div>
            {% endfor %}

            <div class="buttonHolder">
              <button class="secondaryAction" type="submit" name="action_primary" >Make Primary</button>
              <button class="secondaryAction" type="submit" name="action_send" >{Re-send Verification</button>
              <button class="primaryAction" type="submit" name="action_remove" >Remove</button>
            </div>

          </fieldset>
        </form>

      {% else %}
        <p>
          <strong>Warning:</strong> You currently do not have any e-mail address set up.
          You should really add an e-mail address so you can receive notifications,
          reset your password, etc.
        </p>
      {% endif %}

      <h2>Add E-mail Address</h2>

      <form method="post" action="." class="add_email">{% csrf_token %}
        {{ form|crispy }}
        <button class="btn" name="action_add" type="submit">Add E-mail</button>
      </form>
      </div>
    </div>
  </div>
{% endblock %}

{% block extra_body %}
  <script type="text/javascript">
    (function() {
        var message = "Do you really want to remove the selected e-mail address?";
        var actions = document.getElementsByName('action_remove');
        if (actions.length) {
            actions[0].addEventListener("click", function(e) {
                if (! confirm(message)) {
                    e.preventDefault();
                }
            });
        }
    })();
  </script>
{% endblock %}