[akuria]

I am trying to get a pop up window to come up when you click on a image in my gallery. i go the window to come up but the image does not show up. can someone help with my coding.

here is my gallery.mxml

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:s="library://ns.adobe.com/flex/spark"
		 xmlns:fx="http://ns.adobe.com/mxml/2009"
		 xmlns:ATE="http://ns.adobe.com/ate/2009"
		 xmlns:ai="http://ns.adobe.com/ai/2009"
		 xmlns:d="http://ns.adobe.com/fxg/2008/dt"
		 xmlns:flm="http://ns.adobe.com/flame/2008"
		 xmlns:lib="assets.graphics.slider.*"
		 xmlns:fc="http://ns.adobe.com/flashcatalyst/2009"
		 xmlns:mx="library://ns.adobe.com/flex/mx"
		 xmlns:components="components.*"
		 width="970" height="511"
		 initialize="onInit()">
	
	<fx:Script>
		<![CDATA[
			import mx.collections.ArrayCollection;
			
			import spark.effects.Fade;
			import spark.events.IndexChangeEvent;
			import spark.events.RendererExistenceEvent;
			
			import valueObjects.ImageVO;
			import valueObjects.SectionVO;
			
			import mx.managers.PopUpManager;
			
			[Bindable]
			public var selectedSection:SectionVO;
			public var selectedIndex:Number;
			public var autoTimer:Timer;
			public var idleTimer:Timer;
			
			public var sectionData:Array=new Array();
			public var xmlLoader:URLLoader=new URLLoader();
			
			public function onInit():void
			{
				xmlLoader.addEventListener(Event.COMPLETE, handleLoadComplete);
				xmlLoader.load(new URLRequest("assets/designImageData.xml"));
				
				autoTimer=new Timer(4000);
				autoTimer.addEventListener(TimerEvent.TIMER, handleAutoTimerEvent);
				
				idleTimer=new Timer(60000);
				idleTimer.addEventListener(TimerEvent.TIMER, handleIdleTimerEvent);
			}
			
			public function handleAutoTimerEvent(event:TimerEvent):void
			{
				setSelectedIndex(selectedIndex + 1);
			}
			
			public function handleIdleTimerEvent(event:TimerEvent):void
			{
				idleTimer.stop();
				idleTimer.reset();
				autoTimer.start();
			}
			
			public function stopTimer():void
			{
				autoTimer.stop();
				autoTimer.reset();
			}
			
			public function handleLoadComplete(e:Event):void
			{
				var image:ImageVO;
				var section:SectionVO;
				var xmlData:XML=new XML(e.target.data);
				
				for each (var sectionList:XML in xmlData..section)
				{
					section=new SectionVO();
					section.name=sectionList.@name;
					
					for each (var item:Object in sectionList.item)
					{
						image=new ImageVO();
						image.thumb=item.thumb;
						image.image=item.image;
						section.items.addItem(image);
					}
					
					sectionData.push(section);
				}
				
				navList.dataProvider=new ArrayCollection(sectionData);
				navList.selectedIndex=0;
				selectedSection=sectionData[0];
				setSelectedIndex(0);
				autoTimer.start();
			}
			
			public function indexChangeHandler(event:IndexChangeEvent):void
			{
				idleTimer.reset();
				idleTimer.start();
				selectedSection=sectionData[event.newIndex];
				setSelectedIndex(0);
			}
			
			public function handleThumbAdd(event:RendererExistenceEvent):void
			{
				event.renderer.addEventListener(MouseEvent.CLICK, handleThumbClick);
			}
			
			public function handleThumbClick(event:Event):void
			{
				stopTimer();
				idleTimer.reset();
				idleTimer.start();
				var image:ImageVO=event.currentTarget.data as ImageVO;
				setSelectedIndex(selectedSection.items.getItemIndex(image));
			}
			
			public function setSelectedIndex(value:Number):void
			{
				if (value >= selectedSection.items.length)
				{
					value=0;
				}
				
				var selectedImage:ImageVO=selectedSection.items.getItemAt(value) as ImageVO;
				
				if (selectedIndex != value)
				{
					var pic1:Image=images.removeElementAt(0) as Image;
					var pic2:Image=images.getElementAt(0) as Image;
					
					pic1.source=selectedImage.image;
					pic1.alpha=0;
					images.addElement(pic1);
					
					var fade:Fade=new Fade(pic1);
					fade.alphaTo=1;
					fade.duration=1500;
					fade.play();
					selectedIndex=value;
					
					var fade1:Fade=new Fade(pic2);
					fade1.alphaTo=0;
					fade1.duration=1000;
					fade1.play();
				}
			}
			
			private function launchPopUp(e:MouseEvent):void {
				if(images.selectedImage){
					var win : Window = new Window();
					PopUpManager.addPopUp(win,this,true);
					PopUpManager.centerPopUp(win);
			}
		}
			
		]]>
	</fx:Script>
	
	<s:List id="navList" y="0" 
			width="160" height="511" 
			allowMultipleSelection="false"
			change="indexChangeHandler(event)" horizontalCenter="-404"
			itemRenderer="components.GalleryButtonRenderer"/>
	
	
	<s:Group id="images" x="273" y="2"
			 width="694" height="507"
			 maxWidth="694" maxHeight="507">
		<mx:Image verticalAlign="middle" horizontalAlign="center" width="694" height="507" maxWidth="694" maxHeight="507" buttonMode="true" click="launchPopUp(event);"/>
		<mx:Image verticalAlign="middle" horizontalAlign="center" width="694" height="507" maxWidth="694" maxHeight="507" buttonMode="true" click="launchPopUp(event);"/>
	</s:Group>
	
	
	<s:DataGroup id="thumbList" y="2" 
				 width="100" height="507" buttonMode="true"
				 clipAndEnableScrolling="true"
				 dataProvider="{selectedSection.items}"
				 horizontalCenter="-274" 
				 itemRenderer="components.ThumbRenderer"
				 rendererAdd="handleThumbAdd(event)">
		<s:layout>
			<s:VerticalLayout horizontalAlign="center"/>
		</s:layout>
	</s:DataGroup>
	<s:VScrollBar y="0" fixedThumbSize="true" horizontalCenter="-219"
				  skinClass="components.VerticalScrollbarSkin2" viewport="{thumbList}"/>
</s:Group>

and here is the window.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
				layout="vertical" width="100%" height="100%"
				horizontalAlign="center"
				showCloseButton="true"
				close="closeWindow(event);"
				click="dispatchEvent(new CloseEvent(CloseEvent.CLOSE));">
	
	<mx:Script>
		<![CDATA[
			
			import mx.events.CloseEvent;
			import mx.managers.PopUpManager;
			
			[Bindable]
			public var selectedImage:String;
			
			private function closeWindow(e:CloseEvent):void {
				PopUpManager.removePopUp(this);
			}
			
		]]>
	</mx:Script>
	
	<mx:Image source="{selectedImage}"/>
	
</mx:TitleWindow>