From 092e0f4edb1c8b781047eff2548e46653e0eaf79 Mon Sep 17 00:00:00 2001 From: Shane Tomlinson <stomlinson@mozilla.com> Date: Thu, 29 Sep 2011 09:56:53 +0100 Subject: [PATCH] A big refactor of the authenticate controller so each function is more cohesive. Removed some duplicate code. Made it so you have to change the email input for the password field to go away and a check is reforced on whether the email address is registered. --- .../controllers/authenticate_controller.js | 251 ++++++++++-------- 1 file changed, 135 insertions(+), 116 deletions(-) diff --git a/browserid/static/dialog/controllers/authenticate_controller.js b/browserid/static/dialog/controllers/authenticate_controller.js index 2108a9cb5..d807cbebe 100644 --- a/browserid/static/dialog/controllers/authenticate_controller.js +++ b/browserid/static/dialog/controllers/authenticate_controller.js @@ -40,146 +40,165 @@ var ANIMATION_TIME = 250, identities = BrowserIDIdentities; - function animateSwap(fadeOutSelector, fadeInSelector, callback) { - $(fadeOutSelector).fadeOut(ANIMATION_TIME, function() { - $(fadeInSelector).fadeIn(ANIMATION_TIME, callback); + function checkEmail() { + var email = $("#email").val(), + self = this; + + if(!email) { + // XXX error screen + return; + } + + // XXX verify email length/format here + // show error message if bad. + identities.emailRegistered(email, function onComplete(registered) { + if(registered) { + enterPasswordState.call(self); + } + else { + createUserState.call(self); + } }); } - PageController.extend("Authenticate", {}, { - init: function() { - this._super({ - bodyTemplate: "authenticate.ejs", - bodyVars: { - sitename: identities.getOrigin(), - siteicon: '/i/times.gif' - } - }); - this.submitAction = "checkEmail"; - }, + function createUser() { + var self=this, + email = $("#email").val(); + + if(!email) { + // XXX error screen + return; + } - "#email click" : function(el, event) { - if (!el.is(":disabled")) { - this.submitAction = "checkEmail"; - animateSwap(".returning:visible,.newuser:visible", ".start"); + identities.createUser(email, function(keypair) { + if(keypair) { + self.close("user_staged", { + email: email, + keypair: keypair + }); } - }, + else { + // XXX can't register this email address. + } + }, self.getErrorDialog(BrowserIDErrors.createAccount)); + } - "#forgotPassword click": function(el, event) { - event.preventDefault(); + function authenticate() { + var email = $("#email").val(), + pass = $("#password").val(), + self = this; - this.submitAction = "resetPassword"; - $("#email").attr("disabled", "disabled"); + if(!(email && pass)) { + // XXX error screen + return; + } - animateSwap(".returning", ".forgot"); - }, + identities.authenticateAndSync(email, pass, + function onAuthenticate(authenticated) { + if (authenticated) { + self.doWait(BrowserIDWait.authentication); + } + else { + // XXX error screen + } + }, + function onComplete(authenticated) { + if (authenticated) { + self.close("authenticated"); + } else { + // XXX error screen. + } + }, + self.getErrorDialog(BrowserIDErrors.authentication) + ); - '#cancel_forgot_password click': function(el, event) { - event.preventDefault(); + } - this.submitAction = "authenticate"; - $("#email").removeAttr("disabled"); - animateSwap(".forgot", ".returning", function() { - $("#password").focus(); + function resetPassword() { + var email = $("#email").val(); + var self=this; + identities.requestPasswordReset(email, function() { + self.close("reset_password", { + email: email }); - }, + }, function() { + // XXX TODO error screen! + }); + } - submit: function() { - this[this.submitAction](); - }, + function animateSwap(fadeOutSelector, fadeInSelector, callback) { + // XXX instead of using jQuery here, think about using CSS animations. + $(fadeOutSelector).fadeOut(ANIMATION_TIME, function() { + $(fadeInSelector).fadeIn(ANIMATION_TIME, callback); + }); + } - checkEmail: function() { - var email = $("#email").val(), - self = this; + function cancelEvent(event) { + if (event) { + event.preventDefault(); + } + } - if(!email) { - // XXX error screen - return; - } + function enterEmailState(el, event) { + if(event && event.which === 13) { + // Enter key, do nothing + return; + } - // XXX verify email length/format here - // show error message if bad. - identities.emailRegistered(email, function onComplete(registered) { - // XXX instead of using jQuery here, think about using CSS animations. - $(".start").fadeOut(function() { - if(registered) { - self.submitAction = "authenticate"; - animateSwap(".newuser", ".returning", function() { - $("#password").focus(); - }); - } - else { - self.submitAction = "createUser"; - animateSwap(".returning", ".newuser"); - } - }); - }); - }, + if (!el.is(":disabled")) { + this.submit = checkEmail; + animateSwap(".returning:visible,.newuser:visible,.forgot:visible", ".start"); + } + } - createUser: function() { - var self=this, - email = $("#email").val(); + function enterPasswordState(el, event) { + cancelEvent(event); - if(!email) { - // XXX error screen - return; - } + this.submit = authenticate; + animateSwap(".start:visible,.newuser:visible,.forgot:visible", ".returning", function() { + $("#password").focus(); + }); + } - identities.createUser(email, function(keypair) { - if(keypair) { - self.close("user_staged", { - email: email, - keypair: keypair - }); - } - else { - // XXX can't register this email address. - } - }, self.getErrorDialog(BrowserIDErrors.createAccount)); - }, + function forgotPasswordState(el, event) { + cancelEvent(event); - authenticate: function() { - var email = $("#email").val(), - pass = $("#password").val(), - self = this; + this.submit = resetPassword; + $("#email").attr("disabled", "disabled"); - if(!(email && pass)) { - // XXX error screen - return; - } + animateSwap(".start:visible,.newuser:visible,.returning:visible", ".forgot"); + } - identities.authenticateAndSync(email, pass, - function onAuthenticate(authenticated) { - if (authenticated) { - self.doWait(BrowserIDWait.authentication); - } - else { - // XXX error screen - } - }, - function onComplete(authenticated) { - if (authenticated) { - self.close("authenticated"); - } else { - // XXX error screen. - } - }, - self.getErrorDialog(BrowserIDErrors.authentication) - ); + function cancelForgotPassword(el, event) { + cancelEvent(event); - }, + $("#email").removeAttr("disabled"); + enterPasswordState.call(this); + } - resetPassword: function() { - var email = $("#email").val(); - var me=this; - identities.requestPasswordReset(email, function() { - me.close("reset_password", { - email: email - }); - }, function() { - // XXX TODO error screen! + function createUserState(el, event) { + cancelEvent(event); + + this.submit = createUser; + animateSwap(".start:visible,.returning:visible,.forgot:visible", ".newuser"); + } + + + PageController.extend("Authenticate", {}, { + init: function() { + this._super({ + bodyTemplate: "authenticate.ejs", + bodyVars: { + sitename: identities.getOrigin(), + siteicon: '/i/times.gif' + } }); - } + this.submit = checkEmail; + }, + + "#email keyup": enterEmailState, + "#forgotPassword click": forgotPasswordState, + '#cancel_forgot_password click': cancelForgotPassword }); }()); -- GitLab