<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
    xmlns:flexmdi="http://flexmdi.googlecode.com/"
    creationComplete="onCreationComplete()" xmlns:ns="sample_content.*" viewSourceURL="srcview/index.html">
    
    <mx:Style source="/assets/css/style.css" />
    
    <mx:Style>
        HorizontalList {
               fontWeight: bold;
               borderThickness: 0;
               
        }
        
        .taskbar {
               fillAlphas: 0, 0.47;
               backgroundAlpha: 0.72;
               cornerRadius: 0;
               dropShadowEnabled: false;
            }
    </mx:Style>
    
    <mx:Script>
        <![CDATA[
        
        
            import taskbar.TaskBarItem;
            
            import mx.collections.ArrayCollection;
            import sample_content.SampleContent;
            import flexmdi.effects.effectsLib.MDILinearEffects;
            import flexmdi.effects.MDIEffectsDescriptorBase;

            import flexmdi.events.MDIWindowEvent;
            import flexmdi.effects.effectsLib.MDIVistaEffects;
            import flexmdi.events.MDIManagerEvent;
    

            private var effectsList:Array;
            
            private function onCreationComplete():void
            {

                effectsList = new Array();
                effectsList.push({data: flexmdi.effects.MDIEffectsDescriptorBase, label: "No effects"});
                effectsList.push({data: flexmdi.effects.effectsLib.MDIVistaEffects, label: "Vista"});
                effectsList.push({data: flexmdi.effects.effectsLib.MDILinearEffects, label: "Linear"});
                effectsListCb.dataProvider = effectsList;
                effectsListCb.selectedIndex = 1;
                

                
                
                // add our own listener for window event
                mdiCanvas.windowManager.addEventListener(MDIManagerEvent.WINDOW_MINIMIZE, windowMinimizeHandler);
            }
            
            
            
            [Bindable]
            public var taskBarItems : ArrayCollection = new ArrayCollection();
            
            private function windowMinimizeHandler(event:Event):void
            {
                if(event is MDIManagerEvent)
                {
                    var mgrEvent:MDIManagerEvent = event as MDIManagerEvent;    
                    mgrEvent.window.visible = false;
                    var item : TaskBarItem = new TaskBarItem(mgrEvent.window.title,mgrEvent.window);
                    this.taskBarItems.addItem(item);
                }
            }
            
            private function restoreWindow(event:Event):void
            {
                var item : TaskBarItem = this.tbar.selectedItem as TaskBarItem;
                item.window.visible = true;

                var index : int = this.taskBarItems.getItemIndex( item );
                this.taskBarItems.removeItemAt( index );
                
                item.window.dispatchEvent( new MDIWindowEvent(MDIWindowEvent.RESTORE,item.window) );
                item.window.bringToFront(event);
            }
            
    
            private function addWindow():void
            {
                var win:MDIWindow = new MDIWindow();
                win.width = 350;
                win.title = "Window " + String(mdiCanvas.windowManager.windowList.length + 1);
                mdiCanvas.windowManager.add(win);
            }
            

            
            private function changeEffects():void
            {
                mdiCanvas.effectsLib = effectsListCb.selectedItem.data as Class;
            }
            
            
            
            
        ]]>
    </mx:Script>
    <mx:VBox id="vbox" width="100%" height="100%">
    
        <mx:ApplicationControlBar dock="true" width="100%" height="50" verticalAlign="middle">
            <mx:Button label="Add Window" click="addWindow()" />
            
            <mx:VRule height="35" />
            
            <mx:Button label="Cascade" click="mdiCanvas.windowManager.cascade()" />
            <mx:Button label="Tile" click="mdiCanvas.windowManager.tile(false, Number(tileGap.text))" />
            <mx:Button label="Tile + Fill Space" click="mdiCanvas.windowManager.tile(true, Number(tileGap.text))" />
            <mx:Label text="Tile Gap" />
            <mx:TextInput id="tileGap" text="10" width="30" textAlign="center" />
            

            <mx:VRule height="35" />
            
            <mx:Label text="Effects" />
            <mx:ComboBox id="effectsListCb" change="changeEffects()" />
        </mx:ApplicationControlBar>
        
        <flexmdi:MDICanvas id="mdiCanvas" horizontalScrollPolicy="off" verticalScrollPolicy="off"
            effectsLib="{flexmdi.effects.effectsLib.MDIVistaEffects}"
            width="100%" height="100%">
            <flexmdi:MDIWindow id="win1"
                title="Window 1"
                x="30" y="30" width="400" height="200" >
            </flexmdi:MDIWindow>
            <flexmdi:MDIWindow id="win2"
                title="Window 2"
                x="450" y="30" width="250" height="300" />
            <flexmdi:MDIWindow id="win3" title="Window 3"
                width="400" height="181"  x="30" y="249"/>
        </flexmdi:MDICanvas>
        
    </mx:VBox>
    
    
    <mx:ApplicationControlBar styleName="taskbar" width="100%" height="40" bottom="0" left="0" >

        <mx:HorizontalList id="tbar" dataProvider="{taskBarItems}"  rollOverColor="#5F869A"  
            width="100%" height="100%" backgroundAlpha="0"
            click="restoreWindow(event)" />
            
             
    
    </mx:ApplicationControlBar>
    
    
    
</mx:Application>