<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:controls="com.mh.controls.*"
    layout="absolute"  viewSourceURL="srcview/index.html">
    
    <!--
     * LoadingImage Component Example
     * Created by Tony Fendall 19/05/08
     *
     * The LoadingImage component is used the same way as a
     * normal Flex Image component. The LoadingImage adds a
     * self contained ProgressBar which shows its own
     * loading progress.
     -->
    
    <mx:Style source="styles.css" />    


    <mx:HBox  horizontalCenter="0" top="20" horizontalGap="16">
        <mx:Panel title="Loading Image Component" >
            
            
            <!--
             * Loading Image Component (used like a normal Flex Image component)
             -->
            <controls:LoadingImage id="loadingImage" width="500" height="333"
                    progressPercentWidth="80" progressHeight="20" />
            
            
        </mx:Panel>
                
        
        <!--
         * Available sources box
         -->
        <mx:Panel title="Select a Source (double click)" width="281" height="374" >            
            <mx:Tile width="100%" height="100%"  tileHeight="75" tileWidth="75" paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10" verticalScrollPolicy="off">
                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2089/2252899417_233dcedf4e_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2089/2252899417_233dcedf4e.jpg?v=0&amp;r='+Math.random();}" />
                        
                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2170/2252898591_c38222c48f_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2170/2252898591_c38222c48f.jpg?v=0&amp;r='+Math.random();}" />
                        
                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2108/2252893299_cf9f8ddf55_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2108/2252893299_cf9f8ddf55.jpg?v=0&amp;r='+Math.random();}" />

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2225/2253692570_1f1a2da386_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2225/2253692570_1f1a2da386.jpg?v=0&amp;r='+Math.random();}" />

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2136/2253691934_60363aba86_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2136/2253691934_60363aba86.jpg?v=0&amp;r='+Math.random();}" />

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2243/2253696512_0dcaef7f3a_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2243/2253696512_0dcaef7f3a.jpg?v=0&amp;r='+Math.random();}" />

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2125/2252893515_68b7c26287_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2125/2252893515_68b7c26287.jpg?v=0&amp;r='+Math.random();}" />

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2256/2253696234_03561fc07a_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2256/2253696234_03561fc07a.jpg?v=0&amp;r='+Math.random();}" />

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2283/2349686196_2355a02509_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2283/2349686196_2355a02509.jpg?v=0&amp;r='+Math.random();}" />                

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2380/1788032604_fe356567ee_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2380/1788032604_fe356567ee.jpg?v=0&amp;r='+Math.random();}" />                

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2214/2253698522_24e0c495fa_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2214/2253698522_24e0c495fa.jpg?v=0&amp;r='+Math.random();}" />                

                    <controls:LoadingImage width="75" height="75" source="http://farm3.static.flickr.com/2032/2252889037_0a3a02c08d_s.jpg"
                        doubleClickEnabled="true" doubleClick="{loadingImage.source='http://farm3.static.flickr.com/2032/2252889037_0a3a02c08d.jpg?v=0&amp;r='+Math.random();}" />                
            </mx:Tile>            
        </mx:Panel>        
    </mx:HBox>
        
    
    
    <!--
     * Application Control Bar
     -->     
    <mx:ApplicationControlBar dock="true">
        <mx:Label text="Loading" styleName="headderText"/>        
        <mx:Spacer width="-20" />        
        <mx:Label text="Image" styleName="headderTextBlue"/>
        <mx:Label text="Component Example" styleName="headderText"/>
        <mx:Script>
            <![CDATA[
                import flash.net.navigateToURL;            
            ]]>
        </mx:Script>
        <mx:LinkButton label="created by Tony Fendall" color="#FFFFFF" click="{navigateToURL( new URLRequest('http://www.munkiihouse.com'))}" />
    </mx:ApplicationControlBar>
    
</mx:Application>