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

{% block title %}Account Creation{% endblock %}

{% block scripts %}
  {{ block.super }}

(function($) {
    var checkUsername = function() {
        var field = $(this);
        var url = $("#check_user_name_url").val();
        var error = field.next('.username-error');

        $.ajax({
            url: url,
            data: {username: field.val()},
            dataType: 'json',
            success: function(response) {
                if (response.error) {
                   error.text(response.error);
                   error.show();
                } else {
                   error.hide();
                }
            }
        });
    }

    $(document).ready(function(){
        $('#id_email').after(' <span class="username-error" style="display: none;"></span>');
        $('#id_email').keyup(checkUsername).blur(checkUsername);
    });
})(jQuery);
{% endblock %}

{% block content %}
<div id="register_page">
<h1>Account Creation</h1>
{% if success %}
<p>Your account creation request has been received successfully. <br />
   We have sent you an email with instructions on how to complete the process.</p>
<p>Best regards,
<br />
<br />
<blockquote>
	The datatracker login manager service<br />
	(for the IETF Secretariat)

{% else %}
<form action="" method="POST">
  <p>Please enter your email address in order to create a new account.</p>
  <table class="register-form">
  {{ form }}
  </table>
  <div class="submit_row">
    <input type="hidden" id="check_user_name_url" value="{% url ajax_check_username %}" />
    <input type="submit" value="Submit" />
  </div>
</form>
<p class="reset_password_description">
I'm already registered but I forgot my password. <a href="{% url password_reset %}">Please, help me reset my password.</a>
</p>
{% endif %}
</div>
{% endblock %}
