(AS3) Loading Thumbnails from XML in Numerical / Descending Order

Question

It's been 2 days and counting since I started to debug my code to make it work and It's eating up all my time and I don't think I'll hit my deadline If I don't start asking.

I'm not a pro, so please be gentle with the codes. :D

The gallery is working well, It can load the thumbnails smoothly without returning any error. However, the thumbnails doesn't load as expected, I think because the smallest file size gets to load first. So if thumbnail[3] is the smallest, it'll attach itself to thumbnail_container[0] which it should always be thumbnail[0] to thumbnail_container[0] and so on.

Here's my Code :

        //THIS IS THE CONTAINER         
        for (var i:int = 0; i < thumbBatches[aj]; i++)
        {
            thumbX = 44.35 + (thumbWidth + 18) * i;
            var itemThumb:thumbH = new thumbH();
            itemThumb.x = thumbX;
            itemThumb.y = thumbY;
            itemThumb.name = "" + i + (8 * aj);
            itemThumb.addEventListener(MouseEvent.CLICK, openFullItem);
            level2.addChild(itemThumb);
            IthumbList[i + (8 * aj)] = itemThumb;
        }

        //THIS WILL LOAD THE THUMBNAILS
        for (var n:int = 0; n < potteryIDnum.length; n++)
        {
            var imgLoader:Loader = new Loader();
            imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);
            imgLoader.load(new URLRequest(potteryThumbs[n]));
        }

        // AFTER LOADING IT, IT'LL BE ASSIGNED TO AN ARRAY
       // THEN AFTER THE LAST IMAGE HAS BEEN LOADED WILL BE ATTACHED TO THE CONTAINER
        function loadComplete(e:Event):void
        {
            IthumbImages.push(e.target.content);
            if (IthumbList.length == IthumbImages.length)
            {
                for (var k:int = 0; k < IthumbImages.length; k++)
                {
                    var fadeInThumbs:Tween = new Tween(IthumbList[k],"alpha",Strong.easeInOut,0,1,0.3 * (k + 0.5),true);
                    IthumbList[k].addChild(IthumbImages[k]);
                }
            }
        }

Thanks in Advance!

Answer 1

I have already answered to similar question. However that was about the URLLoader class.

For Loader class case , it should be:

    dynamic class DynamicLoader extends Loader{}

And finally, the modified code:

    var remainingLoads:uint = potteryIDnum.length; 
    //THIS WILL LOAD THE THUMBNAILS
    for (var n:int = 0; n < potteryIDnum.length; n++)
    {
        var imgLoader:DynamicLoader = new DynamicLoader();
        imgLoader.index = n;
        imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, loadComplete);
        imgLoader.load(new URLRequest(potteryThumbs[n]));
    }

    // AFTER LOADING IT, IT'LL BE ASSIGNED TO AN ARRAY
    // THEN AFTER THE LAST IMAGE HAS BEEN LOADED WILL BE ATTACHED TO THE CONTAINER
    function loadComplete(e:Event):void
    {
        IthumbImages[ DynamicLoader(e.target.loader).index ] = e.target.content;
        if (--remainingLoads == 0)
        {
            for (var k:int = 0; k < IthumbImages.length; k++)
            {
                var fadeInThumbs:Tween = new Tween(IthumbList[k],"alpha",Strong.easeInOut,0,1,0.3 * (k + 0.5),true);
                IthumbList[k].addChild(IthumbImages[k]);
            }
        }
    }