[z1784]

I'm relatively new to this and having a difficult time. I'm trying to build an image gallery with xml that has 2 columns of thumbnails to pick from. Once I have that though, the remove child function is causing havoc by deleting the bottom thumbnails and still allowing the images from the other column to remain on the stage-stacking up.

If anyone could help me build the thumbnails this way from one xml doc or tell me how to better remove the image from the stage while loading the next one clicked, I would be very appreciative.

var imageLoader:Loader;
var xml:XML;
var xmlList:XMLList;
var xmlLoader:URLLoader = new URLLoader();
xmlLoader.load(new URLRequest("images.xml"))

xmlLoader.addEventListener(Event.COMPLETE, xmlLoaded);

function xmlLoaded(event:Event):void

{
    xml = XML(event.target.data);
    xmlList = xml.children();
    
    for(var i:int = 0; i < xmlList.length(); i++)
    {
        imageLoader = new Loader();
        imageLoader.load(new URLRequest(xmlList[i].attribute("thumb")));
        imageLoader.x = 5;
        imageLoader.y = i * 70 + 5;
        imageLoader.name = xmlList[i].attribute("source")
        addChild(imageLoader);
        imageLoader.addEventListener(MouseEvent.CLICK, showPicture);
    }
}

function showPicture(event:MouseEvent):void
{
    removeChild(imageLoader);
    imageLoader = new Loader();
    imageLoader.load(new URLRequest(event.target.name));
    imageLoader.x = 200;
    addChild(imageLoader);

    
}

var imageLoader2:Loader;
var xml2:XML;
var xmlList2:XMLList;
var xmlLoader2:URLLoader = new URLLoader();
xmlLoader2.load(new URLRequest("images2.xml"))

xmlLoader2.addEventListener(Event.COMPLETE, xmlLoaded2);

function xmlLoaded2(event:Event):void

{
    xml2 = XML(event.target.data);
    xmlList2 = xml2.children();
    
    for(var j:int = 0; j < xmlList2.length(); j++)
    {
        imageLoader2 = new Loader();
        imageLoader2.load(new URLRequest(xmlList2[j].attribute("thumb")));
        imageLoader2.x = 70;
        imageLoader2.y = j * 70 + 5;
        imageLoader2.name = xmlList2[j].attribute("source")
        addChild(imageLoader2);
        imageLoader2.addEventListener(MouseEvent.CLICK, showPicture2);
    }
}

function showPicture2(event:MouseEvent):void
{
    removeChild(imageLoader2);
    imageLoader2 = new Loader();
    imageLoader2.load(new URLRequest(event.target.name));
    imageLoader2.x = 200;
    addChild(imageLoader2);

    
}