// Codé avec Prototype 1.5

Event.observe(window, EVENT_LOAD, function(){ new HomePage(); })

var HomePage = Class.create();
HomePage.prototype = Object.extend(new Global(), {
	
	initialize:function() {
		
		// Initialisation
		this._initialize(); // Appel du constructeur parent
		
		this.idBlocPhoto = 'avaf_';
		
		// Classes CSS
		this.classDestination = 'destination';
		this.classDestinationSelect = 'select';
		this.classDestinationLegende = 'legende';
		this.classDestinationVisible = 'visible';
		this.classAccordionHead = 'accordionHead';
		this.classAccordionOn = 'on';
		this.classAccordionOff = 'off';
		this.classAccordionElement = 'accordionElement';
		
		// Sélecteurs CSS
		this.cssSelectorAccordionHead = '#aVoiraFaire .accordionHead';
		this.cssSelectorAccordionBody = '#aVoiraFaire .accordionBody';
		
		
		// Eléments
		this.aDestinationsMenu = $$('.' + this.classDestination);
		this.aDestinationsLegende = $$('.' + this.classDestinationLegende);
		this.aAccordionHeads = $$('.' + this.classAccordionHead);
		this.aAccordionElements = $$('.' + this.classAccordionElement);
		
		// Divers
		var me = this;
		
		this._assignerEvenements();
		
		// L'accordion "A voir à faire"
		new Accordion(this.cssSelectorAccordionHead, this.cssSelectorAccordionBody,
					  { duration:0.7, default_open:0 });
	},
	
	// Ecoute et assignation des évènements
	_assignerEvenements:function() {
		
		var me = this;
		
		// Destinations
		this.aDestinationsMenu.each(function(el, i) {
			
			// Ecoute de l'évènement mouseover sur l'élément
			el.observe(EVENT_MOUSEOVER, function(evt) {
				// On re-parcourt le tableau des éléments de destination pour supprimer la classe de sélection
				me.aDestinationsMenu.each(function(el2) {
					el2.removeClassName(me.classDestinationSelect);
					el2.down().removeClassName(me.classDestinationSelect);
				})
				
				// On ajoute la classe de sélection à l'élément du menu sur lequel on a cliqué
				el.addClassName(me.classDestinationSelect);
				el.down().addClassName(me.classDestinationSelect);
				
				// ##### Mise à jour de la légende #####
				var legendeOld = $$('.' + me.classDestinationVisible)[0];

				if (legendeOld)
				{
					legendeOld.hide();
					legendeOld.removeClassName(me.classDestinationVisible);
				}
				me.aDestinationsLegende[i].addClassName(me.classDestinationVisible);
				me.aDestinationsLegende[i].show();
				
				// On stoppe l'évènement
				Event.stop(evt);
			});
		});
		
		// Les éléments "head" de l'accordéon
		this.aAccordionHeads.each(function(el, i) {
			
			// Ecoute de l'évènement clic sur l'élément.
			// Quand il est déclenché, on re-parcourt le tableau this.aAccordionHeads pour mettre pour supprimer la classe "on" et mettre la classe "off"
			// Enfin on ajoute la classe "off" sur l'élément cliqué
			el.observe(EVENT_CLICK, function(evt) {
				
				// Event.stop(evt);
				// Re-parcourt du tableau this.aAccordionHeads
				me.aAccordionHeads.each(function(el2) {
					if (el2.hasClassName(me.classAccordionOn))
						el2.removeClassName(me.classAccordionOn);
						el2.addClassName(me.classAccordionOff)
				});
				
			// Enfin on ajoute la classe on sur l'élément cliqué
			el.removeClassName(me.classAccordionOff);
			el.addClassName(me.classAccordionOn)	
			});
			
		});
		
		this.aAccordionElements.each(function(el) {
			Event.observe(el, EVENT_MOUSEOVER, function(evt) {
				if (!el.hasClassName('select'))
				{
					var id = el.id.split("_").last();

					$$('#aVoiraFaire .' + me.classAccordionElement).each(function(elt) {
						var id = elt.id.split("_").last();
						elt.removeClassName('select');
						$(me.idBlocPhoto + id).hide();
					});

					el.addClassName('select');
					
					$(me.idBlocPhoto + id).show();
				}
			});
		});
	}
});