//-------------------------------------------------------------
//  Nom Document : palette
//  Auteur       : kazma
//  Objet        : palette de couleur  http://www.javascriptfr.com/
//  Création     : 27.08.2010
//-------------------------------------------------------------
//  Mise à Jour  : 31.08.2010
//  Objet        : debogage
//-------------------------------------------------------------
//-(*)------------------

function selecte(ev){
((navigator.userAgent.substring(30,31))<=8) ? event.returnValue = false : ev.preventDefault();
}

function couleur(e){

var tabcode=['0','1','2','3','4','5','6','7','8','9','a','b','c','d','e','f'];

var dde=(navigator.vendor) ? document.body : document.documentElement;
var setX =e.clientX + dde.scrollLeft;
var lui=(parseInt(navigator.userAgent.substring(30,31))<=8) ? event.srcElement : e.currentTarget;
var dec=(navigator.appName.substring(0,3)=="Ope") || (navigator.userAgent.substring(30,31)==8) ? 0 : 3;
lui.childNodes[0].nodeValue=setX-lui.parentNode.parentNode.offsetLeft-lui.offsetLeft-dec;  //3 est la taille de la bordure du div genecoul
var el=lui.childNodes[0].nodeValue;
document.getElementById('cur'+lui.id).style.left=setX-lui.parentNode.parentNode.offsetLeft-lui.parentNode.offsetLeft-lui.offsetLeft-dec+'px';  //5 est la taille de la bordure du div genecoul plus la taille de l'aiguille divisé par deux
if(el>=0 && el<=255){
var el2=tabcode[Math.floor((el/16))];
el=tabcode[Math.round((el%16))];
el=el2+el;
var ch=document.getElementById('chiffre').value;

switch (lui.id){
  case "rouge": el=ch.substring(0,1)+el+ch.substring(3,7); break;
  case "vert": el=ch.substring(0,3)+el+ch.substring(5,7); break;
  case "bleu": el=ch.substring(0,5)+el; break;
  }
document.getElementById('chiffre').value=el;
document.getElementById('divcoul').style.backgroundColor=el;
}
}

function evenements(e){
var lui=(parseInt(navigator.userAgent.substring(30,31))<=8) ? event.srcElement : e.currentTarget;
if(parseInt(navigator.userAgent.substring(30,31))<=8){
var luie=event.srcElement;
luie.attachEvent('onmousemove',couleur);
luie.attachEvent('onmouseout',fin);
luie.attachEvent('onmouseup',fin);
document.documentElement.attachEvent("onmousemove",selecte);
}
else{
lui.addEventListener("mouseup",fin, false);
lui.addEventListener("mouseout",fin, false);
lui.addEventListener("mousemove",couleur, false);
document.documentElement.addEventListener("mousedown", selecte, false);
}
}

function fin(e){
var lui=(parseInt(navigator.userAgent.substring(30,31))<=8) ? event.srcElement : e.currentTarget;
if(parseInt(navigator.userAgent.substring(30,31))<=8){
luilui=event.srcElement;
luilui.detachEvent('onmouseout',fin);
luilui.detachEvent('onmouseup',fin);
luilui.detachEvent('onmousemove',couleur);
document.documentElement.detachEvent("onmousemove",selecte);
}
else{
lui.removeEventListener("mousemove",couleur, false);
lui.removeEventListener("mouseout",fin, false);
lui.removeEventListener("mouseup",fin, false);
document.documentElement.removeEventListener("mousedown", selecte, false);
}
}

function coulfade(element,sens,vitesse){

if(arguments.length>=1){
this.el=typeof (arguments[0])=='string' ? document.getElementById(arguments[0]).style : document.getElementById(element.id).style;
this.sens=arguments[1];
this.setvit=arguments[2];
this.sens=='plus' ? this.prog=0 : this.prog=1;
}
this.sens=='plus' ? this.prog+=0.1 : this.prog-=0.1;

if(parseInt(navigator.userAgent.substring(30,31))<=8){
this.el.filter = 'alpha(opacity='+(this.prog*100)+')';
} 
else{
this.el.opacity=this.prog;
}
if(this.prog>=1 && this.sens=='plus'){
return false;
}
if(this.prog<=0 && this.sens=='moins'){
document.getElementById('genecoul').parentNode.removeChild(document.getElementById('genecoul'));
return false;
} 
setTimeout('coulfade()',this.setvit);
}

function creation(elem,parent){

var ddc=(arguments[1]=='body') ? document.body : document.getElementById(parent);

var constrution=document.createElement(elem);
if((arguments.length>2)){
var arle=2;
while (arle<arguments.length){
constrution.setAttribute(arguments[arle],arguments[arle+1]);
arle+=2;
}
}
ddc.appendChild(constrution);
}

function arcenmouse(e){

dde=(navigator.vendor) ? document.body : document.documentElement;
var lui=document.getElementById('arccoul')
var j =Math.floor(e.clientX + dde.scrollLeft-lui.parentNode.parentNode.offsetLeft-lui.parentNode.offsetLeft-lui.offsetLeft);
var el=document.getElementById('divcoul')

if (j<=42){
var i=Math.floor(6*j)
el.style.backgroundColor='rgb(255,'+i+',0)'
}
else if (j<=85){
var i=256-Math.floor(6*(j-42))
el.style.backgroundColor='rgb('+i+',255,0)'
}
else if (j<=128){
var i=Math.floor(6*(j-85))
el.style.backgroundColor='rgb(0,255,'+i+')'
}
else if (j<=170){
var i=256-Math.floor(6*(j-128))
el.style.backgroundColor='rgb(0,'+i+',255)'
}
else if (j<=213){
var i=Math.floor(6*(j-170))
el.style.backgroundColor='rgb('+i+',0,255)'
}
else if (j<=256){
var i=256-Math.floor(6*(j-213))
el.style.backgroundColor='rgb(255,0,'+i+')'
}
gesticoul()
}

function arcenevent(){
var dde=document.documentElement
var lui=document.getElementById('arccoul')
if(parseInt(navigator.userAgent.substring(30,31))<=8){
dde.attachEvent('onmousemove',arcenmouse);
dde.attachEvent("onmousemove",selecte);
dde.attachEvent('onmouseup',arcenout);
}
else{
dde.addEventListener("mousemove",arcenmouse, false);
dde.addEventListener("mousedown", selecte, false);
dde.addEventListener("mouseup",arcenout, false);
}
}

function arcenout(){
var dde=document.documentElement
var lui=document.getElementById('arccoul')
if(parseInt(navigator.userAgent.substring(30,31))<=8){
dde.detachEvent('onmousemove',arcenmouse);
dde.detachEvent("onmousemove",selecte);
dde.detachEvent('onmouseup',arcenout);
}
else{
dde.removeEventListener("mousemove",arcenmouse, false);
dde.removeEventListener("mousedown", selecte, false);
dde.removeEventListener("mouseup",arcenout, false);
}
}

function gesticoul(ev){

var tabcode=['0','1','2','3','4','5','6','7','8','9','a','b','c','d','e','f'];

if(arguments.length==0){

var val=document.getElementById('divcoul').style.backgroundColor;
}
else{
var val=ev.style.backgroundColor;
document.getElementById('divcoul').style.backgroundColor=ev.style.backgroundColor;
}

if(val.substr(0,1)=='#'){
val=[parseInt(val.substr(1,2),16),parseInt(val.substr(3,2),16),parseInt(val.substr(5,2),16)]
}
else{
val=val.replace(/rgb\(/gi,"");
val=val.replace(/\)/gi,"");
val=val.split(",");
}
document.getElementById('rouge').childNodes[0].nodeValue=parseInt(val[0]);
document.getElementById('vert').childNodes[0].nodeValue=parseInt(val[1]);
document.getElementById('bleu').childNodes[0].nodeValue=parseInt(val[2]);
document.getElementById('currouge').style.left=parseInt(val[0])-3+'px';
document.getElementById('curvert').style.left=parseInt(val[1])-3+'px';
document.getElementById('curbleu').style.left=parseInt(val[2])-3+'px';
var valcoul='';
for (var i=0; i<=2; i++){
var el2=tabcode[Math.floor((val[i]/16))];
var el=tabcode[Math.round((val[i]%16))];
valcoul+=el2+el;
}
document.getElementById('chiffre').value='#'+valcoul;
}


function initcoul(){

if(document.getElementById('genecoul')==null){
creation('div','body','id','genecoul');
creation('div','genecoul','id','genebar');
creation('div','genebar','id','rouge','onmousedown','evenements(event)');
document.getElementById('rouge').appendChild(document.createTextNode('0'));
creation('div','rouge','id','currouge');
creation('div','genebar','id','vert','onmousedown','evenements(event)');
document.getElementById('vert').appendChild(document.createTextNode('0'));
creation('div','vert','id','curvert');
creation('div','genebar','id','bleu','onmousedown','evenements(event)');
document.getElementById('bleu').appendChild(document.createTextNode('0'));
creation('div','bleu','id','curbleu');
creation('img','genebar','id','arccoul','src','res/arc.jpg','onmousedown','arcenevent()');
creation('div','genecoul','id','chtb');
creation('input','chtb','id','chiffre','value','#000000','readonly','readonly');
creation('table','chtb','id','tbcoul');
creation('div','genecoul','id','divcoul');
creation('div','genecoul','class','bout','onclick','initcoul()');
if(parseInt(navigator.userAgent.substring(30,31))<=7){
document.getElementById("chiffre").readOnly=true
document.getElementById("tbcoul").className='ie'
document.getElementById('rouge').onmousedown=evenements;
document.getElementById('vert').onmousedown=evenements;
document.getElementById('bleu').onmousedown=evenements;
document.getElementById('arccoul').onmousedown=arcenevent;
}

var couleur=['#A0522D','#A52A2A','#696969','#FFDEAD','#000000','#ffffff','#000080','#808000','#FFE4C4','#FF1493','#FFA500','#DEB887','#D2691E','#FF7F50','#00FA9A','#D8BFD8','#9ACD32','#4682B4','#FFE4E1','#FFD700']
document.getElementById("tbcoul").insertRow(0);
for(var i=0;i<=couleur.length-1;i++){
document.getElementById("tbcoul").rows[0].insertCell(i);
document.getElementById("tbcoul").rows[0].cells[i].style.backgroundColor=couleur[i]
document.getElementById("tbcoul").rows[0].cells[i].onclick=function(){gesticoul(this)};
}
coulfade('genecoul','plus',30)
}
else{
coulfade('genecoul','moins',20)
}
}