/*
   Adaptation à partir de Fotolia : Patrice Ruault <patrice.ruault@peel.fr>
   Auteur: Joel Kociolek <joel@francecreation.com>
   
*/

function css_popup(url,titre,prix) {
	var tmp, tmp2, csspopup; 

        // Trouve la taille de la zone html
	var width,height;
	if (self.innerHeight) { // tous sauf IE
		width = self.innerWidth;
		height = self.innerHeight;
	}
	else if (document.documentElement && document.documentElement.clientHeight) { // IE 6 mode strict 
		width = document.documentElement.clientWidth;
		height = document.documentElement.clientHeight;
	}
	else if (document.body) { // autres IE
		width = document.body.clientWidth;
		height = document.body.clientHeight;
	}

        // Trouve de combien on a defile
	var offset_x,offset_y;
	if (self.pageYOffset) { // tous sauf IE
		offset_x = self.pageXOffset;
		offset_y = self.pageYOffset;
	}
	else if (document.documentElement && document.documentElement.scrollTop) { //  IE 6 mode strict
		offset_x = document.documentElement.scrollLeft;
		offset_y = document.documentElement.scrollTop;
	}
	else if (document.body) { // autres IE
		offset_x = document.body.scrollLeft;
		offset_y = document.body.scrollTop;
	}

	// vire un eventuel popup precedent
	css_unpop();

	// cree la structure du popup
	csspopup = document.createElement('div');
	csspopup.id = 'csspopup'
	csspopup.style.position = 'absolute';
	csspopup.style.top = '-10000px';
	csspopup.style.left = '-10000px';
	csspopup.ZIndex = '10000';
	csspopup.style.padding = '5px';
	csspopup.style.backgroundColor = '#fff';
	csspopup.style.border = '1px solid #888';
	csspopup.style.cursor = 'pointer';

	csspopup.innerHTML='<h2>' + titre + '</h2><h3>Prix : ' + prix + '</h3>';

	tmp = document.createElement('div');
	tmp.style.textAlign = 'center';
	tmp.style.padding = '2px';
	tmp.style.clear = 'both';
	// On prepare l'image mais on ne la charge pas tant que son onload n'a pas ete declare
	var pop_image = document.createElement('img');
	pop_image.style.border = 'none';
	tmp.appendChild(pop_image);
	csspopup.appendChild(tmp);

/*
	tmp = document.createElement('div');
	tmp.style.textAlign = 'center';
	tmp.style.padding = '2px';
	tmp2 = document.createTextNode('Cliquez pour fermer');
	tmp.appendChild(tmp2);
	csspopup.appendChild(tmp);
*/

	document.body.appendChild(csspopup);

	//csspopup.onclick = css_unpop;
	document.onclick = css_unpop;
	csspopup.onmouseover = function () {
		csspopup.onmouseout = css_unpop;
	}
	//csspopup.onmouseout = css_unpop;

	// on n'affichera le popup qu'une fois l'image chargee pour etre sur de
	// connaitre sa taille reele
	pop_image.onload = function () {
		var csspopup = document.getElementById('csspopup');
		if(csspopup) {
			// contournement bug IE
			if(document.all) { ieHideSelect(); }

			// C'est ici qu'on affiche pour de bon
			csspopup.style.left = ((width / 2) - (csspopup.offsetWidth / 2) + offset_x) + "px";
			csspopup.style.top = ((height / 2) - (csspopup.offsetHeight / 2) + offset_y) + "px";

		}
	}
	// Et enfin on charge l'image. L'affichage ne se fera reelement qu'une
	// fois le chargement termine
	pop_image.src = url;

	return void(0);
}

function css_unpop(e) {
	var csspopup = document.getElementById('csspopup');
	if(csspopup) {
		// contournement bug IE
		if(document.all) { ieRestoreSelect(); }
		// On supprime le popup
		document.body.removeChild(csspopup);
	}
}

// Masquage de tous les <select> pour IE (contournement de bug)
// L'objectif est d'eviter que les select n'apparaissent a travers un div qui
// passer devant. Il existe un meilleurs contournement (avec creation d'une
// iframe) mais j'ai choisi de ne pas l'utiliser (pas le temps)
function ieHideSelect() {
	for (var i = 0; i < document.all.length; i++) {
		o = document.all(i);
		if (o.type == 'select-multiple') {
			if (o.style) o.style.display = 'none';
		}
		if (o.type == 'select-one') {
			if (o.style) o.style.display = 'none';
		}
	}
} 

// Affichage de tous les <select> pour IE (contournement de bug)
// operation invers de ieHideSelect
function ieRestoreSelect(){
	for (var i = 0; i < document.all.length; i++) {
		o = document.all(i);
		if (o.type == 'select-one') {
			if (o.style) o.style.display = '';
		}
		if (o.type == 'select-multiple') {
			if (o.style) o.style.display = '';
		}
	}
}