<?xml version="1.0" encoding="utf-8"?>
<s:Application
xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" viewSourceURL="srcview/index.html">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
private function submitHandler(event:MouseEvent):void
{
Alert.show("You are now logged in, go do ... whatever.","Login Successful", Alert.OK);
}
private function forgotPasswordHandler(event:MouseEvent):void
{
Alert.show("Check yo email, we sent your credentials there.","Email Sent", Alert.OK);
}
private function registerHandler(event:MouseEvent):void
{
Alert.show("You are now registered, have fun and don't do anything I would do.","Registered Homie!", Alert.OK);
}
]]>
</fx:Script>
<s:layout>
<s:VerticalLayout paddingTop="10" paddingLeft="10"/>
</s:layout>
<s:VGroup id="inputForm" width="400">
<s:SimpleText id="titleText" fontWeight="bold" fontSize="16" paddingBottom="10"
text="LOGIN"
text.STATE_REGISTER="REGISTER"
text.STATE_FORGOT_PASSWORD="FORGOT PASSWORD"/>
<s:HGroup includeIn="STATE_REGISTER" width="100%">
<s:SimpleText text="First Name:"/>
<s:TextInput id="firstName" width="100%"/>
</s:HGroup>
<s:HGroup includeIn="STATE_REGISTER" width="100%">
<s:SimpleText text="Last Name:"/>
<s:TextInput id="lastName" width="100%"/>
</s:HGroup>
<s:HGroup width="100%">
<s:SimpleText text="Email:"/>
<s:TextInput id="emailAddress" width="100%"/>
</s:HGroup>
<s:HGroup width="100%" includeIn="STATE_LOGIN,STATE_REGISTER">
<s:SimpleText text="Password:"/>
<s:TextInput id="password" displayAsPassword="true" width="100%"/>
</s:HGroup>
<s:HGroup includeIn="STATE_REGISTER" width="100%">
<s:SimpleText text="Confirm Password:"/>
<s:TextInput id="confirmPassword" displayAsPassword="true" width="100%"/>
</s:HGroup>
<s:HGroup width="100%">
<s:Button id="submitBtn"
label="SUBMIT"
click.STATE_LOGIN="submitHandler(event)"
click.STATE_REGISTER="registerHandler(event)"
click.STATE_FORGOT_PASSWORD="forgotPasswordHandler(event)"/>
<s:Button id="registerBtn"
label="REGISTER"
label.STATE_FORGOT_PASSWORD="BACK TO LOGIN"
label.STATE_REGISTER="BACK TO LOGIN"
click="currentState='STATE_REGISTER'"
click.STATE_REGISTER="currentState='STATE_LOGIN'"
click.STATE_FORGOT_PASSWORD="currentState='STATE_LOGIN'"/>
<s:Button id="forgotBtn"
label="FORGOT PASSWORD"
click="currentState='STATE_FORGOT_PASSWORD'"
includeIn="STATE_LOGIN"/>
</s:HGroup>
</s:VGroup>
<s:states>
<s:State name="STATE_LOGIN"/>
<s:State name="STATE_REGISTER"/>
<s:State name="STATE_FORGOT_PASSWORD"/>
</s:states>
<s:transitions>
<s:Transition fromState="*" toState="*">
<s:Fade duration="400" target="{inputForm}"/>
</s:Transition>
</s:transitions>
</s:Application>