package
{
        import flash.display.*;
        import flash.net.*;
        import flash.events.*;
        
        public class @ax-actionscript-video-10-transition-App extends Sprite {                
                //the paths for the 2 videos to be mixed
                public static var VIDNAMES:Array = ["med_lg.flv","sl_lg.flv"];
                
                //we will have 2 video players, layered one on top of the other
                private var player1:VideoPlayer;
                private var player2:VideoPlayer;

                public function @ax-actionscript-video-10-transition-App() {
                        //constructor code is interpretted. keep it minimal
                        init();
                }
                
                private function init():void {
                        stage.align=StageAlign.TOP_LEFT;
                        
                        //create player1 and load the first video
                        player1=new VideoPlayer();
                        player1.load(VIDNAMES[0]);
                        
                        //add it to the display list
                        this.addChild(player1);
                        
                        //create player2 and load the remaining video
                        player2=new VideoPlayer();
                        player2.load(VIDNAMES[1]);
                        
                        //add it to the display list.
                        //as it was added last, it will be on top, obscuring player1
                        this.addChild(player2);
                        
                        //listen for the COMPLETE event. signals when a fade has completed. see VideoPlayer.as
                        player2.addEventListener(Event.COMPLETE,playerFadeCompleteHandler,false,0,true);
                        player1.addEventListener(Event.COMPLETE,playerFadeCompleteHandler,false,0,true);
                        
                        //we start player2 first, because it is on top.
                        player2.play();
                        
                        //listen for mouseclick to start a transition
                        listenForClicks(); 
                }
                
                private function listenForClicks():void {
                        //set us up as a listener for clicks
                        this.stage.addEventListener(MouseEvent.CLICK,mouseClickHandler,false,0,true);
                }
                
                private function mouseClickHandler(e:MouseEvent):void {
                        //find out which player is bottom, and which is top
                        //as there is nothing else in our display list, these are at depths 0 and 1 respectively
                        var bottomPlayer:VideoPlayer=VideoPlayer(this.getChildAt(0));
                        var topPlayer:VideoPlayer=VideoPlayer(this.getChildAt(1));
                        
                        //start the bottom player
                        //initially, it will not be visible, because the top player obscures it
                        bottomPlayer.play();
                        
                        //fade the top player to alpha over 1500 milliseconds
                        //this will reveal the bottom player which we just started
                        topPlayer.fadeOut(1500);
                        
                        //prevent user from starting another fade before this one is complete.
                        //do not listen for mouseclicks any more.
                        //the listener will be restored once the transition is complete.
                        this.stage.removeEventListener(MouseEvent.CLICK,mouseClickHandler,false);
                }
                
                private function playerFadeCompleteHandler(e:Event):void {
                        //once the top player has completely faded to alpha 0, bring the bottom one to the front
                        this.swapChildren(player1,player2);        
                        
                        //as the transition had finished, we can listen for clicks again
                        listenForClicks();
                }
        }
}