Photogallery

1

hi, i have a problem, i think all images are loading in the same time. how can i let each category load seperate? i have this code.

 
import fl.transitions.Tween;
import fl.transitions.easing.*;
this.buttonMode = true;
this.useHandCursor = true;
var xml:XML;
var xmlList:XMLList;
var xmlLoader:URLLoader = new URLLoader();
var current_index:int = -1;
var total_images_in_category:int = 0;
function loadData(file)
{
 // clean previous categ buttons
 for(var j=categs_mc.numChildren-1; j>=0; j--){
  categs_mc.removeChildAt(j);
 }
 // clean previous thumbs
 for(var i=grid.numChildren-1; i>=0; i--){
  grid.removeChildAt(i);
 }
 xmlLoader.load(new URLRequest(file));
}
loadData("data/fashion-management/modeling/local.xml");
xmlLoader.addEventListener(Event.COMPLETE, xmlLoaded);
function xmlLoaded(event:Event):void
{
 // show categories list
 xml = XML(event.target.data);
 var categs:XMLList = xml.children();
 for(var i:int=0; i<categs.length(); i++){
  var cat = new CategItem();
  cat.label_txt.text = categs*.attribute("name");
  cat.y = i * cat.height;
  cat.name = "categ"+i;
  categs_mc.addChild(cat);
  new Tween(categs_mc, "alpha", Strong.easeIn, categs_mc.alpha, 1, 100);
  cat.index = i;
  cat.mouseChildren = false;
  cat.addEventListener(MouseEvent.CLICK, function(e){
   showCateg(e.target.index);
  })
 }
 //heighttxt_txt
 // show first category
 showCateg(0);
}
var active_categ = null;
function showCateg(index:int):void
{
 // clean previous thumbs
 for(var i=grid.numChildren-1; i>=0; i--){
  grid.removeChildAt(i);
 }
 //xmlList = xml.children();
 if(active_categ != null ) active_categ.gotoAndStop(1);
 active_categ = categs_mc.getChildByName("categ"+index);
 active_categ.gotoAndStop(2);
 xmlList = xml.children()[index].children();
 details_mc.height_txt.text = xml.children()[index].attribute("height");
 details_mc.weight_txt.text = xml.children()[index].attribute("weight");
 details_mc.hair_txt.text = xml.children()[index].attribute("hair");
 details_mc.eyes_txt.text = xml.children()[index].attribute("eyes");
 var cols = 4;
 total_images_in_category = xmlList.length();
 var rows = Math.ceil(total_images_in_category/cols);
 var count = -1;
 for(var r:int=0; r<rows; r++){
  for(var c:int=0; c<cols; c++){
   count ++;
   if(count > total_images_in_category-1) break;
   var imageLoader:GridItem = new GridItem();
   var ldr:Loader = new Loader();
   ldr.load(new URLRequest(xmlList[count].attribute("thumb")));
   imageLoader.x = c * 87;
   imageLoader.y = r * 30;
   imageLoader.mouseChildren = false;
   imageLoader.name = xmlList[count].attribute("source");
   imageLoader.img.addChild(ldr);
   imageLoader.index = count;
   grid.addChild(imageLoader);
   imageLoader.addEventListener(MouseEvent.CLICK, function(e){
   showPicture(e.target.index);
   });
  }
 }
 // show first image in this category
 showPicture(0);
}
var active_thumb = null;
function showPicture(index:int)
{
 // clean previous thumbs
 for(var i=big_host.numChildren-1; i>=0; i--){
  big_host.removeChildAt(i);
 }
 var img_name = xmlList[index].attribute("source")
 if(active_thumb != null) {
  active_thumb.gotoAndStop(1);
 }
 active_thumb = grid.getChildByName(img_name);
 active_thumb.gotoAndStop(2);
 var imageLoader:Loader = new Loader();
 imageLoader.load(new URLRequest(img_name));
 big_host.addChild(imageLoader);
 current_index = index;
}
next_btn.addEventListener(MouseEvent.CLICK, function(){
 current_index++;
 if(current_index > total_images_in_category-1) current_index=0;
 showPicture(current_index)
});
prev_btn.addEventListener(MouseEvent.CLICK, function(){
 current_index--;
 if(current_index < 0) current_index = total_images_in_category-1;
 showPicture(current_index)
});