diff --git a/browserid/static/dialog/controllers/authenticate_controller.js b/browserid/static/dialog/controllers/authenticate_controller.js index 0ac885a44eb7b6e94e05ba03cb905b5b6d2c978e..73f0329c912de4ee8eea155dccf2959b83fd586d 100644 --- a/browserid/static/dialog/controllers/authenticate_controller.js +++ b/browserid/static/dialog/controllers/authenticate_controller.js @@ -37,6 +37,7 @@ (function() { "use strict"; + var ANIMATION_TIME = 250; // XXX this needs changed so that the create account/authenticate flow is // cleaner. Right now we are trying to authenticate on every "enter" press, // this is no good. @@ -54,6 +55,12 @@ }); }, + "#email click" : function(event) { + $(".returning:visible,.newuser:visible").fadeOut(ANIMATION_TIME, function() { + $(".start").fadeIn(); + }); + }, + "#next click": function(event) { var email = $("#email").val(); @@ -61,15 +68,20 @@ // show error message if bad. network.haveEmail(email, function onComplete(registered) { // XXX instead of using jQuery here, think about using CSS animations. - $(".start").hide(); - if(registered) { - $(".returning").slideDown(300, function() { - $("#password").focus(); - }); - } - else { - $(".newuser").slideDown(300); - } + $(".start").fadeOut(function() { + if(registered) { + $(".newuser").fadeOut(ANIMATION_TIME, function() { + $(".returning").fadeIn(ANIMATION_TIME, function() { + $("#password").focus(); + }); + }); + } + else { + $(".returning").fadeOut(ANIMATION_TIME, function() { + $(".newuser").fadeIn(ANIMATION_TIME); + }); + } + }) }); }, diff --git a/browserid/static/dialog/css/popup.css b/browserid/static/dialog/css/popup.css index fe1b205580f21b5de01811817a53d61a94ff5cdf..4b145c1267cfb3015473660d3d4a71e84019b467 100644 --- a/browserid/static/dialog/css/popup.css +++ b/browserid/static/dialog/css/popup.css @@ -174,6 +174,7 @@ h1 { #signIn form ul li { padding: 0 0 10px 0; + min-height: 53px; } #signIn .submit {