<%! from django.core.urlresolvers import reverse %>
<section id="forgot-password-modal" class="modal forgot-password-modal">
  <div class="inner-wrapper">
    <div id="password-reset">
      <header>
        <h2>Password reset</h2>
        <hr>
      </header>

      <div class="message">
        <p>Enter your e-mail address below, and we will e-mail instructions for setting a new password.</p>
      </div>

      <form id="pwd_reset_form" action="${reverse('password_reset')}" method="post" data-remote="true">
        <label for="id_email">E-mail address:</label>
        <input id="id_email" type="email" name="email" maxlength="75" placeholder="Your E-mail"/>
        <div class="submit">
          <input type="submit" id="pwd_reset_button" value="Reset my password" />
        </div>
      </form>
    </div>

    <div class="close-modal">
      <div class="inner">
        <p>&#10005;</p>
      </div>
    </div>
  </div>
</section>

<script type="text/javascript">
  (function() {
   $(document).delegate('#pwd_reset_form', 'ajax:success', function(data, json, xhr) {
     if(json.success) {
       $("#password-reset").html(json.value);
     } else {
       if($('#pwd_error').length == 0) {
         $('#pwd_reset_form').prepend('<div id="pwd_error" class="modal-form-error">Email is incorrect.</div>');
       }
       $('#pwd_error').stop().css("display", "block");
     }
   });
  })(this)
</script>