<?xml version="1.0" encoding="utf-8"?>
<!-- Simple custom MXML Spark TitleWindow component.
The TitleWindowApp application displays this component. 
You cannot run it independently. -->
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               title="Title Window" x="168" y="86">
    <s:layout>
        <s:VerticalLayout />
    </s:layout>
    <fx:Script>
        <![CDATA[
            import mx.managers.PopUpManager;
            import mx.controls.Text;
            
            // A reference to the TextInput control in which to put the result.
            public var loginName:Text;
            
            // Event handler for the OK button.
            private function returnName():void {
                loginName.text="Name entered: " + userName.text;
                PopUpManager.removePopUp(this);
            }
        ]]>
    </fx:Script>
    
    <s:HGroup>
        <s:Label text="Enter Name: "/>
        <s:TextInput id="userName" width="100%"/>
    </s:HGroup>
    
    <s:HGroup>
        <s:Button label="OK" click="returnName();"/>
        <s:Button label="Cancel" click="PopUpManager.removePopUp(this);"/>
    </s:HGroup>
    
</s:TitleWindow>

<?xml version="1.0"?>
<!-- Main application to demonstrate Halo TitleWindow layout container. -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx">
    
    <fx:Script>
        <![CDATA[
            import flash.events.Event;
            import mx.core.IFlexDisplayObject;
            import mx.managers.PopUpManager;
            import spark.components.TitleWindow;
            
            private var point1:Point = new Point();
            
            // Open the TitleWindow container.
            // Cast the return value of the createPopUp() method
            // to SimpleTitleWindowExample, the name of the 
            // component containing the TitleWindow container.
            private function showWindow():void {
                var login:SimpleTitleWindowExample = SimpleTitleWindowExample(PopUpManager.createPopUp(this, SimpleTitleWindowExample , true));
                
                // Calculate position of TitleWindow in Application's coordinates.
                // Position it 25 pixels down and to the right of the Button control.
                point1.x = 0;
                point1.y = 0;                
                point1 = myButton.localToGlobal(point1);
                login.x = point1.x + 25;
                login.y = point1.y + 25;
                
                // Pass a reference to the TextInput control
                // to the TitleWindow container so that the 
                // TitleWindow container can return data to the main application.
                login.loginName = returnedName;
                
                // Add a close handler for the closeButton
                login.addEventListener("close", closeHandler);
            }
            
            private function closeHandler(event:Event):void {
                event.target.removeEventListener("close", closeHandler);
                PopUpManager.removePopUp(event.target as IFlexDisplayObject);
            }
        ]]>
    </fx:Script>
    
    <s:Panel title="TitleWindow Container Example"
             width="75%" height="75%"
             horizontalCenter="0" verticalCenter="0"> 
        <s:VGroup left="10" right="10" top="10" bottom="10">
            <s:Button id="myButton" label="Click to open the TitleWindow container" 
                      click="showWindow();"/>
            
            <mx:Text id="returnedName" text="" width="100%" />
        </s:VGroup>
    </s:Panel>
    
</s:Application>