I want to replace the standard Magento login screen with a popover box that appears when the user clicks on the Login button at the top of the page. The box should scroll into view much like our current currency box does (go to luckyskins.com and click on the flag at the top of the page for a demo). When they click on login, a box will appear (see the screenshot below titled "Log in.jpg") and have a field for Email and Password as well as a login button. It will also have a link titled "Create A New Account". If they fill in their email address and password and click on the login button, they will then be logged in. However if they click on the "Create A new Account" link the box will extend and a few new fields should dynamically appear (see screenshot below titled "Create Account.jpg"). The page should not have to refresh at any point during this process, unless they successfully login or successfully create a new account. The new fields should be First Name, Last Name, Confirm Password, and a Subscribe to Newsletter checkbox (the checkbox should be checked by default). The Login button will change to a Create Account button. If the user successfully creates an account they will automatically be logged in. If the user leaves a field blank they will receive an error (see screenshot below titled "Create Account-Error.jpg" The text of the field will change color and the field itself will also change color. At the bottom of the box an error message will appear that says "Please Fix Highlighted Fields".
If the user clicks outside of the box at anytime, it should disappear, just like our current currency box. It should also reset. For example, if they were in the middle of creating an account, and they click outside, it should reset so that if they clicked on the login button at the top of the page again, it would bring up the initial login box.
I will supply any needed art.