diff --git a/browserid/static/dialog/controllers/authenticate_controller.js b/browserid/static/dialog/controllers/authenticate_controller.js index 2108a9cb53308bc0fad0de298d6b6035a36fa0f8..d807cbebe217b1982912648a745d7cd42f2e2940 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 }); }());