XML Dynamic Gallery help - PLZ

programming flash
1

Hi all, I am new to AS3, I am having difficulty building a photo gallery. I want to load an image to a certain size on the stage (the holder size) and then on click I want the main holder to expand to the size of the original loaded image, and then enable panning for the image. I found it hard to break the process into simple steps, dynamically I ended up creating to many movieClips and sprites.
This is my code so far:
import caurina.transitions.*;

var xmlLoader:URLLoader = new URLLoader();
var xml:XML;
var xmlList:XMLList;
var images:int; // Total images in trhe xml;
var thumbsArray:Array; // Holds all the Thumbs
var imagesArray:Array; // Holds all the big Images
var counter:Number = 0; // Counter
var spacing:Number = 10;
var initialScale:Number = 50;
var totalScale:Number = 180;

infoBox.closeBtn.buttonMode = true;
infoBox.closeBtn.addEventListener(MouseEvent.CLICK, closeInfo);
function closeInfo(e:Event):void{
Tweener.addTween(infoBox, {y:-330, time:1, transition:“linear”});

}

var thumbsHolder:Sprite = new Sprite();// To hold all the Thumbs
thumbsContainer.addChild(thumbsHolder);

// Loading the Big Image
var loader:Loader = new Loader();
var loaderX:Number = mainHolder.x;//x Position of large image
var loaderY:Number = mainHolder.y;//y Position of large image
var maxHeight:Number = 600;//Maximum height of loaded image
var maxWidth:Number = 340;//Maximum width of loaded image
loader.x = loaderX;
loader.y = loaderY;
mainHolder.addChild(loader);
loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, loadProgress);
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, laodBigImage);

// Create a Text field for the loader percentage
var loadPercent:TextField = new TextField();
loadPercent.autoSize = TextFieldAutoSize.RIGHT;
loadPercent.width = 100;
mainHolder.addChild(loadPercent);

//
function loadProgress(event:ProgressEvent):void {
var percent:Number = Math.round(event.bytesLoaded/event.bytesTotal)* 100;
loadPercent.text = percent + “%”;
}

xmlLoader.load(new URLRequest(“load/gallery.xml”));
xmlLoader.addEventListener(Event.COMPLETE, onComplete);

function onComplete(e:Event):void{
parseXML(e);
loadPercent.visible = false;
}
function parseXML(e:Event){
xml = new XML(e.target.data);
xmlList = xml.image;
images = xmlList.length();

//trace (xmlList);
//trace(xml.image.@thumb);
for(var i:int = 0; i < images; i++){
    var thumb:MovieClip = new MovieClip();
    var thumbLoader:Loader = new Loader();
    thumb.x = 70 * i + spacing;
    thumb.y = 5;
    thumb.id = xmlList*;
     thumb.thumbName = xml.image*.@name;
    thumb.thumbSrc = xml.image*.@thumb;
    thumb.imageSrc = xml.image*.@url;
    thumb.thumbDesc = xml.image*.@description;
    thumb.mouseChildren = false;
    thumb.buttonMode = true;
    thumbLoader.load(new URLRequest(xmlList[counter].@thumb));
    thumbsHolder.addChild(thumb);
    Tweener.addTween(thumb, {alpha:1, time:(.2*counter)+.5, transition: "easeInExpo"});
    thumb.addChild(thumbLoader);
    thumb.addEventListener(MouseEvent.CLICK, thumbClicked);

    trace(thumb.id);
    //trace(thumb.thumbName);
    counter++;
}

}
function thumbClicked(ev:MouseEvent):void {
// populate the info box
//trace(ev.target.thumbName);
infoBox.name_txt.text =ev.target.thumbName;
infoBox.desc_txt.text =ev.target.thumbDesc;

mainHolder.removeChild(loader);
loader.x = stage.stageWidth/2 - loader.width/2;
loader.y = stage.stageHeight/2 - loader.height/2;
loader.load(new URLRequest(ev.target.imageSrc));
Tweener.addTween(loader, {scaleX:.4,scaleY:.4, time:1, transition:"linear"});

}

function laodBigImage(ev:Event):void {
if (loader.height > maxHeight) {
loader.width *= (maxHeight / loader.height);
loader.height = maxHeight;
}
if (loader.width > maxWidth) {
loader.height *= (maxWidth / loader.width);
loader.width = maxWidth;
}

Tweener.addTween(loader, {scaleX:.4,scaleY:.4, time:1, transition:"linear"});
mainHolder.addChild(loader);

}

mainHolder.addEventListener(MouseEvent.CLICK, moveBigImage);

/*
This formula is not working
*/
function moveBigImage(e:MouseEvent):void{
//mainHolder.width = loader.width;
//mainHolder.height = loader.height;
var d:Number = 10;
var imgX:Number = mouseX;
var imgY:Number = mouseY;
var formula = ((stage.stageWidth/2)-(e.target.width/2)) / stage.stage.width/2;
e.target.x = ((e.target.x - formula * imgX)-(e.target.width/2))/d;

THANKS A LOT FOR YOUR HELP