<?xml version="1.0" encoding="utf-8"?>
<mx:Application
    xmlns:mx="http://www.adobe.com/2006/mxml"
    xmlns:custom="nl.wietseveenstra.extensions.panel.*"
    xmlns:fx="nl.wietseveenstra.managers.*"
    layout="absolute"
    backgroundGradientColors="[#9DB3BE, #9DB3BE]"
    viewSourceURL="srcview/index.html">
    
    <mx:Style source="assets/css/styles.css"/>
        
    <mx:Label text="ReflectionManager v1.0 explorer" right="10" top="10" 
        fontSize="18" fontWeight="bold" fontFamily="Arial" color="#ffffff"/>
    
    <mx:Canvas id="horizon" width="100%" bottom="0" top="282" backgroundColor="#435C69"/>
        
    <custom:SuperPanel id="sPanel01" title="SuperPanel 01 with Reflection"
        width="400" height="300" x="100" y="100" layout="absolute"
        showControls="true" dragEnabled="true" resizeEnabled="true">
        <mx:Button label="I do nothing" left="10" bottom="10"/>
    </custom:SuperPanel>
    
    <fx:ReflectionManager id="reflection" target="{sPanel01}"
        width="{this.sPanel01.width}"
        height="{(this.sPanel01.height / 100) * this.distance.value}"
        fadeFrom="{this.alphaFrom.value}"
        fadeTo="{this.alphaTo.value}"
        blur="{this.blur.value}"/>
    
    <mx:Panel id="controlPanel" title="Controlpanel" borderColor="#666666"
        width="320" height="250" right="20" bottom="20">
        <mx:Spacer height="10"/>
        <mx:HBox width="100%" height="199" horizontalGap="5">
            <mx:Spacer width="2%"/>
            <mx:Canvas width="24%" backgroundColor="#EFEFEF"
                borderStyle="solid" borderColor="#666666">
                <mx:Label text="Alpha from" horizontalCenter="0" fontWeight="bold" y="2"/>
                <mx:VSlider id="alphaFrom" value="0.3" liveDragging="true" horizontalCenter="0"
                    labels="[0, 0.5, 1]" allowTrackClick="true"
                    minimum="0" maximum="1" showTrackHighlight="true" y="30"
                    change="this.reflection.clearBMData()"/>
            </mx:Canvas>
            
            <mx:Canvas width="24%" backgroundColor="#EFEFEF" 
                borderStyle="solid" borderColor="#666666">
                <mx:Label horizontalCenter="0" text="Alpha to" fontWeight="bold" y="2"/>
                <mx:VSlider id="alphaTo" value="0" liveDragging="true" horizontalCenter="0"
                    labels="[0, 0.5, 1]" allowTrackClick="true"
                    minimum="0" maximum="1" showTrackHighlight="true" y="30"
                    change="this.reflection.clearBMData()"/>
            </mx:Canvas>
            
            <mx:Canvas width="24%" backgroundColor="#EFEFEF"
                borderStyle="solid" borderColor="#666666">
                <mx:Label horizontalCenter="0" text="Distance" fontWeight="bold" y="2"/>
                <mx:VSlider id="distance" value="40" liveDragging="true" horizontalCenter="0"
                    labels="[0%, 50%, 100%]" allowTrackClick="true" snapInterval="1"
                    minimum="1" maximum="100" showTrackHighlight="true" y="30"
                    change="this.reflection.clearBMData()"/>
            </mx:Canvas>
            
            <mx:Canvas width="24%" backgroundColor="#EFEFEF"
                borderStyle="solid" borderColor="#666666">
                <mx:Label horizontalCenter="0" text="Blur" fontWeight="bold" y="2"/>
                <mx:VSlider id="blur" liveDragging="true" horizontalCenter="0"
                    labels="[0, 0.5, 1]" allowTrackClick="true" snapInterval="0.01"
                    minimum="0" maximum="1" value="0.0" showTrackHighlight="true" y="30"
                    change="this.reflection.clearBMData()"/>
            </mx:Canvas>
        </mx:HBox>
    </mx:Panel>
        
</mx:Application>