// Note: Script consists of two files: picker.js.php and color_picker.php
var TCP = new TColorPicker();

function TCPopup(field, palette,tdp_action) {	
	this.field = field;
	this.tdp_action = tdp_action;
	this.initPalette = !palette || palette > 2 ? 0 : palette;
	var w = 194, h = 206,
	move = screen ? 
		',left=' + ((screen.width - w) >> 1) + ',top=' + ((screen.height - h) >> 1) : '', 
	o_colWindow = window.open('/lib/color_picker.php', null, "help=no,status=no,scrollbars=no,resizable=no" + move + ",width=" + w + ",height=" + h + ",dependent=yes", true);

	this.opener= window;
	o_colWindow.opener = window;
	o_colWindow.focus();
}

function TCBuildCell (R, G, B, w, h) {
	return "<td bgcolor=#" + this.dec2hex((R << 16) + (G << 8) + B) + "><a href=javascript:P.S('" + this.dec2hex((R << 16) + (G << 8) + B) + "') onmouseover=P.P('" + this.dec2hex((R << 16) + (G << 8) + B) + "')><img src=http://ww2.thedollpalace.com/images/spacer.gif width=" + w + " height=" + h + " border=0></a></td>";
}

function TCSelect(c) {
	if (this.tdp_action==1){
		//if this is a dollmaker - update the background on dynamic image
		change('img_back','dynamic_back.php?bgcol=' + c.toUpperCase() + '&width=' + document.form1.width.value + '&height=' + document.form1.height.value);
	} 	

	if (this.tdp_action==1 || this.tdp_action==2 || this.tdp_action==3 || this.tdp_action==4 || this.tdp_action==5 || this.tdp_action==6 || this.tdp_action==7 || this.tdp_action==8 || this.tdp_action==9 || this.tdp_action==10 || this.tdp_action==11 || this.tdp_action==12 || this.tdp_action==13 || this.tdp_action==14){
		//if dollmaker background or font background  - do not add #
		this.field.value = c.toUpperCase();
		if (this.tdp_action==1) {
			document.getElementById('bgcol_sampler').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==2) {
			document.getElementById('fntcol_sampler').style.backgroundColor='#' + c.toUpperCase();
			hiliteToColor(document.forms['form1'].elements['doll_name'],c.toUpperCase());
		}
		if (this.tdp_action==3) {
			document.getElementById('bordercol_sampler').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==4) {
			this.field.value = c.toUpperCase();
			document.getElementById('bgcol_sampler').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==5) {
			this.field.value = c.toUpperCase();
			document.getElementById('fntcol_sampler1').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==6) {
			this.field.value = c.toUpperCase();
			document.getElementById('fntcol_sampler2').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==7) {
			this.field.value = c.toUpperCase();
			document.getElementById('fntcol_sampler3').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==8) {
			this.field.value = c.toUpperCase();
			document.getElementById('fntcol_sampler4').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==9) {
			this.field.value = c.toUpperCase();
			document.getElementById('outcol_sampler1').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==10) {
			this.field.value = c.toUpperCase();
			document.getElementById('outcol_sampler2').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==11) {
			this.field.value = c.toUpperCase();
			document.getElementById('outcol_sampler3').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==12) {
			this.field.value = c.toUpperCase();
			document.getElementById('outcol_sampler4').style.backgroundColor='#' + c.toUpperCase();
		}
		if (this.tdp_action==13) {			
			this.field.value = '#' + c.toUpperCase();
			setcColor();
		}		
		if (this.tdp_action==14) {			
			this.field.value = '#' + c.toUpperCase();
			setbColor();			
		}			
	} else {
		//add # as the first character for the color and set the value on the form
		this.field.value = '#' + c.toUpperCase();
	}

	this.win.close();
}


function TCPaint(c, b_noPref) {
	var c = (b_noPref ? '' : '#') + c
	if(this.doc.layers)
		this.sample.bgColor = c;
	else { 
		this.sample.backgroundColor = c;
		this.sample.background = c;
	}
}

function TCGenerateSafe() {
	var s = '';
	for (j = 0; j < 12; j ++) {
		s += "<tr>";
		for (k = 0; k < 3; k ++)
			for (i = 0; i <= 5; i ++)
				s += this.bldCell(k * 51 + (j % 2) * 51 * 3, Math.floor(j / 2) * 51, i * 51, 8, 10);
		s += "</tr>";
	}
	return s;
}

function TCGenerateWind() {
	var s = '';
	for (j = 0; j < 12; j ++) {
		s += "<tr>";
		for (k = 0; k < 3; k ++)
			for (i = 0; i <= 5; i++)
				s += this.bldCell(i * 51, k * 51 + (j % 2) * 51 * 3, Math.floor(j / 2) * 51, 8, 10);
		s += "</tr>";
	}
	return s	
}

function TCGenerateGray() {
	var s = '';
	for (j = 0; j <= 15; j ++) {
		s += "<tr>";
		for (k = 0; k <= 15; k ++) {
			g = Math.floor((k + j * 16) % 256);
			s += this.bldCell(g, g, g, 9, 7);
		}
		s += '</tr>';
	}
	return s
}

function TCDec2Hex(v) {
	v = v.toString(16);
	for(; v.length < 6; v = '0' + v);
	return v;
}

function TCChgMode(v) {
	for (var k in this.divs) this.hide(k);
	this.show(v);
}

function TColorPicker(field) {
	this.build0 = TCGenerateSafe;
	this.build1 = TCGenerateWind;
	this.build2 = TCGenerateGray;
	this.show = document.layers ? 
		function (div) { this.divs[div].visibility = 'show' } :
		function (div) { this.divs[div].visibility = 'visible' };
	this.hide = document.layers ? 
		function (div) { this.divs[div].visibility = 'hide' } :
		function (div) { this.divs[div].visibility = 'hidden' };
	// event handlers
	this.C       = TCChgMode;
	this.S       = TCSelect;
	this.P       = TCPaint;
	this.popup   = TCPopup;
	this.draw    = TCDraw;
	this.dec2hex = TCDec2Hex;
	this.bldCell = TCBuildCell;
	this.divs = [];
}

function TCDraw(o_win, o_doc) {
	this.win = o_win;
	this.doc = o_doc;
	var 
	s_tag_openT  = document.layers ? 
		'layer visibility=hidden top=54 left=5 width=182' : 
		'div style=visibility:hidden;position:absolute;left:6px;top:54px;width:182px;height:0',
	s_tag_openS  = document.layers ? 'layer top=32 left=6' : 'div',
	s_tag_close  = document.layers ? 'layer' : 'div'
		
	this.doc.write('<' + s_tag_openS + ' id=sam name=sam><table cellpadding=0 cellspacing=0 border=1 width=181 align=center class=bd><tr><td align=center height=18><font face=Tahoma size=2>sample <font color=white>sample</font></font></td></tr></table></' + s_tag_close + '>');
	this.sample = o_doc.layers ? o_doc.layers['sam'] : 
		o_doc.getElementById ? o_doc.getElementById('sam').style : o_doc.all['sam'].style

	for (var k = 0; k < 3; k ++) {
		this.doc.write('<' + s_tag_openT + ' id="p' + k + '" name="p' + k + '"><table cellpadding=0 cellspacing=0 border=1 align=center>' + this['build' + k]() + '</table></' + s_tag_close + '>');
		this.divs[k] = o_doc.layers ? o_doc.layers['p' + k] : o_doc.getElementById('p' + k).style
	}
	this.C(this.initPalette);
	if (this.field.value) this.P(this.field.value, true)
}