tweens not completing...

[Spudhead]

Ok, so I've got the following:

private function clicked(e:MouseEvent){
var mainImagePath = e.target._mainImagePath;
var slideshowRoot = e.target._slideshowRoot
var imgCaption = e.target._caption;

_currentMainImage = mainImagePath;

var myImagePath = slideshowRoot + "/" + mainImagePath;

var myFadeOut:Tween = new Tween(_mainImageContainer, "alpha", Regular.easeIn, 1, 0, 1, true);
myFadeOut.addEventListener(TweenEvent.MOTION_FINIS H, function(){
if (_mainImageContainer.numChildren > 0){
while(_mainImageContainer.numChildren > 0){
_mainImageContainer.removeChildAt(0);
}
}
var imgLoader:Loader = new Loader();
var imgLoaderInfo:LoaderInfo = imgLoader.contentLoaderInfo;
imgLoaderInfo.addEventListener(ProgressEvent.PROGR ESS, function(){
var myBytesLoaded = imgLoaderInfo.bytesLoaded;
var myBytesTotal = imgLoaderInfo.bytesTotal;
var myPercentLoaded = String((myBytesLoaded/myBytesTotal)*100);
_captionLabel.text = "Loaded " + myPercentLoaded + "%";
});
imgLoaderInfo.addEventListener(Event.COMPLETE, function(){
var imgBmp:Bitmap = imgLoader.content as Bitmap;
_mainImageContainer.addChild(imgBmp);
var myFadeIn:Tween = new Tween(_mainImageContainer, "alpha", Regular.easeIn, 0, 1, 1, true);
if (imgCaption != ""){
_captionLabel.text = imgCaption;
}
});
imgLoader.load( new URLRequest(myImagePath) );

});

}

Which, when a thumbnail is clicked on, should:
- fade out whatever's in the main image container
- remove anything left in the main image container
- load the new main image
- fade the main image container back in again

Now, testing this in Flash (Ctrl-Return) is fine. It works seamlessly. But when I export it to SWF and test it online, the tweens screw up - typically, the image that was in there will fade to semi-opaque and then... nothing.

I've found this thread (http://www.actionscript.org/forums/showthread.php3?t=153551) that seems to discuss a resolution to the same issue, but it's a bit beyond my understanding (something about garbage collection?) and I'm not sure how to implement the same fix with my code above.

Can anyone explain why my tweens aren't firing correctly, and suggest a possible solution, preferably in nice short easy words? :confused:

[Spudhead]

Ok, so some more googling has turned up this (http://www.scottgmorgan.com/blog/index.php/2007/11/18/as3-garbage-collection-the-reason-your-tweens-are-ending-early/) which, for me, explains slightly more clearly what's going on. The tweens are being stored in a local variable to the function and are getting overwritten each time. The answer is to put the tweens in a class-level variable (ie: an array) each time I create one.

Fine. I've done this and my tweens now run as expected. But the examples given in the links I've found so far deal with a fixed number of tweens - when that number is reached, the array is cleared and garbage collection does its job. But, as I see it, I'm dealing with a potentially unlimited number of tweens. If I went putting them willy-nilly into an array each time, I'd quickly end up filling up the array with a lot of objects that I didn't need any more. This seems bad. And I can't see how or where to go about removing them. Can I... add an event listener to the second (fade-in) tween that removes it and the previous tween from the array when its motion finishes? But what if someone clicks the next thumbnail before the previous tweens have run?? I'd end up trying to remove the wrong array element. Oh God, this is confusing :(

[dr_zeus]

Can't your remove your tween from the Array when you receive the complete event?