XML Gallery unload

programming flash
1

ok so i did the tutorial on republic of code for an xml grid gallery.

I altered the code so that i have thumbs on the left and loaded images on the right.

  • Framed it nicely with a MC that changes to the pic size
  • added scrolling to the thumbs

point is it is really a nice gallery however, As I don’t need to hide the thumbs or click on the large image to get rid of it (because the thumbs are to the left and large images load to the right) all items are visible at all times.

Here’s the problem I’ve lost the ability to unload the large image so when I load other images they just load over the top.

I tried adding in unload and remove child code however I kept getting errors when testing which I think had something to do with the preloaders for the large images.

Anyway here is my current code.

import fl.controls.ProgressBar;
import caurina.transitions.Tweener;


var GridColumns:Number = 2;
var ThumbWidth:Number;
var ThumbHeight:Number;
var GalleryThumbs:XMLList;
var TotalThumbs:Number;
var GridCounter_x:Number = 0;
var GridCounter_y:Number = 0;

var ThumbsContainer_MC:MovieClip;
var ThumbsPreloader:MovieClip;
var XMLLoader:URLLoader = new URLLoader();


ImageCon_MC.Frame_MC.boxMC.alpha = 0;
ImageCon_MC.x = 275;
ImageCon_MC.y = 50;


// Load XML data
XMLLoader.load(new URLRequest("Gallery.xml"));
XMLLoader.addEventListener(Event.COMPLETE, ProcessXML);

//Process XML information
function ProcessXML (e:Event):void{
    var galleryXML:XML = new XML(e.target.data);
    
    ThumbWidth = galleryXML.@Width;
    ThumbHeight = galleryXML.@Height;
    GalleryThumbs = galleryXML.IMAGE;
    TotalThumbs = GalleryThumbs.length();


// Call loader functions
    CreateThumbContainer();
    CallThumbs();

}





// Creates thumbnail container
function CreateThumbContainer():void{
    ThumbsContainer_MC = new MovieClip();
    ThumbsContainer_MC.x = ThumbBox_MC.x + 20;
    ThumbsContainer_MC.y = 0;
    ThumbBox_MC.addChild(ThumbsContainer_MC);
    
    // thumb button listener
    ThumbsContainer_MC.addEventListener(MouseEvent.MOUSE_DOWN, CallImage);
    
    ThumbsPreloader = new MovieClip();
    ThumbsPreloader.x = ThumbsContainer_MC.x;
    ThumbsPreloader.y = ThumbsContainer_MC.y;
    ThumbBox_MC.addChild (ThumbsPreloader);
}





// Loads thumbnails from external
function CallThumbs():void{
    for (var i:Number = 0; i < TotalThumbs; i++){
        
        var ThumbURL = GalleryThumbs*.@THUMB;;
        var ThumbLoader = new Loader();
        ThumbLoader.load(new URLRequest(ThumbURL));
        ThumbLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, ThumbLoaded);
        
        ThumbLoader.name = i;
        
        ThumbLoader.x = (ThumbWidth+20)*GridCounter_x;
        ThumbLoader.y = (ThumbHeight+20)*GridCounter_y;
        
        if (GridCounter_x+1 < GridColumns){
            GridCounter_x++;
        } else {
            GridCounter_x = 0;
            GridCounter_y++;
        }

        // Sets the dimensions and colour tint of progress bar for thumbs
        // adds it to the stage and sets function to remove on 100%
        var ThumbPB:ProgressBar = new ProgressBar();
        var Tint:ColorTransform = ThumbPB.transform.colorTransform;
        
        ThumbPB.source = ThumbLoader.contentLoaderInfo;
        
        ThumbPB.x = ThumbLoader.x + 10;
        ThumbPB.y = ThumbLoader.y + (ThumbHeight -10)/2;
        ThumbPB.width = ThumbWidth -20;
        ThumbPB.height = 10;
        
        ThumbsPreloader.addChild(ThumbPB);        
        
        Tint.color = 0x33CC00;
        ThumbPB.transform.colorTransform = Tint;
        
        ThumbPB.addEventListener(Event.COMPLETE, ThumbPBComplete);
    }
}






// delete progressbars
function ThumbPBComplete (e:Event):void{
    var pb:ProgressBar = ProgressBar(e.target);
    ThumbsPreloader.removeChild(pb);
}






// Displays thumbnails
function ThumbLoaded(e:Event):void{
    var thumb:Loader = Loader(e.target.loader);
    ThumbsContainer_MC.addChild(thumb);
    thumb.alpha = 0;
    Tweener.addTween(thumb,{alpha:1, time:0.5, transition:"linear"});
}







// call large image function
function CallImage(e:MouseEvent):void{
    var ImageURL = GalleryThumbs[e.target.name].@FULL;
    var ImagePB:ProgressBar = new ProgressBar();
    var Tint:ColorTransform = ImagePB.transform.colorTransform;
    var ImageLoader:Loader = new Loader();
    //var ImagePreloader:Loader = new Loader();

    
    //ImageLoader.unload();
    //removeChild(ImageLoader);
    ImageLoader.load(new URLRequest(ImageURL));
    ImageLoader.contentLoaderInfo.addEventListener(Event.INIT, ImageLoaded);


    // Sets the dimensions and colour tint of progress bar for main image
    // adds it to the stage and sets function to remove on 100%

    ImagePB.source = ImageLoader.contentLoaderInfo;
    ImagePB.x = 0;
    ImagePB.y = (stage.stageHeight - ImagePB.height)/2;
    ImagePB.height = 10;
    ImageCon_MC.addChild(ImagePB);

    Tint.color = 0x33CC00;
    ImagePB.transform.colorTransform = Tint;
    
    ImagePB.addEventListener(Event.COMPLETE, ImagePBComplete);
}








function ImagePBComplete (e:Event):void{
    var pb:ProgressBar = ProgressBar(e.target);
    
    ImageCon_MC.removeChild(pb);
}





// display and centre the Main Image
function ImageLoaded(e:Event):void{
    var ImageLoader:Loader = Loader(e.target.loader);
    
    
    ImageCon_MC.Frame_MC.addChild(ImageLoader);
    ImageLoader.alpha = 0;
    
    Tweener.addTween(ImageLoader,{alpha:1, time:0.5, transition:"linear"});
    Tweener.addTween(ImageCon_MC.Frame_MC.boxMC,{alpha:1, time:0.5, transition:"linear"});
    
    ImageLoader.x = (ImageCon_MC.Frame_MC.boxMC.x +10);//(stage.stageWidth - ImageLoader.width);
    ImageLoader.y = (ImageCon_MC.Frame_MC.boxMC.y +10);//(stage.stageHeight - ImageLoader.height);
    
    
    // Frame Fit image
    ImageCon_MC.Frame_MC.boxMC.x = ImageLoader.x - 10;
    ImageCon_MC.Frame_MC.boxMC.y = ImageLoader.y - 10;
    ImageCon_MC.Frame_MC.boxMC.width = ImageLoader.width + 20;
    ImageCon_MC.Frame_MC.boxMC.height = ImageLoader.height + 20;
    
}

If anyone could help out here I would be greatly appreciated.

Thankyou all very much
Websp1nner :smiley:

ps sorry for the messy code I haven’t tidied yet