/**
 * Clase que controla el menu de actividades
 */

var CodecActividadesMenu = new Class({

	/**
	 * Constructor
	 */
	initialize: function (menuZone) 
		{
		menuZone = $(menuZone);

		if(menuZone==null)
			return;


		var thisObject = this;
		
		//Iniciacion de valores
		this.currentCategory = null;
		this.comingCategory = null;
		this.onChangeCategory = false;

		this.mouseOut = true;
		this.onToHidden = false;


		var categoriesLinks = menuZone.getElements('.category');
		var subMenus = menuZone.getElements('.subMenu');
		var subOptions = menuZone.getElements('.subMenu a, .subMenu span');
		var menuImages = menuZone.getElements('.menuImages div');
						

		var counter = 0;

		this.comingImage = null;
		this.currentImage = null;
		this.defaultImage = null;

		this.inChangeImage = 0;
		
		//Imagenes
		menuImages.each
			(
			function(image)
				{
				image.changeFx = new Fx.Morph(image,{duration:200,transition:Fx.Transitions.Circ.easeOut});
				image.changeFx.addEvent('complete',function(){if(thisObject.inChangeImage>0) thisObject.inChangeImage--;});
				image.imageMenuIndex = counter;
				image.isMouseOver = false;
				counter++;
				thisObject.defaultImage = image;
				}
			);

		
		var imagesZone = menuZone.getElement('.menuImages');
		if(imagesZone==null)
			return;

		var imagesZoneHeight = this.getIntStyle(imagesZone,'height'), imagesZoneWidth = this.getIntStyle(imagesZone,'width');
		
		this.hiddenLeft = 0-imagesZoneWidth-10;
		this.hiddenTop = 0-imagesZoneHeight-10;
		this.hiddenBottom = imagesZoneHeight+10;
				

		//Apertura de Submenus
		counter = 0;
		categoriesLinks.each
			(
			function(category)
				{
				category.subMenu = subMenus[counter];
				category.menuImage = menuImages[counter];

				category.menuImage.isMouseOver = true;
				
				category.subMenuOpened = false;
				category.subMenuCompleteOpen = false;
				category.subMenuCompleteClose = true;

								
				category.isMouseOver = false;
							
				category.subMenuMaxWidth = thisObject.getIntStyle(category.subMenu,'width');
				category.subMenu.setStyle('width',15);
				
				category.subMenuFx = new Fx.Tween(category.subMenu,{duration:300});
				category.subMenuFx.addEvent('complete',function(){if(!category.subMenuOpened) {category.subMenu.setStyle('display','none'); category.subMenuCompleteClose = true;} else {category.subMenuCompleteOpen = true; thisObject.onChangeCategory = false;}  });
				
				category.addEvent('mouseenter',function(){category.isMouseOver = true; thisObject.mouseOut=false; thisObject.setComingCategory(category);});
				category.addEvent('mouseleave',function(){category.isMouseOver = false; });

				category.subMenu.addEvent('mouseenter',function(){category.isMouseOver = true; thisObject.mouseOut=false;});

				counter++;
				}
			);
		
		
		//Subopciones
		subOptions.each
			(
			function(option)
				{
				option.menuImage = menuImages[counter];
				option.addEvent('mouseenter',function(){option.menuImage.isMouseOver = true; thisObject.setComingImage(option.menuImage);});
				option.addEvent('mouseleave',function(){option.menuImage.isMouseOver = false;});
				option.removeProperty('title');

				counter++;
				}
			);

		//Salida del mouse del menu
		menuZone.addEvent('mouseenter',function(){thisObject.mouseOut=false;});
		menuZone.addEvent('mouseleave',function(){thisObject.mouseOut=true; if(!thisObject.onToHidden){setTimeout(function(){thisObject.onMouseOutOfMenu();},700); thisObject.onToHidden=true;}});

		setTimeout(function(){thisObject.showFirstImage();},500);
		},


	/**
	 * Establece la siguiente categoria a mostrar
	 */
	setComingCategory: function (category) 
		{
		if(category==this.currentCategory)
			return;
		
		var thisObject = this;
		this.comingCategory = category;
		setTimeout(function(){thisObject.changeCategory(category);},450);
		},

	/**
	 * Muestra la catgoria seleccionada 
	 */
	changeCategory: function (category) 
		{
		if(category!=this.comingCategory||category==this.currentCategory||(!category.isMouseOver))
			return;

		var thisObject = this;

		if(this.onChangeCategory)
			{
			setTimeout(function(){thisObject.changeCategory(category);},100);
			return;
			}
		
		this.onChangeCategory = true;
				
		var current = this.currentCategory;
		
		this.currentCategory = category;
		this.comingCategory = null;

		var toWidth = 0;
				
		if(current!=null)
			{
			toWidth = current.subMenuMaxWidth;
			
			if(!current.subMenuCompleteOpen)
				{
				current.subMenuFx.stop();
				toWidth = this.getIntStyle(current.subMenu,'width');
				}
			
			current.subMenuOpened = false;
			current.subMenuCompleteClose = false;
			current.subMenuFx.start('width',toWidth,15);
			}
		
		
		toWidth = 15;
		if(!category.subMenuCompleteClose)
			{
			category.subMenuFx.stop();
			toWidth = this.getIntStyle(category.subMenu,'width');
			}
		else
			{
			category.subMenu.setStyle('display','block');
			}
		
		category.subMenuCompleteOpen = false;
		category.subMenuOpened = true;
		category.subMenuFx.start('width',toWidth,category.subMenuMaxWidth);

		this.changeMenuImage(category.menuImage);
		},


	/**
	 * Se manda a llamar cuando el mouse sale del menu y pasa un tiempo
	 */
	onMouseOutOfMenu: function () 
		{
		this.onToHidden=false;
				
		var thisObject = this;

		if((!this.mouseOut)||this.currentCategory==null||(!this.currentCategory.subMenuOpened))
			return;
		

		var current = this.currentCategory;
		this.currentCategory = null;
								
		var toWidth = current.subMenuMaxWidth;
		
		if(!current.subMenuCompleteOpen)
			{
			current.subMenuFx.stop();
			toWidth = this.getIntStyle(current.subMenu,'width');
			}
			
		current.subMenuOpened = false;
		current.subMenuCompleteClose = false;
		current.subMenuFx.start('width',toWidth,15);

		this.changeMenuImage(this.defaultImage);
		},
		
	/**
	 * Establece el siguiente image que sera seleccionado
	 */
	setComingImage: function (image) 
		{
		if(image==this.currentImage)
			return;
												
		this.comingImage = image;
		var thisObject = this;
		setTimeout(function(){if(image==thisObject.comingImage&&thisObject.comingImage!=this.currentImage&&thisObject.comingImage.isMouseOver) thisObject.changeMenuImage(image);},350);
		},

	/**
	 * Cambia la imagen del menu
	 */
	changeMenuImage: function (image) 
		{

		if(image==this.currentImage)
			{
			this.inChangeImage = 0;
			return;
			}
		
		if(this.inChangeImage>0)
			{
			var thisObject = this;
			setTimeout(function(){thisObject.changeMenuImage(image);},50);
			return;
			}

		this.inChangeImage = 2;

		this.comingImage = image;

		if(this.currentImage==null)
			return;
											
		var toLeft = this.hiddenLeft, toTop = this.hiddenTop, toBottom = this.hiddenBottom;

		if(this.comingImage.imageMenuIndex>this.currentImage.imageMenuIndex)
			{
			this.comingImage.changeFx.start({left:[toLeft,0],top:[toTop,0]});
			this.currentImage.changeFx.start({left:[0,toLeft],top:[0,toBottom]});
			}
		else
			{
			this.comingImage.changeFx.start({left:[toLeft,0],top:[toBottom,0]});
			this.currentImage.changeFx.start({left:[0,toLeft],top:[0,toTop]});
			}

		this.currentImage = this.comingImage;
		},
	

	/**
	 * Funcion que muestra la primera imagen
	 */
	showFirstImage: function() 
		{
		this.inChangeImage = 1;
		this.comingImage = this.currentImage = this.defaultImage;
		var fromLeft = this.hiddenLeft, fromTop = this.hiddenTop;
		this.comingImage.changeFx.start({left:[fromLeft,0],top:[fromTop,0]});
		},
	
	/**
	 * Retorna la propiedad entera de element
	 */
	getIntStyle:  function (element, property, defaultValue)
		{
		var value = 0; 
		try
			{
			value = element.getStyle(property);
			if(value===undefined||value===null)
				return (defaultValue===undefined)?0:defaultValue;
			if(value.toInt!==undefined)
				value = value.toInt();
			}
		catch(err)
			{
			return (defaultValue===undefined)?0:defaultValue;
			}
		return value;	
		}

});//Fin de la clase