{% extends 'user_sign_in_screen.html' %}

{% block user_login_frame %}


{% if validlink %}
<form method="post"  class="login-page-form" novalidate>
  <div class="h4 login-page-form-heading">Set your new password</div>
  {% csrf_token %}

  {% for field in form %}

  <div class="form-group">
    {{ field.label_tag }} <br>
    <div class="hg_passresetForm">{{ field }}</div>
    {{ field.errors }}
  </div>
  
  {% endfor %}
  <div class="form-group">
    <input type="submit" class="btn btn-primary" name="submit" value="Save" title="Click here to Save" />
  </div>
</form>
{% else %}
<p class="hg_text-danger hg_padleft">Invalid token.</p>
<p class="hg_card-text hg_padleft">
  <a href="{% url 'password_reset' %}">Request a new password reset token</a>
</p>
{% endif %}


<script>

  $('#password_set_form').submit(function (e) {
        e.preventDefault();
      // old_password = $('#id_old_password').val()
        new_password1 = $('#id_new_password1').val()
        new_password2 = $('#id_new_password2').val()
        if (new_password1 != new_password2) {
            $('#error_message').html('Passwords do not match')
            $('#success_message').hide()
            $('#error_message').show()
            return
        }
        $('#change_password_pop_up').modal('hide')
        $.ajax({
            type: 'POST',
            url: "{% url 'eProc_Login:forgot_password' %}",
            data: {

                new_password1: new_password1,
                new_password2: new_password2,
            },
            success: function (response) {
                $('#password_set_form').trigger('reset')
                $('#error_message').hide()
                $('#success_message').html(response.success_message)
                $('#success_message').show()
                $('#change_password_pop_up').modal('show')
            },
            error: function (error) {
                try {
                    $('#error_message').html(error.responseJSON.error_message)
                    $('#success_message').hide()
                    $('#error_message').show()
                    $('#change_password_pop_up').modal('show')
                } catch (error) {
                    console.error('Internal server down')
                }
            }
        })
  });
</script>

{% endblock %}