addListener(), getProgress(), loading images!

Hello all, I have been working on this for a very long time, not days but weeks…

Background to my project is a image gallery programme using Flash and PHP. The PHP creates the XML files with data from a SQL table. The Flash project selects the catagory of images to load based on a GUI. Hope this is reasonably clear???

Not to load you all with my code, I shall give a snippet of each function and the order they appear in the .fla file.

// my gallery .fla file

function watchMyImageLoad(mcLoader:MovieClipLoader, image:MovieClip):Void
{
// this function is run as per the setInterval setting
[COLOR=Orange]trace(“watchMyImageLoad”);[/COLOR]
}

var mclListener:Object = new Object();
mclListener.onLoadComplete = function(image_mc:MovieClip)
{
// I have this included (at the moment) just to see whats happening
[COLOR=Orange]trace(“mclListener.onLoadComplete”);[/COLOR]
}

mclListener.onLoadInit = function(image_mc:MovieClip)
{
// this function i add a mask to the image and place a border around it
var maskClip:MovieClip = image_mc.createEmptyMovieClip(“mask_mc”, image_mc.getNextHighestDepth());

     with (maskClip) 
     {
             // the mask
     }
     image_mc.setMask(maskClip);

     with (image_mc._parent.borderClip) 
     {
             // the border
     }

}

[COLOR=black]function loadImages()
{

[/COLOR]    [COLOR=black]while (xPosition +(imageWidthList[leftPictureNumber+imagesDisplayed]+(borderThickness*3)) < 700)

[/COLOR] [COLOR=black] {
[/COLOR] [COLOR=black] var img_mcl:MovieClipLoader = new MovieClipLoader();
[/COLOR] [COLOR=black] linkLayer = this.createEmptyMovieClip(“link”+(leftPictureNumber+imagesDisplayed), _root.getNextHighestDepth());
[/COLOR] [COLOR=black] linkLayer.createEmptyMovieClip(“borderClip”, linkLayer.getNextHighestDepth());
[/COLOR] [COLOR=black] linkLayer.createEmptyMovieClip(“picture”, linkLayer.getNextHighestDepth());

[/COLOR] [COLOR=black] img_mcl.addListener(mclListener);
[/COLOR] [COLOR=black] var intervalImage:Number = 0;
[/COLOR] [COLOR=black] clearInterval(intervalImage);
[/COLOR] [COLOR=black] intervalImage = setInterval(watchMyImageLoad, 1000, img_mcl, linkLayer.picture);
[/COLOR] [COLOR=black] img_mcl.loadClip(imageNameList[leftPictureNumber+imagesDisplayed], linkLayer.picture);
[/COLOR] [COLOR=black] imagesDisplayed++;
[/COLOR] [COLOR=black][COLOR=Orange] trace(“loadImages”);[/COLOR]
[/COLOR] [COLOR=black] }
}

The [COLOR=Orange]trace()[/COLOR] outputs are as follows…
loadImages
loadImages
loadImages
mclListener.onLoadComplete
mclListener.onLoadComplete
mclListener.onLoadComplete
watchMyImageLoad
watchMyImageLoad
watchMyImageLoad
watchMyImageLoad
watchMyImageLoad
watchMyImageLoad
watchMyImageLoad
watchMyImageLoad
watchMyImageLoad

There are 3 images, so the [COLOR=Orange]loadImages /COLOR and [/COLOR][COLOR=black][COLOR=Orange]mclListener.onLoadComplete[/COLOR] [/COLOR][COLOR=black]are correct. You notice that the [/COLOR][COLOR=Orange]watchMyImageLoad[COLOR=Black] are in multiples of 3 and continues to run, which is my problem that I am asking for any help.

I am expecting the [/COLOR][/COLOR][COLOR=Orange]watchMyImageLoad[COLOR=Black] only to appear 3 times as there are only 3 images. I believe to stop this continuous repeating of the [/COLOR][/COLOR][COLOR=Orange]watchMyImageLoad[COLOR=Black] function I use the [/COLOR][/COLOR][COLOR=black] clearInterval(intervalImage); statement?

Ok so here is the current [/COLOR][COLOR=black]watchMyImageLoad function…[/COLOR]
[COLOR=black]
function watchMyImageLoad(mcLoader:MovieClipLoader, image:MovieClip):Void
{
trace(">> checking progress now");
var progress:Object = mcLoader.getProgress(image);
perc = progress.bytesLoaded / progress.bytesTotal;
trace("bytesLoaded: " + progress.bytesLoaded + " bytesTotal: " + progress.bytesTotal);

if (perc == 1)
{
    // I display a pre-loading graphic
    clearInterval(intervalImage);
    trace("clearInterval(intervalImage);");
    perc = 0;
}

}

Now the [/COLOR][COLOR=black][COLOR=Orange]trace()[/COLOR] outputs are as follows…
loadImages
loadImages
loadImages
mclListener.onLoadComplete
mclListener.onLoadComplete
mclListener.onLoadComplete
>> checking progress now
bytesLoaded: 9543 bytesTotal: 9543
clearInterval(intervalImage);
>> checking progress now
bytesLoaded: 5920 bytesTotal: 5920
clearInterval(intervalImage);
>> checking progress now
bytesLoaded: 8879 bytesTotal: 8879
clearInterval(intervalImage);
>> checking progress now
bytesLoaded: 9543 bytesTotal: 9543
clearInterval(intervalImage);
>> checking progress now
bytesLoaded: 5920 bytesTotal: 5920
clearInterval(intervalImage);
>> checking progress now
bytesLoaded: 8879 bytesTotal: 8879
clearInterval(intervalImage);

Que: Do I have the order of the functions in the .fla file wrong?
Que: Have I total got all this wrong?
Que: Can any one shed some light on this, Please???

Many thanks
[/COLOR]