var effetAnimationListeEnCours;

var effetListeChoix = new Class({
	
	initialize : function ()
	{
		if ($('charger-animation-liste') && $('animation-liste'))
		{
			this.effetTween = new Fx.Tween($('animation-liste'), {onComplete: this.effetTermine.bind(this)});
			
			$('charger-animation-liste').getElements('area').addEvent('click', this.toggleEtat.bind(this));
			
			var liste = $$('.contenu-liste-animation');
			liste.setStyle('display', 'none');
			
			var first = liste[0];
			var coordinates = first.setStyle('display', 'block').getCoordinates();
			$('animation-liste').setStyles({width: coordinates.width+"px", height: coordinates.height+"px"});
			
			this.effetEnCours = false;
			this.elementEffetEnCours = first;
			this.elementDeplie = first;
			this.elementAdeplier;
		}
	},
	
	toggleEtat : function (event)
	{
		var event = new Event(event).stop();
		
		if (this.effetEnCours)
		{
			return;
		}
		
		var num = event.target.id.replace(/[^0-9]*/g, '');
		var contenu = $('contenu-'+num);
		
		if ($('image-du-menu'))
		{
	
      $('image-du-menu').src = 'images/titre-'+num+'.jpg';
    }
		
		
		//~ console.log(this.elementDeplie);
		$('charger-animation-liste').getElements('li').setStyle('color', '#427ca3');
		event.target.setStyle('color', '#B70000');
		if (this.elementDeplie)
		{
			this.elementAdeplier = this.elementDeplie != contenu?contenu:false;
			this.replier(this.elementDeplie);
			return;
		}
		
		if (contenu.getStyle('display') == 'block')
		{
			this.replier(contenu);
		}
		else
		{
			this.deplier(contenu);
		}
		
	},
	
	deplier : function (element)
	{
		this.effetEnCours = true;
		//~ this.elementDeplie = element;
		if (element.getStyle('display') == 'none')
		{
			this.elementEffetEnCours = element;
			this.effetEnCours = true;
			this.effetTween.element.setStyle('height', 0);
			element.setStyle('display', 'block');
			//~ console.log(element.getCoordinates());
			this.effetTween.start('height', element.getCoordinates().height);
		}
		else
		{
			element.setStyle('display', 'none')
		}
	},
	
	replier : function (element)
	{
		if (element.getStyle('display') == 'block')
		{
			this.elementEffetEnCours = element;
			this.effetEnCours = true;
			this.effetTween.start('height', 0);
		}
		else
		{
			contenu.setStyle('display', 'none')
		}
	},
	
	effetTermine : function ()
	{
		//~ console.log('fini');
		//~ console.log(this.elementDeplie);
		if (this.elementDeplie)
		{
			this.elementDeplie.setStyle('display', 'none');
			this.elementDeplie = false;
		}
		else
		{
			this.elementDeplie = this.elementEffetEnCours;
		}
		this.effetEnCours = false;
		
		if (this.elementAdeplier && this.elementAdeplier.getStyle('display') !== 'block')
		{
			this.deplier(this.elementAdeplier);
		}
		this.elementAdeplier = false;
	}
	
});

window.addEvent('domready', function ()
{
	var anime = new effetListeChoix();
});