Saaed

Hi Carl Another problem made me come back to you. My External loader is ready now and working quiet well (Thanks ). Here I am Loading an external SWF file using the SWFLoader Class. Here is the way i do: currentLoader = new SWFLoader(url,{container:videoContainer_mc,width:720,height:406,centerRegistration:true,autoPlay:false,onProgress:progressHandler,onComplete:completeHandler}); currentLoader.load(); Im trying to make the whole content FullScreen. On the other hand, i tend to design another button for making the external loaded Content FullScreen. How Can i do this separately for the main Stage and external Loaded content? Regards

Hi Carl, I cant really say, how much useful your comments are, I Just came to appreciate your Help. My problem is totally solved and I now , have a External SWFLoader, with the features of, pausing, Playing, Next , Previous, Loading, PreLoading,Sound Controller and whatever you see on a videoLoader. Anyone, needs such a loader, just let me know. Carl, I want to add a multilevel menu to this loader, so that i can have a TOC (Table Of Contents) for My loader. Is there any tutorial for making a XML menu with GreenSock? I will be looking forward for your Response. Your Fan: Saeed Regards

Thanks Carl. It works fine now, and navigating well among the External SWF Movies. Could you please give em a guide how to access the properties of the loaded SWF, like 1)totalFrames, 2)currnetFrame, 3)mute and unmute the Sound, 4) Pause it at a certain frame, and resume it from the same frame? I tried these few lines of the code, but I receive the Error of the null Object (Error #1009). public function playSWF():void { var url:String = _videos[CurrentID].url; //get rid of previous loaded swf if (currentLoader) { currentLoader.dispose(true); TweenMax.to(preloader_mc, 0.2, {autoAlpha:1}); preloader_mc.play(); } currentLoader = new SWFLoader(url,{container:videoContainer_mc,width:720,height:406,centerRegistration:true,autoPlay:true,onProgress:progressHandler,onComplete:completeHandler}); TweenMax.to(preloader_mc, 0.3, {autoAlpha:0, onComplete:preloader_mc.stop}); var CurrentSWF:MovieClip = currentLoader.rawContent as MovieClip; var minutes:String = force2Digits(int(CurrentSWF.totalFrames / 60)); var seconds:String = force2Digits(int(CurrentSWF.totalFrames % 60)); controlUI_mc.totalTime_tf.text = minutes + ":" + seconds; currentLoader.load(); } private function force2Digits(value:Number):String { return (value < 10) ? "0" + String(value) : String(value); } I will be looking forward, for your really useful guides. This is the 2nd stag. My very best Regards.

Hi Carl, I appreciate your Consern, and thanks for directing me to start my SWF navigator from very beginning. As a matter of fact, I want to LoaderMaize the script, and make it cool with its tips and tricks, therefore I will go step by step with you. Actually,I have tried to write the code for my purpose, and i have used LoaderMax XML Loader for loading my assets information. on the other hand SWFLoader, for loading my swf movies. I've added an event Listener to the next button, which increments a variable named "CurrentId" (Keeping the number of the swf file that is loaded and is playing now) and one other listener for Previous Button which does vice versa. I have a public function named playSWF, which has to load the new file. The problem is that, when PlaySWF is done, the previous SWF file which was loaded, is still palying,and the new file is played together wth the previous one. The function is as below: public function playSWF():void { var url:String = _videos[CurrentID].url; var currentLoader = new SWFLoader(url,{container:videoContainer_mc,width:720,height:406,centerRegistration:true,autoPlay:true}); currentLoader.load(); } _Videos is defined as below: // that is an array private var _videos:Array; //which is generated from the queue children: private function xmlHandler(event:LoaderEvent):void { var queue:LoaderMax = LoaderMax.getLoader("SwfListLoader"); _videos = queue.getChildren(); queue.load(); initUI(); } How can I stop, unload and remove the listeners from the current swf file, and then load the new file in playSWF function? This will be the 1st stage. Regards

Dear Carl, here is the Class that manages to load multiple FLV movies: package { import flash.display.MovieClip; import flash.events.Event; import flash.events.MouseEvent; import com.greensock.TweenMax; import com.greensock.events.LoaderEvent; import com.greensock.loading.LoaderMax; import com.greensock.loading.XMLLoader; import com.greensock.loading.VideoLoader; import flash.geom.Rectangle; public class Main extends MovieClip { //an array containing the VideoLoaders in the order they should be played private var _videos:Array; //keeps track of the VideoLoader that is currently playing private var _currentVideo:VideoLoader; //If true, the audio has been muted private var _silentMode:Boolean; //tracks whether or not the video was paused when the user moused-down on the scrubber. We must pause for scrubbing, but this tells us whether or not to playVideo() when the user releases the mouse. private var _preScrubPaused:Boolean; public function Main() { LoaderMax.activate([XMLLoader, VideoLoader]); initUI(); var xmlLoader:XMLLoader = new XMLLoader("xml/videoList.xml", {name:"videoList", onComplete:xmlHandler}); xmlLoader.load(); } private function xmlHandler(event:LoaderEvent):void { //get the LoaderMax named "videoListLoaded" which was inside our XML var queue:LoaderMax = LoaderMax.getLoader("videoListLoader"); //store the nested VideoLoaders in an array _videos = queue.getChildren(); //start loading the queue of VideoLoaders (they will load in sequence) queue.load(); //show the first video showVideo(_videos[0]); } //---- UI (User Interface) FUNCTIONS --------------------------------------------------------------------------- private function initUI():void { //ignore mouse interaction with progressBar_mc so that clicks pass through to the loadingBar_mc whose listener handles skipping the video to that spot. controlUI_mc.progressBar_mc.mouseEnabled = false; //ignore mouse interaction with preloader_mc preloader_mc.mouseEnabled = false; //the "layer" blendMode makes the alpha fades cleaner (overlapping objects don't add alpha levels) controlUI_mc.blendMode = "layer"; //set the progress and loading bars and the scrubber to the very beginning controlUI_mc.progressBar_mc.width = controlUI_mc.loadingBar_mc.width = 0; controlUI_mc.scrubber_mc.x = controlUI_mc.progressBar_mc.x; //initially hide the user interface - autoAlpha:0 sets alpha to 0 and visible to false. TweenMax.allTo([controlUI_mc, playPauseBigButton_mc, preloader_mc], 0, {autoAlpha:0}); } private function activateUI():void { //add various listeners addListeners([controlUI_mc, videoContainer_mc, playPauseBigButton_mc], MouseEvent.ROLL_OVER, toggleControlUI); addListeners([controlUI_mc, videoContainer_mc, playPauseBigButton_mc], MouseEvent.ROLL_OUT, toggleControlUI); addListeners([controlUI_mc.playPauseButton_mc, playPauseBigButton_mc, videoContainer_mc], MouseEvent.CLICK, togglePlayPause); addListeners([controlUI_mc.back_mc, controlUI_mc.audio_mc, controlUI_mc.next_mc], MouseEvent.ROLL_OVER, blackRollOverHandler); addListeners([controlUI_mc.back_mc, controlUI_mc.audio_mc, controlUI_mc.next_mc], MouseEvent.ROLL_OUT, blackRollOutHandler); controlUI_mc.audio_mc.addEventListener(MouseEvent.CLICK, toggleAudio); controlUI_mc.next_mc.addEventListener(MouseEvent.CLICK, nextVideo); controlUI_mc.back_mc.addEventListener(MouseEvent.CLICK, previousVideo); controlUI_mc.playPauseButton_mc.addEventListener(MouseEvent.ROLL_OVER, growPlayPause); controlUI_mc.playPauseButton_mc.addEventListener(MouseEvent.ROLL_OUT, shrinkPlayPause); controlUI_mc.scrubber_mc.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownScrubber); controlUI_mc.loadingBar_mc.addEventListener(MouseEvent.CLICK, scrubToMouse); //loop through various UI elements and set buttonMode to true and mouseChildren to false so that rollovers/outs work smoothly var controls:Array = [controlUI_mc.playPauseButton_mc, playPauseBigButton_mc, controlUI_mc.back_mc, controlUI_mc.next_mc, controlUI_mc.audio_mc, controlUI_mc.scrubber_mc]; var i:int = controls.length; while (i--) { controls[i].buttonMode = true; controls[i].mouseChildren = false; } } //---- NAVIGATION FUNCTIONS --------------------------------------------------------------------------------- private function showVideo(video:VideoLoader):void { //if the new video is the one that's currently showing, do nothing. if (video == _currentVideo) { return; } //The first time through, the _currentVideo will be null. That's when we need to activate the user interface if (_currentVideo == null) { activateUI(); //don't activate the UI until the first video is ready. This avoids errors when _currentVideo is null. } else { //remove the event listeners from the _currentVideo (which is now the old one that will be replaced) _currentVideo.removeEventListener(LoaderEvent.PROGRESS, updateDownloadProgress); _currentVideo.removeEventListener(VideoLoader.VIDEO_COMPLETE, nextVideo); _currentVideo.removeEventListener(VideoLoader.PLAY_PROGRESS, updatePlayProgress); _currentVideo.removeEventListener(VideoLoader.VIDEO_BUFFER_FULL, bufferFullHandler); _currentVideo.removeEventListener(LoaderEvent.INIT, refreshTotalTime); //If the video is paused, we should togglePlayPause() so that the new video plays and the interface matches. if (_currentVideo.videoPaused) { togglePlayPause(); } //fade out the preloader and then stop() it. If the new video needs to display the preloader, that's okay because the fade-in tween we create later will overwrite this one. TweenMax.to(preloader_mc, 0.3, {autoAlpha:0, onComplete:preloader_mc.stop}); //fade the current (old) video's alpha out. Remember the VideoLoader's "content" refers to the ContentDisplay Sprite we see on the screen. TweenMax.to(_currentVideo.content, 0.8, {autoAlpha:0}); //fade the current (old) video's volume down to zero and then pause and rewind the video (it will be invisible by that time). TweenMax.to(_currentVideo, 0.8, {volume:0, onComplete:rewindAndPause, onCompleteParams:[_currentVideo]}); } //now swap the _currentLoader variable so it refers to the new video. _currentVideo = video; //listen for PROGRESS events so that we can update the loadingBar_mc's scaleX accordingly _currentVideo.addEventListener(LoaderEvent.PROGRESS, updateDownloadProgress); //listen for a VIDEO_COMPLETE event so that we can automatically advance to the next video. _currentVideo.addEventListener(VideoLoader.VIDEO_COMPLETE, nextVideo); //listen for PLAY_PROGRESS events so that we can update the progressBar_mc's scaleX accordingly _currentVideo.addEventListener(VideoLoader.PLAY_PROGRESS, updatePlayProgress); //if the video hasn't fully loaded yet and is still buffering, show the preloader if (_currentVideo.progress < 1 && _currentVideo.bufferProgress < 1) { //when the buffer fills, we'll fade out the preloader _currentVideo.addEventListener(VideoLoader.VIDEO_BUFFER_FULL, bufferFullHandler); //prioritizing the video ensures that it moves to the top of the LoaderMax gueue and any other loaders that were loading are canceled to maximize bandwidth available for the new video. _currentVideo.prioritize(true); //play() the preloader and fade its alpha up. preloader_mc.play(); TweenMax.to(preloader_mc, 0.3, {autoAlpha:1}); } //start playing the video from its beginning _currentVideo.gotoVideoTime(0, true); //always start with the volume at 0, and fade it up to 1 if necessary. _currentVideo.volume = 0; if (!_silentMode) { TweenMax.to(_currentVideo, 0.8, {volume:1}); } //when we addChild() the VideoLoader's content, it makes it rise to the top of the stacking order videoContainer_mc.addChild(_currentVideo.content); //fade the VideoLoader's content alpha in. Remember, the "content" refers to the ContentDisplay Sprite that we see on the stage. TweenMax.to(_currentVideo.content, 0.8, {autoAlpha:1}); //update the total time display refreshTotalTime(); //if the VideoLoader hasn't received its metaData yet (which contains duration information), we should set up a listener so that the total time gets updated when the metaData is received. if (_currentVideo.metaData == null) { _currentVideo.addEventListener(LoaderEvent.INIT, refreshTotalTime); } //update the progressBar_mc and loadingBar_mc updateDownloadProgress(); updatePlayProgress(); } private function bufferFullHandler(event:LoaderEvent):void { TweenMax.to(preloader_mc, 0.3, {autoAlpha:0, onComplete:preloader_mc.stop}); } private function rewindAndPause(video:VideoLoader):void { video.pauseVideo(); //rewind the video so that when we fade it in again later, it's already displaying the first frame and there's no delay skipping to it. video.gotoVideoTime(0); } private function refreshTotalTime(event:LoaderEvent=null):void { var minutes:String = force2Digits(int(_currentVideo.duration / 60)); var seconds:String = force2Digits(int(_currentVideo.duration % 60)); controlUI_mc.totalTime_tf.text = minutes + ":" + seconds; } private function nextVideo(event:Event):void { var next:int = _videos.indexOf(_currentVideo) + 1; if (next >= _videos.length) { next = 0; } showVideo(_videos[next]); } private function previousVideo(event:Event):void { var prev:int = _videos.indexOf(_currentVideo) - 1; if (prev < 0) { prev = _videos.length - 1; } showVideo(_videos[prev]); } //---- PROGRESS AND LOADING BAR FUNCTIONS ------------------------------------------------------------- private function updateDownloadProgress(event:LoaderEvent=null):void { controlUI_mc.loadingBar_mc.scaleX = _currentVideo.progress; } private function updatePlayProgress(event:LoaderEvent=null):void { var time:Number = _currentVideo.videoTime; var minutes:String = force2Digits(int(time / 60)); var seconds:String = force2Digits(int(time % 60)); controlUI_mc.currentTime_tf.text = minutes + ":" + seconds; controlUI_mc.progressBar_mc.scaleX = _currentVideo.playProgress; controlUI_mc.scrubber_mc.x = controlUI_mc.progressBar_mc.x + controlUI_mc.progressBar_mc.width; } //---- TOGGLE FUNCTIONS ------------------------------------------------------------------------------- private function toggleControlUI(event:MouseEvent):void { if (videoContainer_mc.hitTestPoint(mouseX, mouseY)) { TweenMax.to(controlUI_mc, 0.3, {autoAlpha:1}); } else { TweenMax.to(controlUI_mc, 0.3, {autoAlpha:0}); } } private function togglePlayPause(event:MouseEvent=null):void { _currentVideo.videoPaused = ! _currentVideo.videoPaused; if (_currentVideo.videoPaused) { TweenMax.to(playPauseBigButton_mc, 0.3, {autoAlpha:1}); controlUI_mc.playPauseButton_mc.gotoAndStop("paused"); TweenMax.to(videoContainer_mc, 0.3, {blurFilter:{blurX:6, blurY:6}, colorMatrixFilter:{brightness:0.5}}); } else { TweenMax.to(playPauseBigButton_mc, 0.3, {autoAlpha:0}); controlUI_mc.playPauseButton_mc.gotoAndStop("playing"); TweenMax.to(videoContainer_mc, 0.3, {blurFilter:{blurX:0, blurY:0, remove:true}, colorMatrixFilter:{brightness:1, remove:true}}); } } private function toggleAudio(event:MouseEvent):void { _silentMode = !_silentMode; if (_silentMode) { _currentVideo.volume = 0; controlUI_mc.audio_mc.label.gotoAndStop("off"); } else { _currentVideo.volume = 1; controlUI_mc.audio_mc.label.gotoAndStop("on"); } } //---- ROLLOVER/OUT HANDLERS --------------------------------------------------------------------------------- private function blackRollOverHandler(event:MouseEvent):void { TweenMax.to(event.target.label, 0.3, {tint:0xFFFFFF}); } private function blackRollOutHandler(event:MouseEvent):void { TweenMax.to(event.target.label, 0.3, {tint:null}); } private function growPlayPause(event:MouseEvent):void { TweenMax.to(event.target, 0.2, {scaleX:1.3, scaleY:1.3}); } private function shrinkPlayPause(event:MouseEvent):void { TweenMax.to(event.target, 0.2, {scaleX:1, scaleY:1}); } //---- SCRUBBER FUNCTIONS ------------------------------------------------------------------------------------ private function mouseDownScrubber(event:MouseEvent):void { _preScrubPaused = _currentVideo.videoPaused; _currentVideo.videoPaused = true; controlUI_mc.scrubber_mc.startDrag(false, new Rectangle(controlUI_mc.loadingBar_mc.x, controlUI_mc.loadingBar_mc.y, controlUI_mc.loadingBar_mc.width, 0)); stage.addEventListener(MouseEvent.MOUSE_UP, mouseUpScrubber); stage.addEventListener(MouseEvent.MOUSE_MOVE, scrubToMouse); } private function scrubToMouse(event:MouseEvent):void { controlUI_mc.progressBar_mc.width = controlUI_mc.mouseX - controlUI_mc.progressBar_mc.x; _currentVideo.playProgress = controlUI_mc.progressBar_mc.scaleX; } private function mouseUpScrubber(event:MouseEvent):void { stage.removeEventListener(MouseEvent.MOUSE_UP, mouseUpScrubber); stage.removeEventListener(MouseEvent.MOUSE_MOVE, scrubToMouse); controlUI_mc.scrubber_mc.stopDrag(); _currentVideo.videoPaused = _preScrubPaused; } //---- UTILITY FUNCTIONS ------------------------------------------------------------------------------------- private function addListeners(objects:Array, type:String, func:Function):void { var i:int = objects.length; while (i--) { objects[i].addEventListener(type, func); } } private function force2Digits(value:Number):String { return (value < 10) ? "0" + String(value) : String(value); } } } And the Xml file, storing the information is as Below: <?xml version="1.0" encoding="iso-8859-1"?> <videoList> <LoaderMax name="videoListLoader" maxConnections="1" prependURLs="assets/"> <VideoLoader name="videoID0" url="videoClip01.flv" height ="406" width="720" scaleMode="proportionalInside" centerRegistration="true" alpha="0" autoPlay="false" /> <VideoLoader name="videoID1" url="videoClip02.mp4" height ="406" width="720" scaleMode="proportionalInside" centerRegistration="true" alpha="0" autoPlay="false" /> <VideoLoader name="videoID2" url="videoClip03.flv" height ="406" width="720" scaleMode="proportionalInside" centerRegistration="true" alpha="0" autoPlay="false" /> </LoaderMax> </videoList> So, what is the neccesarry changes, to change this loader to a swf Loader? thanks in advance for your care Carl. Regards

HI Guys First of all, thanks for your cool topics, LoaderMax is really Cool. I was wondering, if GreenSock, has any smart AS3 "SWF" Loading and Play Back Player, just as the same version for its Video Player? (Play, pause, Next, Back, mute, progress / seek bar and etc...) Regards