<?xml version="1.0" encoding="utf-8"?>
<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" minWidth="955" minHeight="600"
               creationComplete="getCam();" viewSourceURL="http://scanfer.la/labs/srcview/index.html">
    
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->        
        
        <mx:Fade id="flashFX" duration="550" /> 
        
        <s:Parallel id="discardPhoto">
            <s:children>
                <mx:Zoom
                    duration="350" 
                    zoomWidthFrom="1.0"                                   
                    zoomWidthTo="0.01"                                   
                    zoomHeightFrom="1.0"                                   
                    zoomHeightTo="0.01"                                   
                    target="{previewBox}"/>
                <mx:Fade duration="350"/>
            </s:children>
        </s:Parallel>        
        
    </fx:Declarations>
    
    <fx:Script source="cam.as"/>
    
    
    <s:VGroup horizontalCenter="0" verticalCenter="0">
        
        <s:Group id="videoArea">
            
            <mx:VideoDisplay id="theCam" width="533" height="400"/>
            
            <s:Group id="previewBox" visible="false" hideEffect="{discardPhoto}">
                
                <mx:Image id="preview" width="100%" height="100%"/>    
                
                <s:BorderContainer 
                    id="flashLight" 
                    width="100%" 
                    height="100%" 
                    hideEffect="{flashFX}"  
                    backgroundColor="white" 
                    backgroundAlpha="0.8"/>
                
            </s:Group>        
            
            
            <s:BorderContainer 
                bottom="0" 
                width="100%" 
                backgroundColor="black" 
                backgroundAlpha="0.4" 
                borderColor="black" 
                height="55">
                
                <s:Button
                    id="trigger"                    
                    horizontalCenter="0" 
                    verticalCenter="0" 
                    height="35"                     
                    click="takePicture();"                                                          
                    label="Take a picture!"
                    chromeColor="#33abe9" 
                    color="#ffffff"/>
                
            </s:BorderContainer>
            
        </s:Group>
        
        <s:HGroup verticalAlign="middle" horizontalAlign="right" width="100%">
            <mx:LinkButton label="Cancel"/>
            <s:Button 
                id="savePic" 
                label="Save picture" 
                height="30" 
                enabled="false" 
                toolTip="Make it your profile image!"
                click="savePicture();"
                /> 
        </s:HGroup>    
        
        
    </s:VGroup>
    
</s:Application>