Preloader for a large swf with audio

[barredow]

I'd like to create a preloader animation in tweenlite that has sound and rotates several images before loading a very large swf file that also has sound. Unfortunately, the code I have right now is loading the sound from the main.swf and playing it during the preloader (before the main.swf plays).

 

 

Is there a better way to do this so that the sound from the main.swf isn't playing before it has fully been loaded ?

 

Here's my code:

 

import com.greensock.*;
import com.greensock.easing.*;
import com.greensock.plugins.*;
import com.greensock.OverwriteManager;
import com.greensock.events.LoaderEvent;
import com.greensock.loading.*
import flash.events.Event
import flash.media.Sound;
import flash.media.SoundChannel;
import flash.events.MouseEvent;


OverwriteManager.init(2)
var clipsFarm:Array = [A,B, C ];

//make them all invisible to begin with
TweenMax.allTo(clipsFarm, 0, {autoAlpha:0});

//load two sounds
var soundFarm1:MP3Loader = new MP3Loader("audio/GrasshopperFX.mp3", { autoPlay:false, volume:.05, estimatedBytes:16000});
var soundFarm2:MP3Loader = new MP3Loader("audio/PourFromCan.mp3", {autoPlay:false});




var queueFarm:LoaderMax = new LoaderMax({onComplete:FarmLoad});

queueFarm.append(soundFarm1);
queueFarm.append(soundFarm2);

queueFarm.load();

var tlFarm:TimelineMax = new TimelineMax({paused:true})

//background loop
tlFarm.addCallback(playSoundFarm1, .01);
tlFarm.append(TweenLite.to(A, 6, {autoAlpha:1}));
tlFarm.append(TweenLite.to(A, 1, {autoAlpha:0}));
tlFarm.addCallback(playSoundFarm2, 7.5);
tlFarm.append(TweenLite.to(B, 7, {autoAlpha:1}), -3);
tlFarm.append(TweenLite.to(B, 1, {autoAlpha:0}));
tlFarm.append(TweenLite.to(C, 2, {autoAlpha:1}));
tlFarm.append(TweenLite.to(C, 2, {autoAlpha:1}), -2);
/////////////////////////////////



//////////////////////////////

function FarmLoad(e:LoaderEvent):void
{
 trace("soundsComplete"); 
 tlFarm.play();
//  		sound3.soundPaused  = !sound3.soundPaused;

}



  function playSoundFarm1():void{
  soundFarm1.gotoSoundTime(0, true);
  }

function playSoundFarm2():void{
  soundFarm2.gotoSoundTime(0, true);
  }


///////////////////////////////





var contentLoader:Loader; 
loadContent("main.swf"); 

function loadContent(url:String):void { 
contentLoader = new Loader(); 
contentLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, loading); 
contentLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, contentLoaded); 
contentLoader.load(new URLRequest(url)); 
} 

function contentLoaded(evt:Event):void {
//Optionally change to a clip holder and set progressbar visibility.
addChild(contentLoader); 
} 

function loading(evt:ProgressEvent):void { 
var loaded:Number = evt.bytesLoaded / evt.bytesTotal; 
setBarProgress(loaded); 
} 

function setBarProgress(value:Number) { 
progressbar.bar.scaleX = value;
}

[GreenSock]

Why are you using a standard Loader for your swf even though you're using LoaderMax for some other loading? LoaderMax's SWFLoader makes it much easier to subload swf files and you can simply set its autoPlay special property to false, like:

var loader:SWFLoader = new SWFLoader("main.swf", {autoPlay:false, onProgress:progressHandler, onComplete:completeHandler, container:this});
loader.load();

function progressHandler(event:LoaderEvent):void {
   progressbar.bar.scaleX = event.target.progress;
}

function completeHandler(event:LoaderEvent):void {
   //do stuff.
}

SWFLoader will automatically silence the audio in the swf initially when autoPlay is false (and it will stop() the main timeline of course).

 

For tips and tricks about LoaderMax, see http://www.greensock.com/loadermax-tips/

[barredow]

Thanks for your help. I did try loading the swf with LoaderMax and still got the sound starting early so I tried a workaround of adding an extra frame to my swf and that seems to have fixed it.

 

Now I have everything in LoaderMax and I want to use use it for the preloader but I haven't found a way to sync the external swf loading progress with a tweenmax animation. So far I haven't found any examples. Do you have any advice?

 

Here's my updated code:

 

import com.greensock.*;
import com.greensock.loading.*;
import com.greensock.events.LoaderEvent;
import com.greensock.loading.display.ContentDisplay;


var soundFarm1:MP3Loader = new MP3Loader("audio/PreloaderOfficerCrop.mp3", { autoPlay:true, repeat:20, volume:.05, estimatedBytes:16000});
soundFarm1.load();





//make sure none of the bar_mc is showing
progressBar_mc.bar_mc.scaleX = 0;



//create a new SwfLoader
var mySWF:SWFLoader = new SWFLoader("main.swf", {container:this, autoPlay:false,alpha:0, onProgress:progressHandler,onComplete:completeHandler});



function progressHandler(event:LoaderEvent):void
{
progressBar_mc.bar_mc.scaleX = mySWF.progress;
}




function completeHandler(event:LoaderEvent):void
{
trace(event.target.content);

//get a reference to the content of the loader that fired the complete event
var loadedSwf:ContentDisplay = event.target.content;

		TweenLite.to(soundFarm1, 1, {volume:0});
		soundFarm1.soundPaused  = !soundFarm1.soundPaused;

TweenLite.to(loadedSwf, .5, {alpha:1});


}

function playSoundFarm1():void{
  soundFarm1.gotoSoundTime(0, true);
  }


mySWF.load();

[GreenSock]

I'm not entirely sure I correctly understand what you mean by syncing the loading with a TweenMax animation, but maybe this is what you mean...

 

var tween:TweenMax = TweenMax.to(mc, 5, {x:100, y:300, rotation:30, tint:0xFF0000, paused:true});

function loaderProgressHandler(event:LoaderEvent):void {
   tween.currentProgress = event.target.progress;
}

[barredow]

Thanks again for your help. Sorry, I think I meant to say syncing a TimelineMax animation with a progress bar and external swf load. I updated what I had and can get the animation to play but I don't think it is properly syncing with the swf load and the progress bar only goes half way before the swf loads.

 

Would you mind looking at what I have? Here's the code. I also attached the file minus the audio and external swf file if that helps.

 

 

- Alex

 

 

import com.greensock.*;
import com.greensock.loading.*;
import com.greensock.events.LoaderEvent;
import com.greensock.loading.display.ContentDisplay;


var soundFarm1:MP3Loader = new MP3Loader("audio/PreloaderOfficerCrop.mp3", { autoPlay:true, repeat:20, volume:.05, estimatedBytes:16000});
soundFarm1.load();

//make images into array so all of them can be set to zero opacity
var clipsFarm:Array = [A,B, C ];

//make them all invisible to begin with
TweenMax.allTo(clipsFarm, 0, {autoAlpha:0});

//start a timeline Max called tlFarm that will be synced with progress

var tlFarm:TimelineMax = new TimelineMax({paused:true})

tlFarm.append(TweenLite.to(A, .1, {autoAlpha:1}));
tlFarm.append(TweenLite.to(A, 6, {autoAlpha:1}));
tlFarm.append(TweenLite.to(A, .1, {autoAlpha:0}));
tlFarm.append(TweenLite.to(B, .1, {autoAlpha:1}), -3);
tlFarm.append(TweenLite.to(B, 6, {autoAlpha:0}));
tlFarm.append(TweenLite.to(B, .1, {autoAlpha:0}));
tlFarm.append(TweenLite.to(C, .1, {autoAlpha:1}));
tlFarm.append(TweenLite.to(C, 6, {autoAlpha:1}));
tlFarm.append(TweenLite.to(C, .1, {autoAlpha:0}));
tlFarm.append(TweenLite.to(A, 1, {autoAlpha:1}));

//start progress bar off at zero
progressBar_mc.bar_mc.scaleX = 0;


//create a new SWFLoader that will load your main swf
var mySWF:SWFLoader = new SWFLoader("main.swf", {container:this, autoPlay:false,alpha:0, onProgress:progressHandler,onComplete:completeHandler});




//scale progress bar and timelineMax according to swf loading progress
function progressHandler(event:LoaderEvent):void
{
progressBar_mc.bar_mc.scaleX = mySWF.progress;
tlFarm.currentProgress = mySWF.progress;
}



function playSoundFarm1():void{
  soundFarm1.gotoSoundTime(0, true);
  }

//load swf
mySWF.load();


//once swf is completely loaded stop sound and play swf
function completeHandler(event:LoaderEvent):void
{
trace(event.target.content);
	var loadedSwf:ContentDisplay = event.target.content;

//			TweenLite.to(soundFarm1, 1, {volume:0});
		soundFarm1.soundPaused  = !soundFarm1.soundPaused;

TweenLite.to(loadedSwf, .5, {alpha:1});


}

[Carl]

if you post your file as a Flash CS5 fla, i'll take a look at it later. can't open 5.5

[barredow]

Carl,

 

It's not letting me send an attachment through greensock. It said "the board attachment quota has been reached." But let me know if this yousendit link works. Appreciate it.

 

 

 

https://www.yousendit.com/download/T2dk ... QnVLRmNUQw

[Carl]

the problem is that you have progressBar_bar scaled up inside of progressBar.

 

progressBar_bar is only 200px wide at its normal size. (drag a fresh instance of this symbol to the stage and you will see).

 

you need to edit the yellow shape inside progressBar_bar it so that it to be the size you want progressBat_bar to be at scaleX = 1.