Aitor Fernández, Freelance Web Design and Programmer, Graphic Design.

In fase beta Data Suffering trying to use REST and Ria technology to provide better Web experience. Screenshots when it ended.

        <?xml version="1.0" encoding="utf-8"?> 
        
        <mx:Application 
            xmlns:mx="http://www.adobe.com/2006/mxml" 
                 layout="vertical" 
                 backgroundGradientColors="[#ffffff, #c0c0c0]" 
                 width="100%" 
                 height="100%"
                 xmlns:fx="com.fusiox.ui.*" > 
        
            <mx:Script> 
            <![CDATA[ 
        
                import mx.rpc.events.ResultEvent; 
                import mx.controls.Alert; 
                import mx.effects.easing.*;
        
                [Bindable] 
                private var _user:XML; 
                
                private function handleLoginClicked(event:MouseEvent):void { 
                    svcSessionsLogin.send({login: loginTI.text, password: passwordTI.text, remember_me: remembermeTI.selected }); 
                } 
                private function handleLoginResult(event:ResultEvent):void {
                    var result:Object = event.result; 
                        if (result == "badlogin") { 
                            Alert.show("Login failed."); 
                        } else { 
                            _user = XML(result); 
                        } 
                } 
            ]]> 
            </mx:Script> 
        
            <mx:HTTPService id="svcSessionsLogin" 
                            url="/sessions/create" 
                            resultFormat="e4x" 
                            useProxy="false" 
                            method="POST" 
                            result="handleLoginResult(event)" />
        
            <mx:Resize 
                 id="expand" 
                 heightFrom="0" 
                 heightTo="180" 
                 easingFunction="{Bounce.easeOut}" 
                 duration="1500" />      
        
            <mx:VBox width="100%" height="50%">
            <mx:VBox id="myStage" width="100%" verticalAlign="bottom" horizontalAlign="center">
            
            <mx:Panel 
                 title="Login - Lite Authenticated"
                 id="loginPanel"
                 horizontalScrollPolicy="off" 
                 verticalScrollPolicy="off"
                 creationCompleteEffect="{expand}" > 
        
                <mx:Form> 
                    <mx:FormItem required="true" label="Login"> 
                        <mx:TextInput id="loginTI"/> 
                    </mx:FormItem> 
                    
                    <mx:FormItem required="true" label="Password"> 
                        <mx:TextInput id="passwordTI" displayAsPassword="true"/> 
                    </mx:FormItem> 
                                
                    <mx:FormItem label=""> 
                        <mx:CheckBox label="Remember me for 14 days" id="remembermeTI"/>
                    </mx:FormItem>
                    
                    <mx:FormItem label=""> 
                        <mx:Button id="submitLoginBtn" label="Login" click="handleLoginClicked(event)" /> 
                    </mx:FormItem> 
                </mx:Form> 
            </mx:Panel> 
        
            </mx:VBox>
            <fx:Reflection id="reflection_login" target="{myStage}" enterFrame="event.target.drawReflection()" width="100%" height="50%" />
            
            <mx:VBox width="100%" horizontalAlign="center">
                <mx:Label id="text" text="{_user == null ? 'Not Logged In' : ('Logged in as ' + _user.login)}" />
            </mx:VBox>
        
            </mx:VBox>
            
            <mx:StringValidator 
                 id="validateLogin" 
                 source="{loginTI}" 
                 property="text" 
                 required="true" 
                 minLength="3" 
                 maxLength="10"  />
        
            <mx:StringValidator 
                 id="validatePassword" 
                 source="{passwordTI}" 
                 property="text" 
                 required="true" 
                 minLength="3" 
                 maxLength="10" />
        
        </mx:Application>