Load image problem

I have tihs code to load some thumbs with XML. That works fine. Where I’m stuck right now is how to load the appropriate large image when thumb is clicked?

I need them to load into the imageContainer Loader.

Hope someone have the time to hint on this… :slight_smile:


[COLOR="Silver"]// Starting X and Y positions for the thumbs[/COLOR]
thisX = 30;
thisY = 33;

[COLOR="Silver"]// Put imageContainer on stage[/COLOR]
var imageContainer:Loader = new Loader;
imageContainer.x = 0;
imageContainer.y = 33;
addChildAt(imageContainer, 0);

[COLOR="Silver"]// Load XML document[/COLOR]
var myXML:XML;

var loadXML:URLLoader = new URLLoader();
loadXML.addEventListener(Event.COMPLETE, onXmlComplete);
loadXML.load(new URLRequest("peterContent.xml"));

function onXmlComplete(event:Event):void {
	try {
		myXML = new XML(event.target.data);
		var uppdrag:XMLList = myXML.uppdrag;
		var thumbs:XMLList = myXML.uppdrag.thumbs;
		var large:XMLList = myXML.uppdrag.large;
		var thumbs_array:Array = new Array();
		var large_array:Array = new Array();
		var i:int;
		var galleryLength:int = uppdrag.length();
		for (i = 0; i < galleryLength; i++) {
			thumbs_array.push({src:thumbs*.text()});
			large_array.push({src:large*.text()});
		}
		displayThumbs(thumbs_array); // start load of thumbs
	} catch (error:Error) {
		trace(error.message);
	}
}

[COLOR="Silver"]// create new movie clips on the stage[/COLOR]
function displayThumbs(thumbs_array:Array):void {
	var i:int;
	var galleryLength:Number = thumbs_array.length;
	// loop through each of the images in the thumbs_array.
	for (i = 0; i<galleryLength; i++) {
		// create a movie clip instance which holds the image. We'll also set a variable, 
		// thisMC, which is an alias to the movie clip instance.
		var thumbLoader:Loader = new Loader();
		thumbLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, thumbLoadComplete);
		thumbLoader.load(new URLRequest(thumbs_array*.src));

		var thisMC:MovieClip = new MovieClip();
		thisMC.buttonMode = true;
		thisMC.alpha = 0;
		thisMC.x = thisX;
		thisMC.y = thisY;
		thisMC.addChild(thumbLoader);
		addChild(thisMC);

		[COLOR="Silver"]// 9 columns of thumbs, then new row[/COLOR]
		if (((i + 1) % 9) == 0) {
			// reset the X and Y positions
			thisX = 30;
			thisY += 100 + 5;
		} else {
			thisX += 100 + 5;
		}
	}
}

function thumbLoadComplete(event:Event):void {
	var thumbLoader:Loader = LoaderInfo(event.currentTarget).loader as Loader;
	var thisMC:MovieClip = thumbLoader.parent;
	
	[COLOR="Silver"]// apply a drop shadow on thumbs[/COLOR]
	var shadow:DropShadowFilter = new DropShadowFilter();
	shadow.distance = 3;
	shadow.angle = 45;
	shadow.alpha = .3;
	shadow.blurX = 5;
	shadow.blurY = 5;
	thisMC.filters = [shadow];
	
	[COLOR="Silver"]// fade thumbs to 70%[/COLOR]
	Tweener.addTween(thisMC, {alpha:.7, time:2});

	thisMC.addEventListener(MouseEvent.CLICK, mouseClickHandler);
	thisMC.addEventListener(MouseEvent.MOUSE_OVER, mouseOverHandler);
	thisMC.addEventListener(MouseEvent.MOUSE_OUT, mouseOutHandler);
}

[COLOR="Silver"]// Load large image[/COLOR]
function mouseClickHandler(event:MouseEvent):void {
	var thisMC:MovieClip = event.currentTarget as MovieClip;
	[COLOR="Red"]// this is where I want to load the large image[/COLOR]
}

[COLOR="Silver"]// Fade thumbs to 100% - scale to 99% - change drop shadow[/COLOR]
function mouseOverHandler(event:MouseEvent):void {
	var thisMC:MovieClip = event.currentTarget as MovieClip;
	Tweener.addTween(thisMC, {alpha:1, time:.5});
	thisMC.scaleX = .99;
	thisMC.scaleY = .99;
	var shadow:DropShadowFilter = new DropShadowFilter();
	shadow.distance = 2;
	shadow.angle = 45;
	shadow.alpha = .3;
	shadow.blurX = 2;
	shadow.blurY = 2;
	thisMC.filters = [shadow];
}

[COLOR="Silver"]// Fade thumbs to 70% - scale to 100% - reset drop shadow[/COLOR]
function mouseOutHandler(event:MouseEvent):void {
	var thisMC:MovieClip = event.currentTarget as MovieClip;
	Tweener.addTween(thisMC, {alpha:.7, time:.5});
	thisMC.scaleX = 1;
	thisMC.scaleY = 1;
	var shadow:DropShadowFilter = new DropShadowFilter();
	shadow.distance = 3;
	shadow.angle = 45;
	shadow.alpha = .3;
	shadow.blurX = 5;
	shadow.blurY = 5;
	thisMC.filters = [shadow];
}