<?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.estimator.views.form.*" 
              xmlns:toolitp="com.afi.estimator.tooltip.*"
              xmlns:ui="com.afi.estimator.views.ui.*"
              creationComplete="init()"
              addedToStage="callTracking()" xmlns:vo="com.afi.estimator.views.vo.*">
    
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
        <s:VerticalLayout />
        <fx:Number id="padding">20</fx:Number>
        <s:RadioButtonGroup id="genderGroup" selectedValue="{estimatorVO.gender}"/>
        <s:RadioButtonGroup id="smokingGroup" selectedValue="{estimatorVO.usedNicotine}"/>
        <s:RadioButtonGroup id="waiverGroup" selectedValue="{estimatorVO.waiverPremium}"/>
        <vo:EstimatorVO id="estimatorVO" dateOfBirth="{dateOfBirth.selectedDate}"
                                         gender="{genderGroup.selectedValue}"
                                         usedNicotine="{smokingGroup.selectedValue}"
                                         waiverPremium="{waiverGroup.selectedValue}"/>
    </fx:Declarations>
    
    <fx:Script>
        <![CDATA[
            import com.afi.estimator.common.DateUtil;
            import com.afi.estimator.log.*;
            import com.afi.estimator.model.EstimatorModel;
            import com.afi.estimator.model.PagesModel;
            import com.afi.estimator.model.TextModel;
            import com.afi.estimator.style.buttons.GreenButton;
            import com.afi.estimator.views.View;
            import com.afi.estimator.views.paging.FormScroller;
            import com.afi.estimator.views.tooltip.*;
            import com.afi.estimator.views.ui.*;
            import com.tracking.TrackingManager;
            
            import mx.collections.ArrayCollection;
            import mx.controls.ToolTip;
            import mx.events.ToolTipEvent;
            import mx.managers.PopUpManager;
            import mx.managers.ToolTipManager;
            
            
            [Bindable]private var trueString:String = "true";
            
            [Bindable]private var falseString:String = "false";
            
            [Bindable]public var pageName:String = "calculate";
            
            private var tt:AdvancedToolTip;
            
            public var view:View;
            
            private function callTracking():void{
                TrackingManager.trackOmniture("Calculate Your Deferred Annuity");
            }
            
            private function init():void {
                view = this.parentApplication.getElementAt(0) as View;
                view.head.printVisibility = false;
                
                if(EstimatorModel.instance){
                    estimatorVO = EstimatorModel.instance.estimatorVO;
                }
                View.instance.nextprevious.visible = true;
            }
            
            /**
             * for now jst checking if user has entered values or not.
             */
            private function valid():Boolean
            {
                //DOb and age validation
                  if(dateOfBirth.selectedDate ==null){
                    e_age.visible = true;
                    e_age.label = TextModel.get(pageName).ageBlankError;
                    return false;
                  }  else{
                      var age:int = new Date().getFullYear() - dateOfBirth.selectedDate.getFullYear();
                      if(age >17 && age < 61){
                          e_age.visible = false;
                      } else{
                          e_age.visible = true;
                          e_age.label = TextModel.get(pageName).minAgeError;
                          return false;
                      }
                  }
                  
                  //gender validation
                  if(genderGroup.selectedValue == null){
                      e_gender.visible = true;
                      e_gender.label = TextModel.get(pageName).genderError;
                      return false;
                  } else{
                      e_gender.visible = false;
                  }
                  
                  //Nictonie field validation
                  if(smokingGroup.selectedValue == null){
                      e_nicotine.visible = true;
                      e_nicotine.label = TextModel.get(pageName).usedNicotineError;
                      return false;
                  } else{
                      e_nicotine.visible = false;
                  }
                  
                  //waiver validation
                  if(waiverGroup.enabled && waiverGroup.selectedValue == null){
                      e_waiver.visible = true;
                      e_waiver.label = TextModel.get(pageName).waiverPremiumError;
                      return false;
                  } else{
                      e_waiver.visible = false;
                  }
                return true;
            }
            
            override public function next():void
            {
                if(valid()) {
                    EstimatorModel.instance = new EstimatorModel(estimatorVO);
                    //estimatorModel.estimatorVO = estimatorVO;
                    EstimatorModel.instance.calculatePremiums();
                    FormScroller.instance.next();
                    
                } 
            }
            
            private function mouseOver(e:MouseEvent, text:String):void {
                if(waiverImg.enabled){
                    tt = PopUpManager.createPopUp(root as DisplayObject, BlueToolTip,
                        false) as AdvancedToolTip;
                    tt.label = text;
                    tt.anchor = e.target as DisplayObject;
                    tt.xAlignment = AdvancedToolTip.X_ALIGN_RIGHT;
                    tt.yAlignment = AdvancedToolTip.Y_ALIGN_CENTER;
                    
                    tt.init();
                }
                
            }
            
            private function mouseOut():void
            {
                if(tt)
                    tt.remove();
            }
            
            private function disableWaiver():void{
                if((DateUtil.calculateAge(dateOfBirth.selectedDate)) > 55){
                    waiverGroup.enabled = false; 
                    waiverImg.enabled = false;
                } else{
                    waiverGroup.enabled = true; 
                    waiverImg.enabled = true;
                }
                
            }
            
        ]]>
    </fx:Script>
    
    <s:Label id="formTitle" text="{TextModel.get(pageName).title}" styleName="formTitle" /> 
    
    <s:Group width="500">
        
        <ui:Formbackground width="100%" height="100%" />
        
        <s:VGroup horizontalAlign="center">
            
                <s:VGroup paddingBottom="{padding}" paddingTop="{padding}" paddingRight="{padding}" paddingLeft="{padding}" horizontalAlign="center">
                    
                    
                    <mx:Spacer height="10" />
                    
                    <!-- date of birth-->
                    <s:HGroup verticalAlign="middle" >
                        <ui:ErrorAlert id="e_age"/>
                        <s:Label width="210" accessibilityEnabled="false" text="{TextModel.get(pageName).field1}" textAlign="left" paddingLeft="0" paddingRight="100"/>
                        <mx:DateField id="dateOfBirth" width="100" selectedDate="{estimatorVO.dateOfBirth}" change="disableWaiver()"/>
                        <mx:Image accessibilityEnabled="false" source="@Embed('/com/afi/estimator/assets/images/tooltip-icon.png')" mouseOver="mouseOver(event, TextModel.get(pageName).tooltip1)" mouseOut="mouseOut()" />
                    </s:HGroup>
                    
                    <mx:Spacer height="10" />
                    
                    <!-- Gender-->
                    <s:HGroup verticalAlign="middle" >
                        <ui:ErrorAlert id="e_gender" />
                        <s:Label accessibilityEnabled="false" text="{TextModel.get(pageName).field2}" textAlign="left" width="200" paddingLeft="6"/>
                        <s:HGroup paddingLeft="20">
                            <s:RadioButton label="{TextModel.get(pageName).male}" value="{trueString}" groupName="genderGroup"
                                           skinClass="com.afi.estimator.style.forms.AFICheckbox"/>
                            
                            <s:RadioButton label="{TextModel.get(pageName).female}" value="{falseString}" groupName="genderGroup"
                                               skinClass="com.afi.estimator.style.forms.AFICheckbox"/>
                        </s:HGroup>
                    </s:HGroup>
                    
                    <mx:Spacer height="24" />
                    
                    <!-- nicotine-->
                    <s:HGroup verticalAlign="middle">
                            <ui:ErrorAlert id="e_nicotine" />
                            <s:Label accessibilityEnabled="false" width="200" text="{TextModel.get(pageName).field3}" textAlign="left" paddingLeft="6"/>
                        
                        <s:HGroup paddingLeft="22">
                            <s:RadioButton label="{TextModel.get(pageName).yes}"
                                           value="{trueString}"
                                           groupName="smokingGroup"
                                           skinClass="com.afi.estimator.style.forms.AFICheckbox"/>
                            
                            <s:RadioButton label="{TextModel.get(pageName).no}"
                                           value="{falseString}"
                                           groupName="smokingGroup"
                                           skinClass="com.afi.estimator.style.forms.AFICheckbox"/>
                            <mx:Image  accessibilityEnabled="false" source="@Embed('/com/afi/estimator/assets/images/tooltip-icon.png')" 
                                       mouseOver="mouseOver(event, TextModel.get(pageName).tooltip2)" mouseOut="mouseOut()"  />
                        </s:HGroup>
                            
                    </s:HGroup>
                    
                    <mx:Spacer height="10" />
                    
                    <!-- waiver premium-->
                    <s:HGroup  verticalAlign="middle">
                        <ui:ErrorAlert id="e_waiver" />
                        <s:Label accessibilityEnabled="false" width="200" text="{TextModel.get(pageName).field4}" id="testLabel" textAlign="left" paddingLeft="10"/>
                        
                        <s:HGroup paddingLeft="24">
                            <s:RadioButton label="{TextModel.get(pageName).yes}"
                                           value="{trueString}"
                                           groupName="waiverGroup"
                                           skinClass="com.afi.estimator.style.forms.AFICheckbox"/>
                            
                            <s:RadioButton label="{TextModel.get(pageName).no}"
                                           value="{falseString}"
                                           groupName="waiverGroup"
                                           skinClass="com.afi.estimator.style.forms.AFICheckbox"/>
                        </s:HGroup>
                        <mx:Image id="waiverImg" accessibilityEnabled="false" source="@Embed('/com/afi/estimator/assets/images/tooltip-icon.png')" mouseOver="mouseOver(event, TextModel.get(pageName).tooltip3)" mouseOut="mouseOut()"  />
                        
                    </s:HGroup>
                    
                </s:VGroup>
                
        </s:VGroup>
    </s:Group>
    
    <mx:Spacer height="10" />
    
    <s:VGroup width="500" paddingLeft="10">
        <s:Label text="{TextModel.get(pageName).footer}" width="500" textAlign="left"/> 
    </s:VGroup>
</ui:TitleForm>