<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:fx="http://ns.adobe.com/mxml/2009" 
         xmlns:s="library://ns.adobe.com/flex/spark"  creationComplete="application1_creationCompleteHandler(event)"
         xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%" xmlns:nestedtreedatagrid="com.flexicious.nestedtreedatagrid.*" xmlns:controls="com.flexicious.controls.*">
    
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import com.flexicious.example.view.support.CustomSpinner;
            import com.flexicious.nestedtreedatagrid.FlexDataGridColumnLevel;
            import com.flexicious.nestedtreedatagrid.FlexDataGridVirtualBodyContainer;
            import com.flexicious.nestedtreedatagrid.events.ExtendedFilterPageSortChangeEvent;
            import com.flexicious.nestedtreedatagrid.events.FlexDataGridEvent;
            import com.flexicious.nestedtreedatagrid.events.FlexDataGridVirtualScrollEvent;
            import com.flexicious.nestedtreedatagrid.valueobjects.VirtualScrollLoadInfo;
            import com.flexicious.utils.UIUtils;
            
            import mock.FlexiciousMockGenerator;
            
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;
            import mx.events.ScrollEvent;
            
            
            
            protected function application1_creationCompleteHandler(event:FlexEvent):void
            {
                loadInitialData();
                
            }
            
            
            private function populateObject(obj:Object, x:String, lvl:FlexDataGridColumnLevel):Object
            {
                obj.Id = FlexiciousMockGenerator.getRandom(100,1000);
                obj.Name = "Name " + x.toString();
                obj.Street = "Street" + x;
                obj.Title = "CEO" + x;
                obj.City = "City" + x;
                if(obj.Id!=3)
                    obj.numChildren=1000;
                
                return obj;
            }
            private function loadInitialData():void
            {
                dgMain.gotoVerticalPosition(0);
                 var orgData:ArrayCollection = new ArrayCollection();
                orgData.removeAll();
                for( var x:uint = 0; x <= 500; x++ )
                {
                    var obj:Object = new Object();
                    populateObject(obj,x.toString(),dgMain.columnLevel);
                    orgData.addItem(obj);
                }
                dgMain.dataProvider=orgData;
                System.gc();
                
                callLater( setLabel);
            }
            
            private function setLabel():void
            {
                lblMemory.text = "Memory Usage at "+new Date().toString()+": " +  System.totalMemory;
                
            }
            
            protected function button1_clickHandler(event:MouseEvent):void
            {
                toggleTimer()
            }
            var t:Timer=new Timer(1000);
            
            private function toggleTimer():void
            {
                if(t.running){
                    btnToggleTimer.label="Start Timer"
                    t.removeEventListener(TimerEvent.TIMER,onTimer);
                    t.stop();
                }else{
                    btnToggleTimer.label="Stop Timer"
                    t.addEventListener(TimerEvent.TIMER,onTimer);
                    t.start();
                }
            }
            function onTimer(e:TimerEvent):void{loadInitialData();}
        ]]>
    </fx:Script>

    <mx:VBox width="100%" height="100%">
        
        <mx:HBox width="100%" height="100%">
            <mx:VBox width="50%" height="100%">
                <nestedtreedatagrid:FlexDataGrid id="dgMain" selectedKeyField="Id"  showSpinnerOnFilterPageSort="true"
                                                 width="100%" 
                                                 height="100%"
                                                 enableSelectionCascade="true"
                                                 enableSelectionBubble="true"
                                                 enableSelectionExclusion="true"
                                                 enableTriStateCheckbox="true"
                                                 clearSelectionOnDataProviderChange="false"
                                                 spinnerFactory="{new ClassFactory(CustomSpinner)}"
                                                 >
                    
                    
                    <nestedtreedatagrid:columnLevel>
                        <nestedtreedatagrid:FlexDataGridColumnLevel childrenCountField="numChildren" enableFooters="true" selectedKeyField="Id">
                            <nestedtreedatagrid:columns>
                                <nestedtreedatagrid:FlexDataGridCheckBoxColumn/>
                                <nestedtreedatagrid:FlexDataGridColumn dataField="Id" enableHierarchicalNestIndent="true"/>
                                <nestedtreedatagrid:FlexDataGridColumn dataField="Name" />
                                <nestedtreedatagrid:FlexDataGridColumn dataField="Street" />
                                <nestedtreedatagrid:FlexDataGridColumn dataField="Title" />
                                <nestedtreedatagrid:FlexDataGridColumn dataField="City" />
                            </nestedtreedatagrid:columns>
                            <nestedtreedatagrid:nextLevel>
                                <nestedtreedatagrid:FlexDataGridColumnLevel  enableFooters="true" childrenCountField="numChildren" itemLoadMode="server" selectedKeyField="Id" >
                                    <nestedtreedatagrid:columns>
                                        <nestedtreedatagrid:FlexDataGridCheckBoxColumn/>
                                        <nestedtreedatagrid:FlexDataGridColumn dataField="Id" enableHierarchicalNestIndent="true"/>
                                        <nestedtreedatagrid:FlexDataGridColumn dataField="Name" />
                                        <nestedtreedatagrid:FlexDataGridColumn dataField="Street" />
                                        <nestedtreedatagrid:FlexDataGridColumn dataField="Title" />
                                        <nestedtreedatagrid:FlexDataGridColumn dataField="City" />
                                    </nestedtreedatagrid:columns>
                                    <nestedtreedatagrid:nextLevel>
                                        <nestedtreedatagrid:FlexDataGridColumnLevel selectedKeyField="Id" enableFooters="true">
                                            <nestedtreedatagrid:columns>
                                                <nestedtreedatagrid:FlexDataGridCheckBoxColumn/>
                                                <nestedtreedatagrid:FlexDataGridColumn dataField="Id" enableHierarchicalNestIndent="true"/>
                                                <nestedtreedatagrid:FlexDataGridColumn dataField="Name" />
                                                <nestedtreedatagrid:FlexDataGridColumn dataField="Street" />
                                                <nestedtreedatagrid:FlexDataGridColumn dataField="Title" />
                                                <nestedtreedatagrid:FlexDataGridColumn dataField="City" />
                                            </nestedtreedatagrid:columns>
                                        </nestedtreedatagrid:FlexDataGridColumnLevel>
                                    </nestedtreedatagrid:nextLevel>    
                                </nestedtreedatagrid:FlexDataGridColumnLevel>
                            </nestedtreedatagrid:nextLevel>
                        </nestedtreedatagrid:FlexDataGridColumnLevel>
                    </nestedtreedatagrid:columnLevel>
                </nestedtreedatagrid:FlexDataGrid>
                
            </mx:VBox>
            <mx:VBox>
                <mx:Label id="lblMemory" width="100%"  text="Memory Usage: {System.totalMemory}"/>
                <mx:Button id="btnToggleTimer" label="Start Timer" click="button1_clickHandler(event)"/>
            </mx:VBox>
            
        </mx:HBox>
        
    </mx:VBox>
    
</mx:HBox>