<?xml version="1.0" encoding="utf-8"?>
<ui:TitleForm xmlns:fx="http://ns.adobe.com/mxml/2009" 
              xmlns:s="library://ns.adobe.com/flex/spark" 
              xmlns:mx="library://ns.adobe.com/flex/mx" 
              xmlns:form="com.afi.annuities.views.form.*" 
              xmlns:ui="com.afi.annuities.views.ui.*" 
              creationComplete="init()" 
              xmlns:sharewithagent="com.sharewithagent.*" 
              addedToStage="callTracking()">
    
    <fx:Script>
        <![CDATA[
            import com.afi.annuities.style.buttons.WhiteButton;
            import com.sharewithagent.ShareMain;
            import com.tracking.TrackingManager;
            private function callTracking():void{
                TrackingManager.trackOmniture("Share With An Agent");
            }
            
            import com.afi.annuities.model.TextModel;
            import com.afi.annuities.style.buttons.GreenButton;
            import com.afi.annuities.model.PagesModel;
            import com.afi.annuities.views.paging.FormScroller;
            import com.afi.annuities.views.View;
            
            import mx.managers.PopUpManager;
            
            [Bindable]private var pageName:String = 'sharePage';
            
            [Bindable]private var padding:Number = 15;
            
            private function init():void {
                if(!PagesModel.shareMain) {
                    var shareMain:ShareMain = new ShareMain();
                    PagesModel.shareMain = shareMain;
                }
                View.instance.nextprevious.currentState='prev';
                PagesModel.shareMain.api_key = root.loaderInfo.parameters.api_key;
                container.addElement(PagesModel.shareMain);
            }
            
        ]]>
    </fx:Script>
    
    <s:Label id="formTitle" text="{TextModel.get(pageName).title}" styleName="formTitle" paddingBottom="60" />
    
    <s:Group width="848" height="100%">
        <s:Group width="220" height="60" left="20" top="-60">
            <s:Rect topLeftRadiusX="10"
                    topRightRadiusX="10"
                    top="0"
                    left="0"
                    right="0"
                    bottom="0"
                    alpha="0.8">
                <s:fill>
                    <s:SolidColor color="#f5f5f5" />
                </s:fill>
                
            </s:Rect>
            <s:VGroup width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
                <s:Button skinClass="com.afi.annuities.style.buttons.DisabledTabButton" alpha="0.8" label="{TextModel.get(pageName).preferredAgent}" width="200" />
            </s:VGroup>
        </s:Group>
        <s:Group width="190" height="60" left="238" top="-60">
            
            <s:Rect topLeftRadiusX="10"
                    topRightRadiusX="10"
                    top="0"
                    left="0"
                    right="0"
                    bottom="0"
                    alpha="0.8">
                <s:fill>
                    <s:SolidColor color="#FFFFFF" />
                </s:fill>
            </s:Rect>
            
            <s:VGroup width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
                <s:Button skinClass="com.afi.annuities.style.buttons.TabButton" label="{TextModel.get(pageName).otherOptions}" width="170" />
            </s:VGroup>
            
        </s:Group>
        <ui:TabFormbackground width="100%" height="100%" />
        <s:VGroup paddingBottom="{padding}" paddingLeft="{padding}" paddingRight="{padding}" paddingTop="{padding}">

        <s:Group >
            <s:Rect radiusX="10" width="818" height="100%" top="0">
                <s:fill>
                    <s:SolidColor color="#3186BC" />
                </s:fill>
                <s:filters>
                    <s:GlowFilter inner="true" color="#1D5C8E" blurX="50" blurY="50" /> 
                </s:filters>
                <s:stroke>
                    <s:SolidColorStroke color="#EBEBE9" />
                </s:stroke>
            </s:Rect>
            <s:VGroup id="container">
            </s:VGroup>
        </s:Group>
        </s:VGroup>
        
    </s:Group>
    
</ui:TitleForm>