<?xml version="1.0" encoding="utf-8"?>
  <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="fillDG()"
          xmlns:lg="comps.*" currentState="loginScreen">
          <mx:states>
                  <mx:State name="loginScreen">
                          <mx:SetProperty target="{loginPanel}" name="x"/>
                          <mx:SetProperty target="{loginPanel}" name="y"/>
                          <mx:RemoveChild target="{form1}"/>
                          <mx:RemoveChild target="{button1}"/>
                          <mx:RemoveChild target="{button2}"/>
                          <mx:RemoveChild target="{userDB}"/>
                          <mx:SetStyle target="{loginPanel}" name="horizontalCenter" value="0"/>
                          <mx:SetStyle target="{loginPanel}" name="verticalCenter" value="0"/>
                  </mx:State>
                  <mx:State name="loggedIn">
                          <mx:RemoveChild target="{loginPanel}"/>
                  </mx:State>
          </mx:states>
          <mx:Script>
                  <![CDATA[
                          import mx.events.ListEvent;
                          import mx.controls.Alert;
                          
                          [Bindable]
                          private var users:Array;
                          private var gateway:NetConnection;
                          private var gatewayURL:String = "http://localhost.nl/amfphp/gateway.php"
                  
                          private function setConnection() : void {
                                  gateway = new NetConnection;
                                  gateway.connect(gatewayURL);
                          }
                          private function retrieveContent(event:Event) :  void {
                                  setConnection();
                                  var responder:Responder = new Responder(returnSucces, returnFault);
                                  gateway.call("TestDB.retrieveAll", responder);
                          }
                          private function returnSucces(obj:Object) : void {
                                  for each (var i:int in obj) {
                                          trace(obj);
                                          userField.text = obj.serverInfo.initialData[0][1];
                                          passwordField.text = obj.serverInfo.initialData[0][2];
                                  }
                          }
                          private function returnFault(obj:Object) : void {
                                  Alert.show("Error has accured");
                          }
                          private function addNew() : void {
                                  setConnection();
                                  var responder:Responder = new Responder(returnNew, returnFault);
                                  gateway.call("TestDB.addNew", responder, userField.text, passwordField.text, fnameField.text, lnameField.text);
                          }
                          private function returnNew(obj:Object) : void {
                                  Alert.show("New item added to database");
                                  fillDG();
                          }
                          private function fillDG() : void {
                                  setConnection();
                                  var responder:Responder = new Responder(returnDGData, returnFault);
                                  gateway.call("TestDB.retrieveArray", responder);
                          }
                          private function returnDGData(result:Array) : void {
                                  userDB.dataProvider = result;
                          }
                          private function alterUser(event:ListEvent) : void {
                                  userField.text = event.itemRenderer.data.username;
                                  passwordField.text = event.itemRenderer.data.password;
                                  fnameField.text = event.itemRenderer.data.fname;
                                  lnameField.text = event.itemRenderer.data.lname;
                          }
                          private function removeContent() : void {
                                  setConnection();
                                  var responder:Responder = new Responder(refreshList, returnFault);
                                  gateway.call("TestDB.removeUser", responder, userField.text);
                          }
                          private function refreshList(obj:Object) : void {
                                  Alert.show("Data is removed");
                                  fillDG();
                          }
                          private function handleLogin(event:Event) : void {
                                  loginPanel.doLogin(event);
                                  if(loginPanel.valid) {
                                          currentState="loggedIn";
                                  } 
                          }
                          
                  ]]>
          </mx:Script>
          <lg:Login id="loginPanel" x="171" y="308" click="handleLogin(event)"/>
          <mx:Form x="199.5" y="86" width="283" backgroundColor="#000000" cornerRadius="20" borderStyle="solid" id="form1">
                  <mx:FormItem label="login:" width="100%" color="#FFFFFF" fontSize="12">
                          <mx:TextInput id="userField" width="100%" color="#000000"/>
                  </mx:FormItem>
                  <mx:FormItem label="password:" width="100%" color="#FFFFFF" fontSize="12" borderStyle="none">
                          <mx:TextInput id="passwordField" width="100%" color="#000000"/>
                  </mx:FormItem>
                  <mx:FormItem label="first name:" width="100%" color="#FFFFFF" fontSize="12">
                          <mx:TextInput id="fnameField" width="100%" color="#000000"/>
                  </mx:FormItem>
                  <mx:FormItem label="last name:" width="100%" color="#FFFFFF" fontSize="12">
                          <mx:TextInput id="lnameField" width="100%" color="#000000"/>
                  </mx:FormItem>        
          </mx:Form>
          <mx:Button x="350" y="246" label="delete" click="removeContent()" id="button2"/>
          <mx:Button x="257" y="246" label="add new" click="addNew()" id="button1"/>
          
          <mx:DataGrid x="502" y="86" id="userDB" change="alterUser(event)">
                  <mx:columns>
                          <mx:DataGridColumn headerText="Username" dataField="username"/>
                          <mx:DataGridColumn headerText="Password" dataField="password"/>
                          <mx:DataGridColumn headerText="First Name" dataField="fname"/>
                          <mx:DataGridColumn headerText="Last Name" dataField="lname"/>
                  </mx:columns>
          </mx:DataGrid>
  </mx:Application>