<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns:mx                =    "http://www.adobe.com/2006/mxml" 
    layout                    =    "absolute"
    backgroundColor            =    "#FFFFFF"
    backgroundGradientColors=    "#FFFFFF,#FFFFFF"     
    creationComplete        =    "handleCreationComplete()"
    width                    =    "650"
    height                    =    "650"
     viewSourceURL="srcview/index.html">
    
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            
            [Bindable]
            public var ac:ArrayCollection = new ArrayCollection();
            
            public var serverURL:String = 'http://axelscript.com/wp-content/'
            
            public var imageMap:ImageMap = new ImageMap();
            
            [Bindable]
            public var badText:String = 'Scroll and watch all the images download, when you scroll back to the top, it redownloads all the images again, based on how our renderer works with binding to the imageURL, this is bad!';
            
            [Bindable]
            public var goodText:String = 'Scroll and watch all the images show up way faster, and dont download over and over as you scroll';
            
            
            private function handleCreationComplete():void
            {
                Security.loadPolicyFile('http://axelscript.com/wp-content/crossdomain.xml');
                
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife3.png',serverURL) );
                ac.addItem( new TempVO('portfolio-onelife4.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks1.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks2.png',serverURL) );
                ac.addItem( new TempVO('portfolio-emeeks3.png',serverURL) );
            }
        ]]>
    </mx:Script>
    
    <mx:TabNavigator
        width    =    "100%"
        height    =    "100%"
        >
        <mx:VBox
            width    =    "100%"
            height    =    "100%"
            label    =    "Bad Tile List and Renderer"
            >
            <mx:Text 
                text        =    "{badText}"
                fontSize    =    "22"
                height        =    "125"
                width        =    "600"
                />
            
            <mx:TileList
                dataProvider    =    "{ac}"
                rowHeight        =    "150"
                columnWidth        =    "200"
                width            =    "100%"
                height            =    "100%"
                itemRenderer    =    "BadRenderer"
                />
        </mx:VBox>
        <mx:VBox
            width    =    "100%"
            height    =    "100%"
            label    =    "Good Tile List and Renderer"
            >
            <mx:Text 
                text        =    "{goodText}"
                fontSize    =    "22"
                height        =    "75"
                width        =    "600"
                />
            <mx:TileList
                dataProvider    =    "{ac}"
                rowHeight        =    "150"
                columnWidth        =    "200"
                width            =    "100%"
                height            =    "100%"
                itemRenderer    =    "GoodRenderer"
                />
        </mx:VBox>
            
    </mx:TabNavigator>
    
    
    
</mx:Application>