{% load i18n roles %}
{% user_has_role request 'reader' staff_override=False as reader %}

<div class="row">
        <div class="medium-12 medium-centered large-12 large-centered columns login">
            <div class="callout">
                <h5>{% trans "Change Your Email Address" %}</h5>
                {% blocktrans %}
                <p>If you want to change your email address you may do so below, however, you will be logged out and your
                account will be marked as inactive until you follow the instructions in the verification email. <strong>Note: </strong>
                Changing your email address will also change your username as these are one and the same.</p>
                {% endblocktrans %}
                <p><strong>{% trans 'Current Email Address' %}:</strong> {{ request.user.email }}</p>
                <form method="POST">
                    {% csrf_token %}
                    <label for="email_address">{% trans 'New Email Address' %}</label>
                    <input type="email" name="email_address" placeholder="janeway@voyager.com">
                    <button type="submit" name="email" class="warning button">{% trans "Update Email Address" %}</button>
                </form>
            </div>
        </div>
    </div>

    {% if request.journal and send_reader_notifications %}
    <div class="row">
        <div class="medium-12 medium-centered large-12 large-centered columns">
            <div class="callout">
                <h5>{% trans "Register for Article Notifications" %}</h5>
                <form method="POST">
                    <p>
                        {% blocktrans %}Use the button below to register to receive notifications of new articles
                            published in this journal {% endblocktrans %}
                    </p>
                    {% csrf_token %}
                    {% if reader %}
                        <button name="unsubscribe" class="warning button">
                            {% trans "Unsubscribe from Article Notifications" %}
                        </button>
                    {% else %}
                        <button name="subscribe" class="warning button">
                            {% trans "Subscribe to Article Notifications" %}
                        </button>
                    {% endif %}
                </form>
            </div>
        </div>
    </div>
    {% endif %}
    <div class="row">
        <div class="medium-12 medium-centered large-12 large-centered columns login">
            <div class="callout">
                <h5>{% trans "Update Password" %}</h5>
                <p>{% trans "You can update your password by entering your existing password plus your new password." %}</p>
                <form method="POST">
                    {% csrf_token %}
                    <div class="row">
                        <div class="medium-4 columns">
                            <label for="current_password">{% trans "Current Password" %}</label>
                            <input type="password" name="current_password">
                        </div>
                        <div class="medium-4 columns">
                            <label for="new_password_one">{% trans "New Password" %}</label>
                            <input type="password" name="new_password_one">
                        </div>
                        <div class="medium-4 columns">
                            <label for="new_password_two">{% trans "Enter Password Again" %}</label>
                            <input type="password" name="new_password_two">
                        </div>
                    </div>
                    <button type="submit" name="change_password" class="warning button">{% trans "Update Password" %}</button>
                </form>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="medium-12 medium-centered large-12 large-centered columns login">

            <form method="POST" enctype="multipart/form-data">
                {% csrf_token %}
                <div class="callout">
                    <div class="row column log-in-form">

                        {% include "elements/forms/errors.html" with form=form %}
                        {% include "elements/accounts/user_form.html" with form=form %}
                        <p><button type="submit" name="edit_profile" class="success button float-right">{% trans "Update" %}</button></p>
                    </div>
                </div>
            </form>

        </div>
    </div>