Thumbnails loading out of order - Kirupa XML Gallery

programming flash
1

I’m using the XML gallery with thumbnails tutorial from Kirupa, as well as some code from the forums to display multiple rows of thumbnails and to load all of the large images at once with a preloader (Scotty’s code). With a clean cache, the thumbnails load in order 99% of the time. Every subsequent time the movie is loaded, the thumbnails are loaded out of order. Here’s my actionscript (MX 2004):

function loadXML(loaded) {
    if (loaded) {
        xmlNode = this.firstChild;
        row = 0;
        col = 0;
        image = [];
        description = [];
        thumbnails = [];
        total = xmlNode.childNodes.length;
        for (i=0; i<total; i++) {
            image* = xmlNode.childNodes*.childNodes[0].firstChild.nodeValue;
            description* = xmlNode.childNodes*.childNodes[1].firstChild.nodeValue;
            thumbnails* = xmlNode.childNodes*.childNodes[2].firstChild.nodeValue;
            thumbnails_fn(i);
        }
        id = setInterval(preloadPic, 100);
    } else {
        content = "file not loaded!";
    }
}
xmlData = new XML();
xmlData.ignoreWhite = true;
xmlData.onLoad = loadXML;
xmlData.load("daily_images.xml");
var loadTot = 0;
var k = 0;
// ///////////////////////////////////
function preloadPic() {
    clearInterval(id);
    var con = picture.duplicateMovieClip("con"+k, 9984+k);
    con.loadMovie(image[k]);
    var temp = _root.createEmptyMovieClip("temp"+k, 99+k);
    temp.onEnterFrame = function() {
        var total = con.getBytesTotal();
        var loaded = con.getBytesLoaded();
        percent = Math.round((loaded/total*100)/image.length);
//        preloader.preload_bar._xscale = loadTot+percent;
        info.text = "Loading image "+k+" of "+image.length+"";
        info.embedFonts = true;
        if (loaded == total && total>4) {
            con._visible = 0;
            nextPic();
            loadTot += percent;
            delete this.onEnterFrame;
        }
    };
}
function nextPic() {
    if (k<image.length-1) {
        k++;
        preloadPic();
    } else {
        firstImage();
        trace("hit");
    }
}
listen = new Object();
listen.onKeyDown = function() {
    if (Key.getCode() == Key.LEFT) {
        prevImage();
    } else if (Key.getCode() == Key.RIGHT) {
        nextImage();
    }
};

Key.addListener(listen);
previous_btn.onRelease = function() {
    prevImage();
};
next_btn.onRelease = function() {
    nextImage();
};
// ///////////////////////////////////
var p = 0;
this.onEnterFrame = function() {
    filesize = picture.getBytesTotal();
    loaded = picture.getBytesLoaded();
    preloader._visible = true;
    if (loaded != filesize) {
        preloader.preload_bar._xscale = 100*loaded/filesize;
    } else {
//        info._visible = false;
        if (picture._alpha<100) {
            picture._alpha += 10;
        }
    }
};
function nextImage() {
    if (p<(total-1)) {
        p++;
        if (loaded == filesize) {
            info._visible = false;
            picture._alpha = 0;
            picture.loadMovie(image[p], 1);
            desc_txt.text = description[p];
            picture_num();
        }
    }
}
function prevImage() {
    if (p>0) {
        p--;
        picture._alpha = 0;
        picture.loadMovie(image[p], 1);
        desc_txt.text = description[p];
        picture_num();
    }
}
function firstImage() {
    if (loaded == filesize) {
        info._visible = false;
        picture._alpha = 0;
        picture.loadMovie(image[0], 1);
        desc_txt.text = description[0];
        picture_num();
    }
    _root.sounds.loadMovie("affairs.swf");//music
}

function picture_num() {
    current_pos = p+1;
    pos_txt.text = current_pos+" / "+total;
}

function thumbnails_fn(k) {
    thumbnail_mc.createEmptyMovieClip("t"+k, thumbnail_mc.getNextHighestDepth());
    tlistener = new Object();
    tlistener.onLoadInit = function(target_mc) {
        target_mc._x = hit_left._x+(target_mc._width+5)*col;//use col instead of k 
        //new line added
        col++;
        target_mc._y=row*(target_mc._height+3);
        /*
        2 is the gap between the rows
        */
        if(col>=6)// 4 is the maximum number of columns you want in one row
        {
            row++;
            col=0;
        }
        target_mc.pictureValue = k;
        target_mc.onRelease = function() {
            p = this.pictureValue-1;
            nextImage();
            };
            target_mc.onRollOver = function() {
                this._alpha = 50;
                thumbNailScroller();
                };
                target_mc.onRollOut = function() {
                    this._alpha = 100;
                    };
                    };
                    
image_mcl = new MovieClipLoader();
image_mcl.addListener(tlistener);
image_mcl.loadClip(thumbnails[k], "thumbnail_mc.t"+k);
}

Here’s the gallery: http://www.frankenyimages.com/movie3.html

I’m really happy with the results I’ve been able to achieve using all of the things that I’ve found on this site. I just have this one thing holding me back from being finished. If anyone can help, I would greatly appreciate it :3