// found at http://www.isolated-designs.net/stuff/colorpicker.html

//###################################################################
//#    CUSTOMIZABLE JAVASCRIPT COLOR PICKER V 0.1
//#    AUTHOR: JUSTIN PALMER
//#    WEBSITE HTTP://WWW.ISOLATED-DESIGNS.NET/CORE
//#    DESCRIPTION:  A CUSTOM COLOR PICKER THAT WILL ALLOW YOU TO EASILY DEFINE UNLIMITED 
//#                  CUSTOM COLOR PALLETES.  SIMPLY ADD ANOTHER CASE TO THE SWITCH STATEMENT
//#                  AND FILL IN YOUR COLOR VALUES.  THEN ADD THE VALUE AND NAME TO THE SELECT MENU.
//#    COMPATIBLE BROWSERS:  TESTED ON MSIE 6, FIREFOX 0.9, OPERA 7...IF YOU USE A DIFFERENT BROWSER
//#    THATS NOT LISTED HERE AND WOULD LIKE TO LET ME KNOW IF IT WORKS OR DOESN'T, PLEASE DROP A COMMENT
//#####################################################################


function ColorPicker(container,field,preview_box,click_function)
{
	var container = $(container);
	var field     = $(field);
	var preview		= $(preview_box);
	var pallete   = 'common';
	var click_function = click_function ? click_function : '';
	
//Initialize the Color Menu, Right now it defaults to common
	var initPage = function()
	{
		colors = getColors(pallete);
		buildColorMenu(20,colors.length, colors, container);
	}
	
	//Swaps the pallte based on user selection
	function swapPallete(colors)
	{
		container.innerHTML = '';
		var colors = getColors(colors);
		buildColorMenu(20, colors.length, colors, container);
	}
		
	//Generate An Array of Hex colors based on the pallete
	function getColors(pallete)
	{
		switch(pallete)
		{
			case 'grayscale' :
				//GRAYSCALE COLORS CAN EASILY BE GENERATED CONSIDERING THERE RBG VALUES
				//ARE EQUAL.
				var colors = generateGrayScale();
				break
			case 'common' :
				var colors = Array(
					'#FFFFFF', '#EDEDED', '#E4E4E4', '#DADADA', '#D1D1D1',
					'#C7C7C7', '#BDBDBD', '#B3B3B3', '#A8A8A8', '#9E9E9E',
					'#FF0010', '#FFFE38', '#76FF36', '#00FFFF', '#002CFD',
					'#EF00FD', '#FB0034', '#FFF125', '#00AE5F', '#00B8EF',
					'#00429A', '#F30094', '#939393', '#878787', '#7B7B7B',
					'#6E6E6E', '#626262', '#535353', '#444444', '#343434',
					'#202020', '#000000', '#FF9C86', '#FFB18D', '#FFC997',
					'#FFF7A4', '#D8E2A6', '#B5D8A6', '#91CFA6', '#78D3CD',
					'#08D6F7', '#63AFDA', '#709DCE', '#7D8CC2', '#9D90C2',
					'#F8A1C6', '#FE9EA5', '#FF715C', '#FF9363', '#FFB26A',
					'#FFF478', '#C3D680', '#96C981', '#55BF84', '#00C3BB',
					'#00C7F3', '#0097CE', '#0080BC', '#416AAD', '#7E6BAF',
					'#A66EAF', '#F475AF', '#FB7388', '#FB0034', '#FF6A35',
					'#FF9936', '#FFF125', '#ADCB52', '#62BC5B', '#00AE5F',
					'#00B2A6', '#00B8EF', '#0080C1', '#0063AB', '#00429A',
					'#593C99', '#923397', '#F30094', '#F90066', '#AD001F',
					'#B34A20', '#B76B21', '#C4A621', '#748F3B', '#408641',
					'#007E46', '#008076', '#0083AB', '#005A89', '#00437B',
					'#00256E', '#421E6C', '#68006B', '#A90068', '#AC0047',
					'#8A0000', '#8D3A00', '#905400', '#998402', '#58712A',
					'#2E6B31', '#006535', '#00665E', '#006988', '#00456D',
					'#003162', '#000258', '#2F0056', '#540054', '#870052',
					'#8A0035', '#D3B7A1', '#A88E80', '#816E64', '#625550',
					'#463D3B', '#D6A279', '#B8855E', '#9E6D49', '#875735',
					'#744524'
					);
					break
					
					//DEFINE YOUR CUSTOM PALLETES HERE
					//case 'mycustom' :
					// var colors = Array('#333333', '#FFFFFF');
					// return colors;
			default :
				//Nada
		}
		return colors;
	}

	
	//The Work horse that does all the bulding
	function buildColorMenu(num_rows, total_cells, colors, rootID)
	{
		if(typeof colors != 'object'){ alert('Error: Colors Must Be An Array');}
		var table = document.createElement('table');
		table.className = 'color_picker_swatch';
		table.cellpadding = 0;
		table.cellspacing = 1;
		container.appendChild(table);
		var tbody = document.createElement('tbody');
		var tr = document.createElement('tr');
		tbody.appendChild(tr);
		table.appendChild(tbody);
		var row = tr;
		for(var i = 0; i < total_cells; i++)
		{
			if( (i != 0) && ( i % num_rows ) == 0) {
				row = tbody.appendChild(document.createElement('tr'));
				} 
				td = document.createElement('td')
				td.title = colors[i];
				td.onclick = showColor;
				//td.onmouseover = showColor;
				td.style.background = colors[i];
				row.appendChild(td);
		}
		
		tfoot = document.createElement('tfoot');
		return table;
	}
	
	function generateGrayScale()
	{
		var colors = Array();
		for(var i = 0; i < 256; i++)
		{
			hex = decToHex(i);
			rgb = '#' + hex + hex + hex;
			colors.push(rgb);
		}
		return colors.reverse();
	}

	
	function showColor()
	{
	 field.value = this.title;
	 preview.style.backgroundColor = this.title;
	 if (click_function) eval(click_function);
	}
	 
	//Utility Scrtip to Convert decimal to hex value	 
	function decToHex(dec)
	{
		var hexStr = "0123456789ABCDEF";
		var low = dec % 16;
		var high = (dec - low)/16;
		hex = "" + hexStr.charAt(high) + hexStr.charAt(low);
		return hex;
	}
	
	initPage();
	
}