//##################################
// FONCTIONS PERMETTANT LA SELECTION DES COULEURS  //
//##################################
// donn?es pr?lancement ? port?e globale !!
var image_affiche = new Array(10);
//fonction de pr?-lancement multit?che ^^
function pre_lancement_couleurs(name_ch,couleur_defaut) {
	// pr?chargement de l'image :D :D
	var imgs = new Array('svg-color.png');
	for( var i = 0 ; i < imgs.length ; i++ )
	{
		var tmp = imgs[ i ];
		(imgs[ i ] = new Image()).src = tmp;
	}
	
	// modification des variables ? port?e globale !
	image_affiche[name_ch] = false;
	
	// on simplifie le nom du DIV
	div_origine = document.getElementById('couleur_div-' + name_ch);
	
	// on r?cup?re la couleur par d?faut
	couleur_defaut = (couleur_defaut != '') ? couleur_defaut : '#FFFFFF';
	
	/*// position de la mini-fen?tre
	pos_e_g = parseInt(document.getElementById('couleur_div-' + name_ch).style.left + (document.body.clientWidth*50/100), 10) + 75;
	pos_e_h = parseInt(document.getElementById('couleur_div-' + name_ch).style.top + (document.body.clientHeight*50/100), 10) + 180;
	// top: ' + pos_e_h + 'px; left: ' + pos_e_g + 'px;*/
	
	// on pr?pare le HTML
	html_to_insert = '<div id="prevCouleur-' + name_ch + '" style="border:2px solid white; display:inline; background-color:white;">';
		html_to_insert += '<a href="javascript: image_map_couleur(\'' + name_ch + '\');">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a>';
	html_to_insert += '</div>';
	
	html_to_insert += '&nbsp;<input value="' + couleur_defaut + '" name="' + name_ch + '" id="' + name_ch + '" type="text" size="7" maxlength="7" onfocus="image_map_couleur(\'' + name_ch + '\')" onblur="image_map_couleur(\'' + name_ch + '\')" />';
	html_to_insert += '&nbsp;<a href="javascript: image_map_couleur(\'' + name_ch + '\');"><img border=0 src="svg-window.png" title="Show All Colors" alt="Show all colors" /></a>';
	
	html_to_insert += '<div onmousemove="movemouse(event);" style="display: inline;">';
		html_to_insert += '<div onmousedown="move(document.getElementById(\'imageAff-' + name_ch + '\'), event);" style="visibility: hidden; position: absolute; z-index: 2; border: 1px navy dotted; background: #CCDFFF; padding: 5px;" id="imageAff-' + name_ch + '">';
			html_to_insert += 'Choose color &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ';
			html_to_insert += '<a href="#null" onclick="image_map_couleur(\'' + name_ch + '\');"><img border=0 src="svg-close.png" alt="[close]" /></a>';
			html_to_insert += '<br /><br />';
			html_to_insert += '<img border=0 src="svg-color.png" usemap="#couleur_map-' +name_ch+ '" alt="" />';
		html_to_insert += '</div>';
	html_to_insert += '</div>';
	
	// on l'insert
	div_origine.innerHTML = html_to_insert;
	
	// on lance la pr?visualisation en directe
	prev_couleur(name_ch);
	
	// affichage de la map
	map_couleur(name_ch);
}
// fonction d'affichage des couleurs possibles (image mapp?e) et map !
function image_map_couleur(name_ch) {
	// affichage de l'image
	if(image_affiche[name_ch] == false)
	{
		document.getElementById('imageAff-' + name_ch).style.visibility = 'visible';
	}
	else
	{
		document.getElementById('imageAff-' + name_ch).style.visibility = 'hidden';
	}
	image_affiche[name_ch] = (image_affiche[name_ch] == false) ? true : false;
}
// affichage de la map
function map_couleur(name_ch) {
	var listeCouleurs = new Array(
		new Array('FF0000','FFFF00','00FF00','00FFFF','0000FF','FF00FF','FFFFFF','EDEDED','E5E5E5','DBDBDB','D2D2D2','C9C9C9','BEBEBE','B4B4B4','A9A9A9','9F9F9F','E20019','FFEC00'),
		new Array('008F35','009DE0','152882','E20079','949494','888888','7B7B7B','6E6E6E','616161','525252','424242','303030','1A1A1A','000000','F29979','F6B182','FBCB8B','FFF59A'),
		new Array('CFDF98','AFD397','8FC796','8ACCC5','83D0F0','8AADD7','8D99C9','8F85B9','00497E','C392BD','C392BD','F19C9F','EA6444','F08D4D','F8B254','FFF15D','B7D064','87BD66'),
		new Array('45AB67','2EB2AC','468CC5','468CC5','5571B0','5F549B','89599C','AC5F9D','EA679E','EA6677','E20019','E95C0F','F29400','FFEC00','C6D806','97BE0C','008F35','00968F'),
		new Array('009DE0','0069B2','004998','152882','612080','92107D','92107D','E3004E','9C0C14','A04210','A76703','B3A300','678613','277520','006628','006A65','006E9D','00497E'),
		new Array('00326D','0F1A5E','45145C','680759','9F0056','9D0037','770E11','7B330E','7F4F07','877D00','4D6610','175A19','004F1E','00514E','005379','003661','002353','0D0F48'),
		new Array('350946','500044','7B0041','790329','CDBBA3','A28F7B','7B6859','58473E','372F2A','CBA473','AE8453','946838','7C4F23','673914','FFFFFF','FFFFFF','FFFFFF','FFFFFF')
	);
	
	var affichage = '<map name="couleur_map-' +name_ch+ '">';
	
	// variables de d?part
	x1 = 1;
	y1 = 1;
	x2 = 12;
	y2 = 12;
	
	for(i=0; i<7; i++)
	{
		for(i2=0; i2<18; i2++)
		{
			affichage += '<area shape="rect" coords="'+x1+','+y1+','+x2+','+y2+'", href="javascript: save_hex(\'' + listeCouleurs[i][i2] + '\',\'' + name_ch + '\')" title="#' + listeCouleurs[i][i2] + '" />';
			x1 += 12;
			x2 += 12;
		}
		x1 = 1;
		x2 = 12;
		y1 += 12;
		y2 += 12;
	}
	affichage += '</map>';
	
	// affichage
	document.getElementById('couleur_div-' + name_ch).innerHTML += affichage;
}
// cette fonction enregistre la couleur dans un champ !
function save_hex(code_hex,name_ch) {
	// inscription de la couleur dans le div de pr?visualisation
	document.getElementById('prevCouleur-' + name_ch).style.backgroundColor = '#' + code_hex;
	
	// inscription de la couleur dans le champ
	document.getElementById(name_ch).value = '#' + code_hex;
}
// cette fonction permet la pr?visualisation en direct de la couleur choisie
function prev_couleur(name_ch) {
	couleurActuelle = document.getElementById(name_ch).value;
	if(couleurActuelle.length == 7)
	{
		document.getElementById('prevCouleur-' + name_ch).style.backgroundColor = couleurActuelle;
	}
	
	// lancement de la fonction dans 0.5 secondes
	setTimeout('prev_couleur(\'' + name_ch + '\')',500);
}