Patricio Cornejo's Blog

package com.pcornejo
{
	import flash.display.Loader;
	import flash.display.MovieClip;
	import flash.display.Sprite;
	import flash.display.StageScaleMode;
	import flash.events.Event;
	import flash.events.MouseEvent;
	import flash.net.URLLoader;
	import flash.net.URLRequest;
	import flash.text.TextField;
	import gs.TweenMax;
 
	/**
	 * Gallery Flash Player 10 3D Tools
	 * @author Patricio Cornejo
	 * @link http://www.pcornejo.com
	 */
 
	[SWF(framerate = 40, width = 1000, height = 600, backgroundColor=0x000000)]
	public class Main extends Sprite
	{
		private const xml_url:String = "xml/fotos.xml";
		private const col:Number = 6; //Numero de columnas
 
		private var pre:TextField;
		private var caja:Sprite; //contenedor de los thumbnails
		private var num:Number; //numero total de fotos
		private var xml:XML;
		private var fotoActual:MovieClip; //foto actual en acercamiento
 
		private var n:Number = 0;
		private var ldrs:Array = [];
		private var dirX:Number = 0;
		private var dirY:Number = 0;
 
		public function Main():void
		{
			addEventListener(Event.ADDED_TO_STAGE, configUI);
		}
 
		//Configuramos el Escenario
		private function configUI(e:Event):void
		{
			pre = new TextField();
			caja = new Sprite();
 
			pre.textColor = 0xffffff;
			stage.scaleMode = StageScaleMode.NO_SCALE;
			cargarXML(); addChild(pre); addChild(caja);
			stage.addEventListener(Event.RESIZE, ordenarObjetos);
			addEventListener(Event.ENTER_FRAME, moverCaja);
		}
 
		//Cargamos el archivo XML;
		private function cargarXML():void
		{
			var uldr:URLLoader = new URLLoader(new URLRequest(xml_url));
			uldr.addEventListener(Event.COMPLETE, alCargar);
		}
 
		//Parseamos el archivo XML
		private function alCargar(e:Event):void
		{
			xml = new XML(e.target.data);
			num = xml.foto.length();
			cargarFotos(null);
			ordenarObjetos(null);
		}
 
		//Cargamos las Fotos
		private function cargarFotos(e:Event):void
		{
			if (n < num) {
				if (n < 10)
					pre.text = "0" + (n + 1) +"/" + num;
				else
					pre.text =  (n + 1) +"/" + num;
 
				var ldr:Loader = new Loader();
				ldr.load(new URLRequest("images/prev/" + xml.foto[n].text()));
				ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, cargarFotos);
				ldrs.push(ldr); n++;
			} else {
				cargarThumbs(); //Al Completar la carga de todas las fotos, las colocamos al Escenario
			}
		}
 
		/* Creamos un contenedor para cada foto y lo colocamos en el escenario
		 * dándole una animacion de Entrada.
		 */
		private function cargarThumbs():void
		{
			var i:Number = 0;
 
			for each(var ldr:Loader in ldrs)
			{
				var mc:MovieClip = new MovieClip();
				mc.x = stage.stageWidth * .5 - caja.x - mc.width;
				mc.y = stage.stageHeight;
				mc.rotationX = mc.rotationY = 360;
				TweenMax.to(mc, .5, { x: 165 * dirX - (col / 2) * 165, y:125 * dirY - (((num / col) / 2) * 125), rotationX: 0, rotationY: 0, delay: .1 * i } );
				dirX++;	mc.addEventListener(MouseEvent.CLICK, clickThumb);
 
				if (dirX == col) {
					dirX = 0; dirY++;
				}
 
				i++; mc.addChild(ldr);
				caja.addChild(mc);
			}
		}
 
		/* Al hacer click sobre el Thumb manejamos el z, x e y del contenedor
		 * para lograr un efecto de acercamiento.
		 */
		private function clickThumb(e:MouseEvent):void
		{
			var obj:Object = new Object();
			obj.x = - e.currentTarget.x + 165 * 2;
			obj.y = - e.currentTarget.y + 125 * 2;
			obj.z = -400;
			//obj.bezierThrough = [ { x:0, y:0, z:0 } ];
 
			if (fotoActual != null && fotoActual != e.currentTarget)
				fotoActual.addEventListener(MouseEvent.CLICK, clickThumb);
 
			fotoActual = MovieClip(e.currentTarget);
			fotoActual.removeEventListener(MouseEvent.CLICK, clickThumb);
			fotoActual.addEventListener(MouseEvent.CLICK, volverThumb);
			TweenMax.to(caja, 1, obj);
		}
 
		/* Al hacer click sobre el mismo objeto visualizado
		 * volvemos atrás
		 */
		private function volverThumb(e:MouseEvent):void
		{
			e.currentTarget.removeEventListener(MouseEvent.CLICK, volverThumb);
			e.currentTarget.addEventListener(MouseEvent.CLICK, clickThumb);
			TweenMax.to(caja, 1, { x: stage.stageWidth * .5, y: stage.stageHeight * .5, z: 0, onComplete: function():void { fotoActual == null; } } );
		}
 
		//Efecto de moviemiento al mouse
		private function moverCaja(e:Event):void
		{
			caja.rotationY = (stage.stageWidth - stage.mouseX) / 500;
			caja.rotationX = (stage.stageHeight - stage.mouseY) / 500;
		}
 
		//ordenamos el contenedor delos thumbnails al centro del escenario
		private function ordenarObjetos(e:Event):void
		{
			caja.x = stage.stageWidth * .5;
			caja.y = stage.stageHeight* .5;
		}
	}
}