{% extends "base.html" %}
{% block js %}
<script type="text/javascript" src="site_media/js/jquery/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="site_media/js/jquery/password_strength.js"></script>
{% endblock %}
{% block title %}Change password{% endblock %}
{% block content %}
<h2>Change password</h2>
{% if form %}
<p>When thinking of a new password you need to remember to use:</p>
<ul>
    <li>no fewer than ten characters</li>
    <li>at least one upper case and one lower case letter</li>
    <li>three or more numbers or special characters</li>
</ul>

    <p class="error">
        {{ form.non_field_errors }}
    </p>
    <form action="{% url changepw %}" method="post" autocomplete="off">{% csrf_token %}
    <table>
        <tr>
            <th class="formlabel">Username:</th><td>{{ username }}</td>
        </tr>
    {% for field in form %}
        <tr>
            <td class="fielderrors">{{ field.errors }}</td>
        </tr>
        <tr>
            <th class="formlabel">{{ field.label_tag }}:</th><td class="formfield">{{ field }}</td><td><span class="password_strength"></span></td>
        </tr>
    {% endfor %}
    </table>
    <input type="submit" value="Submit" />
    </form>
    <script type="text/javascript">
        $('form').attr('autocomplete', 'off');
        $('#id_new_password').password_strength();
        $('#id_new_password_again').password_strength();
    </script>
{% else %}
    {% if return_value == 0 %}
        <p>Your password was changed successfully.</p>
    {% else %}
        <p>Something went wrong. Please contact an administrator.</p>
        <p>Return code: {{ return_value }}</p>
    {% endif %}
{% endif %}
<p>
    <a href="{% url index %}">Back</a><br />
    <a href="{% url logout %}">Log out</a>
</p>
{% endblock %}