// JavaScript Document
//
function ColorPickerSwatch(id, color, colorname, textcolor) {
	this.id = id;
	this.color = color;
	this.colorname = colorname;
	this.textcolor = textcolor;
}
//
function ColorPickerButton(id) {
	this.interval = null;
	this.img = document.createElement('img');
	this.img.setAttribute('src',"/images/pic-color-picker.gif");
	this.img.setAttribute('id',id+"_img");
	this.img.setAttribute('class',"cntColorPickerColor");
	this.img.className = "cntColorPickerColor";
	this.img.setAttribute('alt',"");
}
//
function ColorPicker(id,oCnt,iInitVal) {
	if (!isNaN(iInitVal)) { iInitVal = -1; } 
	this.id = id;
	this.cnt = oCnt;
	this.aColorVals = [];
	this.aColorVals.push(new ColorPickerSwatch(1,"#BB3936","Red","#E4B0AF"));
	this.aColorVals.push(new ColorPickerSwatch(2,"#FF9900","Orange","#FFD699"));
	this.aColorVals.push(new ColorPickerSwatch(3,"#FFFF00","Yellow","#9C8045"));
	this.aColorVals.push(new ColorPickerSwatch(4,"#E9D9CC","Neutral","#7C7570"));
	this.aColorVals.push(new ColorPickerSwatch(7,"#0066CC","Blue","#99C2EB"));
	this.aColorVals.push(new ColorPickerSwatch(6,"#99D953","Green","#D6F0BA"));
	this.aColorVals.push(new ColorPickerSwatch(5,"#000000","Black/Grey","#999999"));
	this.aColorVals.push(new ColorPickerSwatch(8,"#AD85D6","Purple","#DECEEF"));
	this.aColorVals.push(new ColorPickerSwatch(9,"#513929","Brown","#B9B0A9"));
	this.aColorVals.push(new ColorPickerSwatch(10,"#FFFFFF","White","#858585"));
	this.create();
	this.changeColor(iInitVal,true);
}
//
ColorPicker.prototype.startPickerTimer = function() {
	this.interval = setInterval(hideColorPicker,1000,this.id);
}
//
ColorPicker.prototype.stopPickerTimer = function() {
	clearInterval(this.interval);
}
//
ColorPicker.prototype.changeColor = function(iVal,bBypass) {
	try {
		if (iVal >= 0 && iVal < this.aColorVals.length) {
			setColorPickerVal(this.id+"__"+this.aColorVals[iVal].id,this.aColorVals[iVal].color,bBypass);
		}
	} catch(e) {
		//alert(e);
	}	
}
//
ColorPicker.prototype.create = function() {
	var fld = document.createElement('input');
	fld.setAttribute('type',"hidden");
	fld.setAttribute('id',this.id+"_fld");
	$(this.cnt).appendChild(fld);
	var o = document.createElement('div');
	o.setAttribute('class',"cntColorPicker");
	o.className = "cntColorPicker";
	o.setAttribute('id',this.id);
	$(this.cnt).appendChild(o);
	var img = new ColorPickerButton(this.id);
	o.appendChild(img.img);
	EventCustom.add(img.img,'click',function() { showHideColorPicker(this.id); });
	var pvals = document.createElement('div');
	pvals.setAttribute('class',"cntColorPickerVals");
	pvals.className = "cntColorPickerVals";
	pvals.setAttribute('id',this.id+"_vals");
	o.appendChild(pvals);
	this.populate();
}
//
ColorPicker.prototype.populate = function() {
	for (var i=0; i < this.aColorVals.length; i++) {
		var o = document.createElement('div');
		o.setAttribute('id',this.id+"__"+this.aColorVals[i].id);
		o.cssClass = 'colorContainer';
		o.style.backgroundColor = this.aColorVals[i].color;
		var oP = document.createElement('p');
		oP.innerHTML = (this.aColorVals[i].colorname);
		oP.style.color = this.aColorVals[i].textcolor;
		o.appendChild(oP);
		EventCustom.add(o,'click',function() { setColorPickerVal(this.id,this.style.backgroundColor); });
		$(this.id+"_vals").appendChild(o);
	}
	var oNoStyle = document.createElement('div');
	oNoStyle.setAttribute('id',this.id+"__0");
	oNoStyle.cssClass = 'colorContainerNone';
	oNoStyle.style.backgroundColor = "#FFFFFF";
	oNoStyle.style.backgroundImage = "url(/images/pic-color-picker-noimage-lg.gif)";
	oNoStyle.style.backgroundRepeat = "no-repeat";
	var oPnone = document.createElement('p');
	oPnone.innerHTML = "No preference";
	oPnone.style.color = "#333333";
	oNoStyle.appendChild(oPnone);
	EventCustom.add(oNoStyle,'click',function() { setColorPickerVal(this.id,null); });
	$(this.id+"_vals").appendChild(oNoStyle);
}
//
var colorPickerOffImg = "/images/pic-color-picker.gif";
var colorPickerOnImg = "/images/pic-color-picker-x.gif";
//
function setColorPickerVal(id,sColor,bBypassUpdate) {
	try {
		var sID = id.substring(0,id.indexOf("__"));
		var sColorValID = id.substring(id.indexOf("__")+2,id.length);
		hideColorPicker(sID);
		if (sColor!=null) {
			$(sID+"_img").style.backgroundImage = "url(/images/spacer.gif)";
		} else {
			$(sID+"_img").style.backgroundImage = "url(/images/pic-color-picker-noimage.gif)";
		}
		$(sID+"_img").style.backgroundColor = sColor;
		$(sID+"_fld").value = sColorValID;
		try {
			if (bBypassUpdate == true) {
				// do nothing
				//alert(true);
			} else {
				//alert(false);
				setColorFilterAjax(sColorValID);
			}
		} catch(e2) {
			//alert(e2);
		}
	} catch(e) {
		//alert(e);
	}
}
//
function showHideColorPicker(id) {
	try {
		if ($(id.replace("_img","_vals")).style.display == 'block')  {
			hideColorPicker2(id);
		} else {
			showColorPicker(id);
		}
	} catch(e) {
		//alert(e);
	}
}
//
function showColorPicker(id) {
	try {
		//var colorPickerID = id.replace("_img","");
		//alert(eval(colorPickerID));
		$(id).src = colorPickerOnImg;
		$(id.replace("_img","_vals")).style.display = 'block';
	} catch(e) {
		//alert(e);
	}
}
//
function hideColorPicker2(id) {
	try {
		$(id).src = colorPickerOffImg;
		$(id.replace("_img","_vals")).style.display = 'none';
	} catch(e) {
		//alert(e);
	}
}
//
function hideColorPicker(id) {
	try {
		$(id+"_img").src = colorPickerOffImg;
		$(id+"_vals").style.display = 'none';
	} catch(e) {
		//alert(e);
	}
}
//
//
// TO USE THIS, YOU NEED TO DEFINE THIS FUNCTION IN YOUR SCRIPT
function setColorFilterAjax(id) {
//alert("FILTER COLOR >> "+id);
}