<?xml version="1.0" encoding="utf-8"?>

<!--

    ADOBE SYSTEMS INCORPORATED
    Copyright 2008 Adobe Systems Incorporated
    All Rights Reserved.

    NOTICE: Adobe permits you to use, modify, and distribute this file
    in accordance with the terms of the license agreement accompanying it.

-->

<!--- The default wireframe skin class for the Spark TitleWindow component. 
        Skin classes in the wireframe package are useful for using as a simple base for a custom skin.
        
     @see spark.components.TitleWindow

      @langversion 3.0
      @playerversion Flash 10
      @playerversion AIR 1.5
      @productversion Flex 4
-->
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" 
    alpha.disabled="0.5" minWidth="76" minHeight="76">

    <fx:Metadata>
        /** 
         * @copy spark.skins.spark.ApplicationSkin#hostComponent
         */
        [HostComponent("spark.components.TitleWindow")]
    </fx:Metadata> 
    
    <s:states>
        <s:State name="normal" />
        <s:State name="inactive" stateGroups="inactiveGroup" />
        <s:State name="disabled" />
        <s:State name="normalWithControlBar" stateGroups="withControls" />
        <s:State name="inactiveWithControlBar" stateGroups="withControls, inactiveGroup" />
        <s:State name="disabledWithControlBar" stateGroups="withControls" />
    </s:states>
    
    <!-- drop shadow can't be hittable so it stays sibling of other graphics -->
    <!--- @private -->
    <s:RectangularDropShadow id="dropShadow" blurX="15" blurY="15" alpha="0.18"
                             distance="11"  distance.inactiveGroup="7"
                             angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/>
    
    <!-- layer 1: border -->
    <s:Rect left="0" right="0" top="0" bottom="0">
        <s:stroke>
            <s:SolidColorStroke color="#707070" weight="1" />
        </s:stroke>
    </s:Rect>

    <!-- layer 2: background fill -->
    <s:Rect left="1" top="1" right="1" bottom="1">
        <s:fill>
            <s:SolidColor color="#FFFFFF" />
        </s:fill>
    </s:Rect>
    
    <!-- layer 3: contents -->
    <s:Group left="1" right="1" top="1" bottom="1" >
        <s:layout>
            <s:VerticalLayout gap="0" horizontalAlign="justify" />
        </s:layout>

        <s:Group>
            <!-- layer 0: title bar fill -->
            <s:Rect left="0" right="0" top="0" bottom="1">
               <s:fill> 
                    <s:SolidColor color="#EEEEEE" />
               </s:fill>
            </s:Rect>
            
            <!-- layer 1: title bar highlight -->
            <s:Rect left="0" right="0" top="0" bottom="0">
               <s:stroke>
                    <s:LinearGradientStroke rotation="90" weight="1">
                        <s:GradientEntry color="#EEEEEE" />
                        <s:GradientEntry color="#EEEEEE" />
                    </s:LinearGradientStroke>
               </s:stroke>
            </s:Rect>

            <!-- layer 2: title bar divider -->
            <s:Rect left="0" right="0" bottom="0" height="1">
                <s:fill>
                    <s:SolidColor color="#DDDDDD" />
                </s:fill>
            </s:Rect>
            
            <!-- layer 3: text -->
            <!--- @copy spark.components.Panel#titleDisplay -->
            <s:Label id="titleDisplay" maxDisplayedLines="1"
                     left="9" right="24" top="1" minHeight="23"
                     verticalAlign="middle" fontWeight="bold">
            </s:Label>
            
            <!-- layer 4: moveArea -->
            <!--- @copy spark.components.TitleWindow#moveArea -->
            <s:Group id="moveArea" left="0" right="0" top="0" bottom="0" />
            
            <!-- close button -->
            <!--- @copy spark.components.TitleWindow#closeButton -->
            <s:Button id="closeButton" skinClass="spark.skins.wireframe.TitleWindowCloseButtonSkin"
                      width="15" height="15" right="2" top="3" />
        </s:Group>

        <!--- @copy spark.components.SkinnableContainer#contentGroup -->
        <s:Group id="contentGroup" width="100%" height="100%" minWidth="0" minHeight="0">
        </s:Group>

        <!--- @private -->
        <s:Group id="bottomGroup" minWidth="0" minHeight="0"
                 includeIn="withControls" >
            
            <!-- layer 0: control bar background -->
            <s:Rect left="0" right="0" bottom="0" top="1" >
                <s:fill>
                    <s:SolidColor color="#EEEEEE" />
                </s:fill>
            </s:Rect>
    
            <!-- layer 1: control bar divider line -->
            <s:Rect left="0" right="0" top="0" height="1" >
                <s:fill>
                    <s:SolidColor color="#DDDDDD" />
                </s:fill>
            </s:Rect>

            <!-- layer 2: control bar -->
            <!--- @copy spark.components.Panel#controlBarGroup -->
            <s:Group id="controlBarGroup" left="0" right="0" top="1" bottom="1" minWidth="0" minHeight="0">
                <s:layout>
                    <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="7" paddingBottom="7" gap="10" />
                </s:layout>
            </s:Group>
        </s:Group>
    </s:Group>
</s:Skin>