var infoBulleATraiter;
var leftInfoBulle = 0;
var topInfoBulle = 0;

function InfoBulle(id, fond, titre, contenu, couleurTexte, police)
{
	this.id = id;
	this.fond = fond;
	this.nbImages = 0;
	this.nbElementsListes = Array();

	this.montreToi = montreToi;
	this.cacheToi = cacheToi;
	this.ajouteImage = ajouteImage;
	this.enleveImage = enleveImage;
	this.ajouteListe = ajouteListe;
	this.enleveListe = enleveListe;
	this.ajouteElementListe = ajouteElementListe;
	this.enleveElementListe = enleveElementListe;
	this.ajouteRetourChariot = ajouteRetourChariot;
	this.ajouteTexte = ajouteTexte;

	// creation de l'infobulle
	nouvelleInfoBulle = document.createElement("div");

	// attribution de l'id
	nouvelleInfoBulle.setAttribute("id", this.id);
	// attribution du titre s'il a ete demandé
	if(titre != "")
	{
		// creation du titre
		titreInfobulle = document.createElement("div");
		// attribution d'un id au titre
		titreInfobulle.setAttribute("id", 'titreinfobulle'+this.id);
		// ajout du texte du titre
		titreInfobulle.appendChild(document.createTextNode(titre));
		// ajout du titre à l'infobulle
		nouvelleInfoBulle.appendChild(titreInfobulle);
	}

	// ajout de l'infobulle au document
	document.getElementsByTagName("body")[0].appendChild(nouvelleInfoBulle);

	// ajout du texte de l'infobulle
	this.ajouteTexte(contenu, couleurTexte, police, false);

	// modification du style de l'infobulle
	document.getElementById(this.id).className = "InfoBulle";
	document.getElementById(this.id).style.backgroundColor = this.fond;
	if(titre != "")
	{
		document.getElementById('titreinfobulle'+this.id).className = "titreInfoBulle";
	}
}

function montreToi(leftBulle, topBulle)
{	
	if(!isNaN(leftBulle) && !isNaN(topBulle))
	{
		leftInfoBulle = leftBulle;
		topInfoBulle = topBulle;
	}
	infoBulleATraiter = this.id;
	// affichage de l'infobulle
	document.getElementById(infoBulleATraiter).style.display='block';
	switch(navigator.appName)
	{
	  case 'Netscape':
		// redirection pour la capture des evenements pour Netscape
		document.captureEvents(Event.MOUSEMOVE);
		document.onmousemove = netscapeMouseMove;
		break;
	  case 'Microsoft Internet Explorer':
	  document.getElementById(infoBulleATraiter).style.left=(-3000).toString()+"px";
	  document.getElementById(infoBulleATraiter).style.top=(-3000).toString()+"px";

		// redirection pour la capture des evenements pour IE
		document.onmousemove = crosoftMouseMove;
		break;
	  case 'Opera':
		// redirection pour la capture des evenements pour Opera
		document.captureEvents(Event.MOUSEMOVE);
		document.onmousemove = netscapeMouseMove;
		break;
	}
}

function cacheToi()
{
	// masquage de l'infobulle
	document.getElementById(this.id).style.display='none';
	document.onmousemove = null;
	leftInfoBulle = 0;
	topInfoBulle = 0;
}

function netscapeMouseMove(e)
{  
	document.getElementById(infoBulleATraiter).style.left = (leftInfoBulle + e.pageX + 20).toString()+"px";
	document.getElementById(infoBulleATraiter).style.top = (topInfoBulle + e.pageY-60).toString()+"px";
	topDiv = topInfoBulle+e.pageY;
	leftDiv = leftInfoBulle+e.pageX+ 20;
		
	if(topDiv + document.getElementById(infoBulleATraiter).offsetHeight-document.documentElement.scrollTop-60> window.innerHeight)
	{
		topDiv -= document.getElementById(infoBulleATraiter).offsetHeight-60;
		document.getElementById(infoBulleATraiter).style.top = topDiv.toString()+"px";
	}
	
	if(leftDiv + document.getElementById(infoBulleATraiter).offsetWidth > window.innerWidth)
	{
		document.getElementById(infoBulleATraiter).style.left = (leftInfoBulle + e.pageX -document.getElementById(infoBulleATraiter).offsetWidth-20).toString()+"px";
	}
}

function crosoftMouseMove()
{
	document.getElementById(infoBulleATraiter).style.left = event.clientX + document.documentElement.scrollLeft + 20;
	document.getElementById(infoBulleATraiter).style.top = event.clientY + document.documentElement.scrollTop-30;

	topDiv = event.clientY;
	leftDiv = event.clientX+ document.documentElement.scrollLeft;

	if(topDiv + document.getElementById(infoBulleATraiter).offsetHeight > document.documentElement.clientHeight)
	{	
		topDiv -= document.getElementById(infoBulleATraiter).offsetHeight-document.documentElement.scrollTop-30;
		document.getElementById(infoBulleATraiter).style.top = topDiv.toString()+"px";
	}
		
	if(leftDiv + document.getElementById(infoBulleATraiter).offsetWidth > document.documentElement.clientWidth)
	{	
		document.getElementById(infoBulleATraiter).style.left = (leftDiv-409 ).toString()-20+"px";
	}
}


function ajouteRetourChariot()
{
	document.getElementById(this.id).appendChild(document.createElement("br"));
}

function ajouteTexte(contenu, couleurTexte, police, defilant)
{
	// creation d'un span
	nouveauTexte = document.createElement("span");
	// insertion du contenu
	nouveauTexte.appendChild(document.createTextNode(contenu));
	if(defilant)
	{
		marquee = document.createElement("marquee");
		marquee.appendChild(nouveauTexte);
		document.getElementById(this.id).appendChild(marquee);
	}
	else
	{
		// insertion du span dans l'infobulle
		document.getElementById(this.id).appendChild(nouveauTexte);
	}
	// application du style
	document.getElementById(this.id).lastChild.style.color = couleurTexte;
	document.getElementById(this.id).lastChild.style.fontFamily = police;
}

function ajouteImage(adrImage,titre)
{

	document.getElementById(this.id).innerHTML='<table width="200" height="100" border="0" cellpadding="0" cellspacing="0"><tr><td width="22" height="24" style="background:#ffffff url(../images/a1.gif) no-repeat 0 0;"><div style="width:22px;">&nbsp;&nbsp;</div></td><td height="24" style="padding-left:1px;font-size:14px;padding-top:3px;padding-bottom:3px;background:#ffffff url(../images/a2.gif) repeat-x 0 0;">'+titre+'</td><td width="28" height="24"style="background:transparent url(../images/a3.gif) no-repeat 0 0;"><div style="width:28px;">&nbsp;&nbsp;</div></td></tr><tr><td background="../images/c1.gif"></td><td style="background-color:#ffffff;"><img src="'+adrImage+'" border="0" ></td><td background="../images/c3.gif"></td></tr><tr><td width="22" height="12" style="background:#ffffff url(../images/b1.gif) no-repeat 0 0;"></td><td style="background:#ffffff url(../images/b2.gif) repeat-x 0 0;"></td><td width="28" height="12" style="background:#ffffff url(../images/b3.gif) no-repeat 0 0;"></td></tr></table>';
	this.nbImages ++;
}

function enleveImage(numImage)
{
	if(document.getElementById('imageInfoBulle'+numImage))
	{
		document.getElementById(this.id).removeChild(document.getElementById('imageInfoBulle'+numImage));
	}
}

function ajouteListe()
{
	// creation de la liste
	nouvelleListe = document.createElement("ul");
	// attribution d'un id
	nouvelleListe.setAttribute("id", 'liste'+this.nbElementsListes.length+'infobulle'+this.id);
	// insertion de la liste dans l'infobulle

	document.getElementById(this.id).innerHTML="popo";
	this.nbElementsListes.push(0);
}

function enleveListe(numListe)
{
	if(document.getElementById('liste'+numListe+'infobulle'+this.id))
	{
		document.getElementById(this.id).removeChild(document.getElementById('liste'+numListe+'infobulle'+this.id));
	}
}

function ajouteElementListe(numListe, contenu)
{
	// creation de l'item
	nouvelElement = document.createElement("li");
	// attribution d'un id à l'item
	nouvelElement.setAttribute("id", 'element'+this.nbElementsListes[this.nbElementsListes.length-1]+'liste'+numListe+'infobulle'+this.id);
	// attribution du contenu de l'item
	nouvelElement.appendChild(document.createTextNode(contenu));
	// insertion de l'item dans la liste
	document.getElementById('liste'+numListe+'infobulle'+this.id).appendChild(nouvelElement);
	this.nbElementsListes[numListe] ++;
}

function enleveElementListe(numListe, item)
{
	if(document.getElementById('element'+item+'liste'+numListe+'infobulle'+this.id))
	{
		document.getElementById('liste'+numListe+'infobulle'+this.id).removeChild(document.getElementById('element'+item+'liste'+numListe+'infobulle'+this.id));
	}
}
function creerBulles(titre,contenu)
{
			infobulle1 = new InfoBulle("infobulle1", "", "", "", "black", "Trebuchet MS", false);
			infobulle1.ajouteImage(contenu,titre);	
}