From 720914efdf15d39968b62f17a45843bc7834030c Mon Sep 17 00:00:00 2001
From: Ben Adida <ben@adida.net>
Date: Thu, 14 Jul 2011 10:03:26 -0700
Subject: [PATCH] added password notification to forgot password
---
.../dialog/controllers/dialog_controller.js | 24 +++++++++++++++++++
.../static/dialog/views/forgotpassword.ejs | 17 +++++++------
2 files changed, 34 insertions(+), 7 deletions(-)
diff --git a/browserid/static/dialog/controllers/dialog_controller.js b/browserid/static/dialog/controllers/dialog_controller.js
index 50a802e55..e670ef508 100644
--- a/browserid/static/dialog/controllers/dialog_controller.js
+++ b/browserid/static/dialog/controllers/dialog_controller.js
@@ -279,6 +279,30 @@ $.Controller("Dialog", {}, {
doForgotPassword: function() {
$('#dialog').html("views/forgotpassword.ejs", {});
$('#bottom-bar').html("views/bottom-continue.ejs", {});
+
+ var self=this;
+ function checkInput() {
+ var pass = $("#password_input").val();
+ var match = pass === $("#password_verify_input").val();
+ self.find('.passwordnote').hide();
+ if (!match) {
+ self.find('#passwords_different').show();
+ } else {
+ if (!pass) {
+ self.find('#enter_a_password').show();
+ } else if (pass.length < 5) {
+ self.find('#password_too_short').show();
+ } else {
+ self.find('#password_ok').show();
+ }
+ }
+ }
+
+ // watch input dialogs
+ self.find("input").unbind('keyup').bind('keyup', checkInput);
+
+ // do a check at load time, in case the user is using the back button (enables the continue button!)
+ checkInput();
},
doWait: function(title, message) {
diff --git a/browserid/static/dialog/views/forgotpassword.ejs b/browserid/static/dialog/views/forgotpassword.ejs
index eb09e3eca..8674d5403 100644
--- a/browserid/static/dialog/views/forgotpassword.ejs
+++ b/browserid/static/dialog/views/forgotpassword.ejs
@@ -2,19 +2,22 @@
<div class="summary"><b>Forgot your password?</b> No problem! Enter your email address, pick a new password, and we'll get you set up again!</div>
<div class="input">
<div class="label"> Email </div>
- <div class="input"> <input type="text" id="email_input"></input></div>
- <div class="note"></div>
+ <div class="input"> <input id="email_input" type="text"></input></div>
+ <div class="note" id="email_input_note" style="display:none;"><span class="good">Not registered</span></div>
</div>
<div class="input">
<div class="label"> Password </div>
- <div class="input"> <input type="password" id="password_input"></input></div>
+ <div class="input"> <input id="password_input" type="password"></input></div>
</div>
<div class="input">
<div class="label"> Verify </div>
- <div class="input"> <input type="password" id="password_verify_input"></input></div>
- <div class="note"><span class="bad">Enter a password</span></div>
+ <div class="input"> <input id="password_verify_input" type="password"></input></div>
+ <div class="note passwordnote" id="enter_a_password"><span class="bad">Enter a password</span></div>
+ <div class="note passwordnote" id="passwords_different" style="display:none;"><span class="bad">Passwords different</span></div>
+ <div class="note passwordnote" id="password_too_short" style="display:none;"><span class="bad">Password too short</span></div>
+ <div class="note passwordnote" id="password_ok" style="display:none;"><span class="good">Password OK</span></div>
</div>
- <div class="attention_lame" style="display:none;">
- <span id="in_use_email">Email</span> in use, If this email is yours you can <a href="#" id="signin_hint">sign in</a> with it?
+ <div class="attention_lame" style="display:none;" id="emailinuse_message">
+ <span id="in_use_email">Email</span> in use, If this email is yours you can <a href="#">sign in</a> with it?
</div>
</div>
--
GitLab