{% extends "base.htm" -%}
{% from 'bs_page_header.htm' import bs_page_header with context -%}

{% block main -%}
{{ bs_page_header(_("E-mail Addresses")) }}
{% if request.user.emailaddress_set.exists() -%}

<card-default>
    <card-header>
        <card-title>{{ _('The following e-mail addresses are associated with your account:') }}</card-title>
    </card-header>
    <card-body>
        <form role="form" action="{{ tpl.url('account_email') }}" class="email_list" method="post">
            <input type="hidden" name="csrfmiddlewaretoken" value="{{ csrf_token }}">
            <fieldset class="blockLabels">

            {% for emailaddress in request.user.emailaddress_set.all() -%}
            <div class="ctrlHolder">
                <label for="email_radio_{{ loop.index0 }}" class="{% if emailaddress.primary -%}primary_email{%endif%}">
                    <input id="email_radio_{{ loop.index0 }}" type="radio" name="email" {% if emailaddress.primary or request.user.emailaddress_set.count() == 1 -%}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="btn btn-primary secondaryAction" type="submit" name="action_primary" >{{ _('Make Primary') }}</button>
                  <button class="btn btn-info secondaryAction" type="submit" name="action_send" >{{ _('Re-send Verification') }}</button>
                  <button class="btn btn-danger primaryAction" type="submit" name="action_remove" >{{ _('Remove') }}</button>
            </div>

            </fieldset>
        </form>
    </card-body>
</card-default>

{% else -%}
<div class="jumbotrion">
    <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.") }}
</div>
{% endif -%}


<card-default>
    <card-header>
        <card-title>{{ _("Add E-mail Address") }}</card-title>
    </card-header>
    <card-body>
        <form role="form" method="post" action="{{ tpl.url('account_email') }}" class="add_email">
            {{ render_form(request, 'body', form) }}
            <button class="btn btn-primary" name="action_add" type="submit">{{ _("Add E-mail") }}</button>
        </form>
    </card-body>
</card-default>

{% endblock main -%}


{% block bottom_scripts -%}
<script type="module">
import { Dialog } from '{{ static('djk/js/dialog.js') }}';

(function() {
    var message = "{{ _('Do you really want to remove the selected e-mail address?') }}";
    var actions = document.getElementsByName('action_remove');
    var confirmed = false;
    if (actions.length) {
        actions[0].addEventListener("click", function(e) {
            if (confirmed === false) {
                new Dialog({
                    'message': message,
                    'callback': function(result) {
                        confirmed = result;
                        if (confirmed) {
                            $(actions[0]).click();
                        }
                    }
                }).confirm();
                e.preventDefault();
            }
            confirmed = false;
        });
    }
})();
</script>
{% endblock bottom_scripts -%}
