var hideElement = function() {
   var el = this.getEl();
   YAHOO.util.Dom.setStyle(el, "display", "none");
}

var showElement = function() {
   var el = this.getEl();
   YAHOO.util.Dom.setStyle(el, "display", "block");
}

var previous = null;
var anim = null;
var activebubble = null;

//ids and corresponding department
var zoneInfo = {

    ProductionOver:     "Production",
    TitleProduction:    "Production",
    TitleProductionOver:"Production",
    Zone1:              "Production",
    Zone1Bubble:        "Production",
    Zone2:              "Production",
    Zone2Bubble:        "Production",
    Zone3:              "Production",
    Zone3Bubble:        "Production",
    
    DLOver:             "DL",
    TitleDL:            "DL",
    TitleDLOver:        "DL",
    Zone4:              "DL",
    Zone4Bubble:        "DL",
    
    SalesOver:          "Sales",
    TitleSales:         "Sales",
    TitleSalesOver:     "Sales",
    Zone5:              "Sales",
    Zone5Bubble:        "Sales",

    TitleAdministration: "Administration",
    TitleAdministrationOver:"Administration",
    AdministrationOver: "Administration",
    Zone6:              "Administration",
    Zone6Bubble:        "Administration",
    Zone7:              "Administration",
    Zone7Bubble:        "Administration"
};

//department information
//department id + tracking info for google analytic
var departmentInfo = {
    Production:     { departmentId: "ProductionDesc",       trackingInfo: path + "/experiences/Production" },
    DL:             { departmentId: "DLDesc",               trackingInfo: path + "/experiences/Distribution et logistique" },
    Sales:          { departmentId: "SalesDesc",            trackingInfo: path + "/experiences/Ventes" },
    Administration: { departmentId: "AdministrationDesc",   trackingInfo: path + "/experiences/Administration" }
}

function mouseHandler(e) {	
				
	var elTarget = YAHOO.util.Event.getTarget(e);
	var elRelatedTarget = YAHOO.util.Event.getTarget(e);
	
	while (elTarget.id!=null && elTarget.id != "Worker") {
		
		//est-ce un département
		if(YAHOO.util.Dom.hasClass(elTarget, "departement")) {
		
			//est-ce un élément avec la class "over"(personne en couleur)
			if(!YAHOO.util.Dom.hasClass(elTarget, "over")) {
				
				//si non(personne en noir), est-ce qu'il à l'opacité à 1 ? si oui, cacher la version noir : 1 à 0
				if(YAHOO.util.Dom.getStyle(elTarget, "opacity") == "1" && YAHOO.util.Dom.getStyle(previous, "opacity") == "0"){
					
					//si j'ai un departement qui a été précédemment activé, le mettre inactif
					if(previous!=null )
					{
						//assigne le style "display:block" qui a précédemment mis à "none"
						YAHOO.util.Dom.setStyle(previous, "display", "block" );
						
						//instantie l'animation qui va réafficher la version en noir
						anim = new YAHOO.util.Anim(previous, {
							opacity: {
								from: 0,
								to: 1
							}
						});
						
						//durée de l'animation
						anim.duration = 0.25;
						
						//bug fix - je m'assure que l'élément en noir à "display:block" comme propriété
						//sans cette ligne, il peut arriver que plusieurs section soit active en même temps
						anim.onComplete.subscribe(showElement);
						
						//anime l'objet
						anim.animate();
						
						
						//cache la bulle si elle est encore active
						if(activebubble!=null)
						{
							//instantie l'animation qui va cacher la version noir du personnage
							anim = new YAHOO.util.Anim(activebubble, {
								opacity: {
									from: 1,
									to: 0
								}
							});
							
							//durée de l'animation
							anim.duration = 0.25;
							
							//cache la version noir du personnage afin d'avoir accès aux autres éléments de la page
							anim.onComplete.subscribe(hideElement);
							
							//anime l'objet
							anim.animate();
							
							activebubble = null;
						}
						
					}//end previous
					
					//instantie la 2e animation qui va cacher la version noir du personnage
					anim = new YAHOO.util.Anim(elTarget, {
						opacity: {
							from: 1,
							to: 0
						}
					});
					
					//durée de l'animation
					anim.duration = 0.25;
					
					//cache la version noir du personnage afin d'avoir accès aux autres éléments de la page
					anim.onComplete.subscribe(hideElement);
					
					//anime l'objet
					anim.animate();
					
					//l'élément actif devient l'élément précédent
					previous = elTarget;
					
					
					break;
				}//end opacity							
				
			}//end over
			
		}
		
		//est-ce un élément de la zone
		else if(YAHOO.util.Dom.hasClass(elTarget, "zone") )
		{
			
			//cache la bulle active si elle existe et si elle est différente de la bulle courante
			if(activebubble != null && activebubble.id != (elTarget.id + "Bubble"))
			{
				//instantie l'animation qui va cacher la version noir du personnage
				anim = new YAHOO.util.Anim(activebubble, {
					opacity: {
						from: 1,
						to: 0
					}
				});
				
				//durée de l'animation
				anim.duration = 0.25;
				
				//cache la version noir du personnage afin d'avoir accès aux autres éléments de la page
				anim.onComplete.subscribe(hideElement);
				
				//anime l'objet
				anim.animate();
				
				//aucune bulle active
				activebubble = null;
			}
			
			//si la bulle est inexistant, ou si la bulle courante est différente de la bulle active, affiche la bulle
			if(activebubble == null || (activebubble!= null && activebubble.id != (elTarget.id + "Bubble")) )
			{
			    //récupère la bulle associé à la zone
				var el = document.getElementById(elTarget.id + "Bubble");
				
				//modifie la propriété "display"
				YAHOO.util.Dom.setStyle(el, "display", "block");
				
				//instantie l'animation qui va cacher la version noir du personnage
				anim = new YAHOO.util.Anim(el, {
					opacity: {
						from: 0,
						to: 1
					}
				});
				
				//durée de l'animation
				anim.duration = 0.25;
				
				
				//je m'assure que la bulle a "display:block" comme propriété lorsque l'animation est terminé
				anim.onComplete.subscribe(showElement);
				
				//anime l'objet
				anim.animate();
				
				//assigne la bulle courante comme bulle active
				activebubble = el;
			}
			
			break;
					
		}
		
		//si je suis à l'extérieur de la bulle, cache la bulle
		else if( !YAHOO.util.Dom.hasClass(elTarget, "desc") && !YAHOO.util.Dom.hasClass(elTarget, "zone") &&  !YAHOO.util.Dom.hasClass(elTarget, "bubble") && YAHOO.util.Dom.isAncestor("buble", elTarget) )
		{
		    //instantie l'animation qui va cacher la bulle courante
			anim = new YAHOO.util.Anim(activebubble, {
				opacity: {
					from: 1,
					to: 0
				}
			});
			
			//durée de l'animation
			anim.duration = 0.25;
			
			//cache la bulle
			anim.onComplete.subscribe(hideElement);
			
			//anime l'objet
			anim.animate();
			
			//aucune bulle n'est active
			activebubble = null;
			
			break;
		}
		
		elTarget = elTarget.parentNode;
	}
}

var previousDepartment = null;
function clickHandler(e)
{
    var elTarget = YAHOO.util.Event.getTarget(e);
	
	while (elTarget.id != "Worker") {
	    
	    var el = YAHOO.util.Dom.getAncestorByClassName(elTarget, "bubble");
	    
	    if(el == null ) 
	    {
	        el = elTarget;
	    }

	    if (previousDepartment != null) {
	        YAHOO.util.Dom.setStyle(previousDepartment, "display", "none");
	    }

	    var department = zoneInfo[el.id];
	    var departmentId = departmentInfo[department].departmentId;

	    saputoAnalytics.trackCustomEvents(null, departmentInfo[department].trackingInfo);

	    YAHOO.util.Dom.setStyle(departmentId, "display", "block");

	    previousDepartment = departmentId;
	    
	    break;
	}
	
    elTarget = elTarget.parentNode;
    
}