/*	Petit Javascript qui permet d'ajouter des effets d'opacité et de background décroissant(e)/croissant(e) sur les
	objets désirés. Il faut mettre dans la variable oeBgr les objets de background et dans oeOpa les objets d'opacité.
	
	Voici un petit exemple. test1, test2, etc. sont des id !
	
	<script language="javascript">
		var oeBgr = new Array(
			new Array('test1','ffffff','ff0000'),
			new Array('test2','ffffff','00ff00'),
			new Array('test3','ffffff','0000ff')
		);
		var oeErrDisplay = false;
		var oeOpa = new Array('test4','test5','test6');
		var test = new overEffects();
	</script>
	
	On constate que pour le oeBgr il faut passer : new Array(' ID ', 'COULEUR DE BASE', 'COULEUR OVER')
	Et pour oeOpa, simplement l'id suffit !
	
	Si vous constatez des bugs (le mouseout qui ne fonctionne pas, ou autre), essayez de mettre la variable oeErrDisplay=true
	pour afficher les erreurs détectées par mon système.
	
	Gaëtan Parel - avril 2008
	
	
	---====== TODO ======---
	- Onmouseover sur le document (comme fait pour le out) (ou parser les éléments enfant des éléments à "overer" pour leurs mettre la
	  propriété ;-) et ensuite dans les fonctions over, regarder de qui l'élément est l'enfant!)
	- Si le temps, un jour : Faire X boucles si on a déjà un peu d'opacité/background, au lieu de TOUT refaire avec des
	  valeurs plus petites...
	- Gérer le onscroll (bug)
*/
var forceOver=false;

overEffects = function () {
	// Déclaration des variables privées
	var p=[]; // Toutes les informations contenues dans properties peuvent être modifiées à la main

	// Constructeur
	this.oeConstruct = function(bgr,opa,oeErrDisplay) {
		// Propriétés modifiables
		p['opacityMin']=60;	// Opacité minimum pour les objets opacité
		p['colorStep']=10;	// Nombre de boucles pour arriver à la couleur désirée
		p['opacitySteps']=12;// Nombre de boucles pour arriver à la couleur désirée
		p['delayOver']=17;	// Delay entre chaque boucle pour le mouvement OVER
		p['delayOut']=24;	// Delay entre chaque boucle pour le mouvement OUT

		// Propriétés non modifiables
		p['IE'] = (navigator.appVersion.indexOf('MSIE')==-1) ? false : true;
		p['IE6'] = (navigator.appVersion.indexOf('MSIE 6')==-1) ? false : true;
		p['FF'] = (navigator.appName!='Netscape') ? false : true;
		p['opera'] = (navigator.userAgent.indexOf("Opera")==-1) ? false : true;
		p['safari'] = (navigator.appVersion.indexOf('Safari')==-1) ? false : true;

		// Propriétés non-modifiables, calculées ou autre
		p['mouse']=new Array();
		p['link']=new Array();
		p['opacityStep']=(100-p['opacityMin'])/p['opacitySteps'];

		var errs='';
		var testErr=new Array(0,0);
		for (var i=0 ; i<bgr.length ; i++) {
			if (_$(bgr[i][0])) {
				if (bgr[i][1].length!=6) {
					testErr[0]++;
					errs+="- "+"La couleur de départ [ "+bgr[i][1]+" ] est incorrecte pour "+bgr[i][0]+"\n";
				}
				if (bgr[i][2].length!=6) {
					testErr[0]++;
					errs+="- "+"La couleur de fin [ "+bgr[i][2]+" ] est incorrecte pour "+bgr[i][0]+"\n";
				}
				_$(bgr[i][0]).onmouseover=oeMouseOverLink;
				_$(bgr[i][0]).onmouseout=oeMouseOutLink;
				p['link'][bgr[i][0]]=new Array('',bgr[i][1],bgr[i][2]);
			} else {
				testErr[1]++;
				errs+="- "+bgr[i][0]+" est introuvable (initialisation background)\n";
			}
		}
		for (var i=0 ; i<opa.length ; i++) {
			if (_$(opa[i])) {
				_$(opa[i]).onmouseover=oeMouseOverLinkOpacity;
				_$(opa[i]).onmouseout=oeMouseOutLinkOpacity;
				p['link'][opa[i]]='';
			} else {
				testErr[1]++;
				errs+="- "+opa[i]+" est introuvable (initialisation opacité)\n";
			}
		}
		if (oeErrDisplay && errs!='') {
			errs+="\nAide :\n";
			if (testErr[0]>0) errs+=" - Insérez une couleur héxadécimale sans le # (par exemple 00FF00)\n";
			if (testErr[1]>0) errs+=" - Vérifiez l'id des objets signalés\n";
			alert(errs);
		}
		
		var newItem=document.createElement('div');
		newItem.style.width="100%";
		newItem.style.position="absolute";
		newItem.style.top="0px";
		newItem.style.left="0px";
		newItem.setAttribute('id','oe_window_width');
		document.body.insertBefore(newItem,document.body.childNodes[0]);

		newItem=document.createElement('div');
		newItem.style.height="100%";
		newItem.style.position="absolute";
		newItem.style.top="0px";
		newItem.style.left="0px";
		newItem.setAttribute('id','oe_window_height');
		document.body.insertBefore(newItem,document.body.childNodes[0]);

		if (window.addEventListener) {
			document.addEventListener("mousemove",oeMouseMove,false);
			document.addEventListener("mouseout",oeMouseOutDocument,false);
		//	document.addEventListener("scroll",oeMouseMove,false);
		} else if (window.attachEvent) {
			document.attachEvent("onmousemove",oeMouseMove);
			document.attachEvent("onmouseout",oeMouseOutDocument);
		//	document.attachEvent("onscroll",oeMouseMove);
		}
	}

	oeMouseOverLink = function(e) {
		//if (!p['mouse']['on']) return;
		if (typeof(e)=='string') {
			var target=_$(e);
		} else {
			if (!e) e=window.event;
			var target=(e.target)?e.target:e.srcElement;
		}
		target=oeGetTarget(target);

		// Si la vidéo est déjà en over, on va pas refaire tout le cinéma... Ca serait un bug !
		if (p['link'][target.id][0].indexOf('over')!=-1) return;

		// On indique que la vidéo est en mode "over"
		p['link'][target.id][0]='over';

		// Appelle la fonction récursive qui change progressive la couleur
		oeChangeColor(target.id,0,'over',p['delayOver']);
	}

	// Fonction qui est appelée quand on arrête de survoler un lien (de vidéo)
		// id	=>	simplement l'id de l'élément survolé auparavant
	oeMouseOutLink = function(e) {
		if (typeof(e)=='string') {
			var target=_$(e);
		} else {
			if (!e) e=window.event;
			var target=(e.target)?e.target:e.srcElement;
		}
		target=oeGetTarget(target);

		// Pour un soucis de bug, j'appelle cette fonction 50ms après, pour savoir où se trouvera la souris
		setTimeout('oeMouseOutLinkConfirm("'+target.id+'")',50);
	}

	// Fonction qui regarde si on a vraiment quitté l'élément survolé
		// id	=> toujours et simplement l'id de l'élément survolé auparavant
	oeMouseOutLinkConfirm=function(id) {
		if (id==forceOver) return;
		// On chope la target de l'élément posé sous la souris actuellement
		var target=p['mouse']['target'];
		if (!target) target=document.getElementsByTagName('HTML')[0];
		if (p['link'][id][0]!='forceout') {
			// Et là, on regarde si quelque part dans les noeuds parents, on est toujours sur l'élément survolé
			var ok=0;
			if (!target) return;
			while (ok==0 && target.nodeName!='HTML') {
				if (target.id && target.id==id) ok=1;
				target=target.parentNode;	
			}
			// Si oui, c'est-à-dire qu'on est toujours sur l'élément survolé, alors on quitte la fonction vu qu'on veut pas "outer" ce lien :-)
			if (ok==1) return;
		}
		if (p['link'][id][0]=='outt') return;

		// On dit que le lien est en mode "out"
		p['link'][id][0]='out';

		// Et on appelle la fonction récursive qui change progressivement la couleur du lien
		oeChangeColor(id,0,'out',p['delayOut']);
	}

	// Fonction récursive qui change progressivement la couleur du lien
	oeChangeColor = function(id,step,act,timer,c1,c2,c3,ct1,ct2,ct3) {
		//if (act!='over') return
		// Si la fonction est appelée en mode "over" et que le lien est en mode "out", on quitte la fonction
		if (p['link'][id][0]!='' && p['link'][id][0]!=act) return;
		if (act=='out') p['link'][id][0]=act='outt';

		if (!c1 && c1!=0) {
			var tmp =_$(id).style.backgroundColor.replace('#','');
			if (tmp=='') tmp=(act=='over') ? p['link'][id][1] : p['link'][id][2];
			else {
				if (tmp.length==3) {
					tmp=tmp.replace('#','');
					if (tmp.toLowerCase()=='fff') tmp=tmp+'fff';
				}
				if (tmp.indexOf('rgb')==-1) tmp=new Array(parseInt(tmp.charAt(0)+tmp.charAt(1),16),parseInt(tmp.charAt(2)+tmp.charAt(3),16),parseInt(tmp.charAt(4)+tmp.charAt(5),16));
				else tmp=tmp.replace('rgb(','').replace(')','').split(',');
				tmp=_DecToHex(tmp[0])+''+_DecToHex(tmp[1])+''+_DecToHex(tmp[2]);
			}

			var color1 = (act=='over') ? tmp : p['link'][id][1];
			var color2 = (act=='outt') ? tmp : p['link'][id][2];

			color1=new Array(parseInt(color1.charAt(0)+color1.charAt(1),16),parseInt(color1.charAt(2)+color1.charAt(3),16),parseInt(color1.charAt(4)+color1.charAt(5),16));
			color2=new Array(parseInt(color2.charAt(0)+color2.charAt(1),16),parseInt(color2.charAt(2)+color2.charAt(3),16),parseInt(color2.charAt(4)+color2.charAt(5),16));

			var colorStepUnit = new Array();

			for (var i=0 ; i<3 ; i++){
				colorStepUnit[i]=(color1[i]-color2[i])/p['colorStep'];
			}
			var c1=colorStepUnit[0];
			var c2=colorStepUnit[1];
			var c3=colorStepUnit[2];
			var ct1=color1[0];
			var ct2=color1[1];
			var ct3=color1[2];
			
		} else
			colorStepUnit=new Array(c1,c2,c3);

		cTmp=new Array(ct1,ct2,ct3);

		// Définit les couleurs du moment, en fonction de plein de paramètres
		var color = new Array();
		var stepTemp = (act=='over') ? step : (p['colorStep']-step);
		for (var i=0 ; i<3 ; i++)
			color[i]=(cTmp[i])-Math.round(colorStepUnit[i]*stepTemp);

		var newColor='#'+_DecToHex(color[0])+_DecToHex(color[1])+_DecToHex(color[2]);

		// On set la nouvelle couleur héxadécimale au lien...
		_$(id).style.backgroundColor=newColor;

		// Si l'élément est le teaser de nouvo
		if (id=='teaser-5-nouvo' && _$('nouvo-text-0')) {
			_$('nouvo-text-0').style.backgroundColor=newColor;
			_$('nouvo-text-1').style.backgroundColor=newColor;
		}

		step++; // Petit incrément de l'étape

		// Si on a pas finit de modifier la couleur, on remet ça en appelant la même fonction
		if (step<=p['colorStep']) setTimeout('oeChangeColor("'+id+'",'+step+',"'+act+'",'+timer+','+c1+','+c2+','+c3+','+ct1+','+ct2+','+ct3+')',timer);
		// Sinon, si on est en over, on dit que le lien est rempli de la couleur over en lui mettant le mode "overed"
			else if (act=='over') p['link'][id][0]='overed';
			 else p['link'][id][0]=''; // Sinon, on est donc même pas en over, donc on annule et efface toute trace de cette action
	}

	oeMouseOverLinkOpacity = function(e) {
		if (!p['mouse']['on']) return;
		if (typeof(e)=='string') {
			var target=_$(e);
		} else {
			if (!e) e=window.event;
			var target=(e.target)?e.target:e.srcElement;
		}
		target=oeGetTarget(target);

		// Si la vidéo est déjà en over, on va pas refaire tout le cinéma... Ca serait un bug !
		if (p['link'][target.id].indexOf('opacityDecrease')!=-1) return;

		// On indique que la vidéo est en mode "over"
		p['link'][target.id]='opacityDecrease';

		// Appelle la fonction récursive qui change progressive la couleur
		oeChangeOpacity(target.id,0,'opacityDecrease',p['delayOver']);
	}

	oeMouseOutLinkOpacity = function(e) {
		if (typeof(e)=='string') {
			var target=_$(e);
		} else {
			if (!e) e=window.event;
			var target=(e.target)?e.target:e.srcElement;
		}
		target=oeGetTarget(target);
		if (!target) return;
		// Pour un soucis de bug, j'appelle cette fonction 50ms après, pour savoir où se trouvera la souris
		setTimeout('oeMouseOutLinkOpacityConfirm("'+target.id+'")',50);
	}

	oeMouseOutLinkOpacityConfirm = function(id) {
		// On chope la target de l'élément posé sous la souris actuellement
		var target=p['mouse']['target'];

		if (p['link'][id]!='forceout') {
			// Et là, on regarde si quelque part dans les noeuds parents, on est toujours sur l'élément survolé
			var ok=0; 
			while (ok==0 && target.nodeName!='HTML') {
				if (target.id && target.id==id) ok=1;
				target=target.parentNode;	
			}
			// Si oui, c'est-à-dire qu'on est toujours sur l'élément survolé, alors on quitte la fonction vu qu'on veut pas "outer" ce lien :-)
			if (ok==1) return;
		}
		if (p['link'][id]=='opacityIncrease') return;
		// On dit que le lien est en mode "out"
		p['link'][id]='opacityIncrease';
		// Et on appelle la fonction récursive qui change progressivement la couleur du lien
		oeChangeOpacity(id,0,'opacityIncrease',p['delayOut']);
	}

	oeChangeOpacity = function(id,step,act,timer,opMin) {
		if (!opMin && opMin!=0)
			opMin = (_$(id).style.opacity && _$(id).style.opacity>=0) ? _$(id).style.opacity*100 : 100;

		// Si la fonction est appelée en mode "over" et que le lien est en mode "out", on quitte la fonction
		if (p['link'][id]!='' && p['link'][id]!=act) return;

		// Définit l'opacité du moment
		var opacity=opMin-p['opacityStep']*step;
		if (opacity<p['opacityMin']) opacity=p['opacityMin'];
		if (act=='opacityIncrease') opacity=p['opacityMin']+p['opacityStep']*step;

		if (act=='opacityIncrease' && opMin>opacity) {
			step++;
			oeChangeOpacity(id,step,act,timer,opMin);
			return;
		}

		// On set la nouvelle couleur héxadécimale au lien...
		_$(id).style.filter='alpha(opacity='+opacity+')';
		_$(id).style.opacity=(opacity/100);

		step++; // Petit incrément de l'étape

		// Si on a pas finit de modifier la couleur, on remet ça en appelant la même fonction
		if (step<=p['opacitySteps']) setTimeout('oeChangeOpacity("'+id+'",'+step+',"'+act+'",'+timer+','+opMin+')',timer);
		// Sinon, si on est en over, on dit que le lien est rempli de la couleur over en lui mettant le mode "overed"
		else if (act=='opacityDecrease') p['link'][id]='opacityDecreased';
			 else p['link'][id]=''; // Sinon, on est donc même pas en over, donc on annule et efface toute trace de cette action
	}
	oeForceOver = function(id) {
		if (forceOver!=false) {
			oeMouseOutLink(forceOver);
		}
		oeMouseOverLink('rightLink-'+id);
		forceOver='rightLink-'+id;
	}
	oeCheckForceOver = function() {
		if (forceOver!=false) oeMouseOutLink(forceOver);
		forceOver=false;
	}
	oeResetForceOver = function() {
		if (forceOver!=false) oeMouseOutLink(forceOver);
		forceOver=false;
	}

	// Fonction qui est appelée à chaque mouvement de souris, et y enregistre des paramètres
	oeMouseMove = function (e) {
		// Petit truc pour IE, vu qu'il ne respecte aucun standard...
		if(!e) e = window.event;
		p['mouse']['x'] = e.clientX; // Enregistre la position x de la souris
		p['mouse']['y'] = e.clientY; // Enregistre la position y de la souris
		p['mouse']['target'] = (p['IE']) ? e.srcElement : e.target; // Enregistre l'élément sous la souris
		p['mouse']['on']=true;

		for (var id in p['link']) {
			var ok=0;
			var element=p['mouse']['target'];
			if (!element) return;
			if (typeof(p['link'][id])=='object') { // Element background
				if (p['link'][id][0]=='overed'){
					while(ok==0 && element.nodeName!='HTML'){
						if (element.id && element.id==id) ok=1;
						element=element.parentNode;
						if (!element) return;
					}
					if (ok==0 && forceOver!=id) oeMouseOutLink(id);
				}
			} else { // Element opacité
				if (p['link'][id]=='opacityDecreased'){
					while(ok==0 && element.nodeName!='HTML'){
						if (element.id && element.id==id) ok=1;
						element=element.parentNode;
						if (!element) return;
					}
					if (ok==0) oeMouseOutLinkOpacity(id);
				}
			}
		}
	}

	oeMouseOutDocument = function(e,re) {
		var height=parseInt(_$('oe_window_height').offsetHeight);
		var width=parseInt(_$('oe_window_width').offsetWidth);
		var scrollTop=document.documentElement.scrollTop;
		var scrollLeft=document.documentElement.scrollLeft;

		//if (e.clientX>scrollLeft && e.clientY>scrollTop && e.clientX<(scrollLeft+width) && e.clientY<(scrollTop+height)) return;
		if (e.clientX>=0 && e.clientY>=0 && e.clientX<width && e.clientY<height) return;
		p['mouse']['on']=false;

		for (var id in p['link']) {
			if (typeof(p['link'][id])=='object') { // Element background
				if (p['link'][id][0]!='' && forceOver!=id) {
					 p['link'][id][0]='forceout';
					 oeMouseOutLink(id);
				}
			} else { // Element opacité
				if (p['link'][id]!='') {
					p['link'][id]='forceout';
					oeMouseOutLinkOpacity(id);
				}
			}
		}
	}

	oeGetTarget = function(target) {
		if (!target) return;
		var ok=0;
		while (ok==0 && target.nodeName!='HTML') {
			for (var id in p['link']) {
				if (target.id && target.id==id) ok=1;
			}
			if (ok==0) target=target.parentNode;
		}
		return target;
	}

	// Fonction qui permet de ne pas avoir besoin de faire le document point getElementById(id_de_l'objet). _$(id_de_l'objet) c'est beaucoup plus court ;-)
	_$ = function(obj) {
		return document.getElementById(obj);	
	}

	// Fonction que j'ai pompé sur le net, qui convertir un chiffre décimal en hexadécimal !
	_DecToHex = function(v) {
		// Définition des variables...
		var un,deux,trois,quatre;
		var H = new Array("0","1","2","3","4","5","6","7","8","9","A","B","C","D","E","F");
		dec = v;
		un = Math.floor(dec/16); // Division de la saisie par 16, et élimination des chiffres après la virgule
		if (un > 15) { // Si le resultat est supérieur à 15, c'est qu'il y aura plus de 2 chiffres hexadécimaux, il faut donc afiner
			var z = dec - un*16; // On affecte déjà le dernier chiffre hexadécimal
			deux = Math.floor(un/16); // On divise le résultat précédent par 16 pour avoir le deuxième chiffre hexa (en partant de la fin)
			if ( deux > 15 ) { // Si le résultat est supérieur à 15, on aura au moins 4 chiffres dans notre nombre hexadécimal
				var y = un - deux*16; // On a ici l'avant dernier chiffre hexadécimal
				trois = Math.floor(deux/16); // On divise le résultat précédent par 16 pour avoir le troisième chiffre hexa (en partant de la fin)
				if ( trois > 15 ) { // Si le résultat est supérieur à 15, on aura 5 chiffres dans notre nombre hexadécimal
					var x = deux - trois*16; // On a ici le troisième chiffre hexadécimal (toujours en partant de la fin)
					quatre = Math.floor(trois/16); // On a ici le premier chiffre hexa (en partant du début ;-))
					var w = trois - (quatre*16); // Et le deuxième (en partant du début)
					v = H[quatre] + H[w] + H[x] + H[y] + H[z]; // On compose le résultat dans le champ de formulaire
				} else { // Si on n'a que 4 chiffres hexadécimaux...
					var x = deux - (trois*16);
					v = H[trois] + H[x] + H[y] + [z];
				}
			} else { // Si on n'a que 3 chiffres hexadécimaux
				var y = un - (deux*16);
				v = H[deux] + H[y] + [z];
			}
		} else { // Si on n'a que deux chiffres
			var z = dec-(un*16);
			v = H[un] + H[z];
		}
		return v;
	}

	if (typeof(oeErrDisplay)=='undefined') oeErrDisplay=false;
	if (typeof(oeBgr)=='undefined') oeBgr=new Array();
	if (typeof(oeOpa)=='undefined') oeOpa=new Array();

	// Appelle le constructeur lors de l'exécution de la classe
	this.oeConstruct(oeBgr,oeOpa,oeErrDisplay);
}