var display_options_counter = 0;
function show_options(){
	var options_html = "";    
	options_html += "<form name='map_form'>\n";
	options_html += "<table class='view_results'>\n";
	options_html += "	<tr class='search_title' onClick='javascript:hide_options();'>\n";
	options_html += "		<td class='map_total_white' colspan='2'>Hide Options</td>\n";
	options_html += "		<td class='map_total_white' align='center' width='40'><a href='javascript:hide_options();'><img src='http://www.suburbview.com/images/up.png' /></a></td>\n";
	options_html += "	</tr>\n";
	options_html += "</table>\n";
	options_html += "<form name='map_form'>\n";
	options_html += "<table class='search_results'>\n";
	options_html += "	<tr class='map_price'>\n";
	options_html += "		<td colspan='3'>Property Category</td>\n";
	options_html += "	</tr>\n";
	options_html += "	<tr class='found_total'>\n";
	options_html += "		<td></td>\n";
	options_html += "		<td>For Sale</td>\n";
	options_html += "		<td>Rent</td>\n";
	options_html += "	</tr>\n";
	options_html += create_category_option_row("1", "iconb.png", "house", 0, 1);
	options_html += create_category_option_row("2", "icong.png", "apartment", 2, 3);
	options_html += create_category_option_row("3", "icon1.png", "unit", 4, 5);
	options_html += create_category_option_row("4", "icon2.png", "townhouse", 6, 7);
	options_html += create_category_option_row("5", "icon3.png", "land", 8, 9);
	options_html += create_category_option_row("6", "icon4.png", "villa", 10, 11);
	options_html += create_category_option_row("7", "icon5.png", "unit-apmt", 12, 13);
	options_html += create_category_option_row("8", "icon6.png", "acreage-semi-rural", 14, 15);
	options_html += create_category_option_row("9", "icon7.png", "duplex-semi-detached", 16, 17);
	options_html += create_category_option_row("10", "icon8.png", "rural", 18, 19);
	options_html += create_category_option_row("11", "icon9.png", "unknown", 20, 21);
	options_html += "</table>\n";
	options_html += "</form>\n";
	display_options_counter = 0;
	options_html += "<form name='map_price_form'>\n";
	options_html += "<table class='search_results'>\n";
	options_html += "	<tr class='map_price'>\n";
	options_html += "		<td colspan='2'>Price</td>\n";
	options_html += "	</tr>\n";
	options_html += "	<tr class='found_total'>\n";
	options_html += "		<td>For Sale</td>\n";
	options_html += "		<td>Rent</td>\n";
	options_html += "	</tr>\n";
	options_html += create_price_option_row("A", "No Price", "No Price", 0, 1);
	options_html += create_price_option_row("B", "< $100,000", "Under $100", 2, 3);
	options_html += create_price_option_row("C", "$100,000-$200,000", "$100-$200", 4, 5);
	options_html += create_price_option_row("D", "$200,000-$300,000", "$200-$300", 6, 7);
	options_html += create_price_option_row("E", "$300,000-$400,000", "$300-$400", 8, 9);
	options_html += create_price_option_row("F", "$400,000-$500,000", "$400-$500", 10, 11);
	options_html += create_price_option_row("G", "$500,000-$600,000", "$500-$600", 12, 13);
	options_html += create_price_option_row("H", "$600,000-$700,000", "$600-$700", 14, 15);
	options_html += create_price_option_row("I", "$700,000-$800,000", "$700-$800", 16, 17);
	options_html += create_price_option_row("J", "$800,000-$900,000", "$800-$900", 18, 19);
	options_html += create_price_option_row("K", "$900,000-$1Mill", "$900-$1,000", 20, 21);
	options_html += create_price_option_row("L", "Above $1 Million", "Above $1,000", 22, 23);
	options_html += "</table>\n";
	options_html += "</form>\n";
	display_options_counter = 0;
	options_html += "<form name='map_room_form'>\n";
	options_html += "<table class='search_results'>\n";
	options_html += "	<tr  class='map_price'>\n";
	options_html += "		<td colspan='2'>Rooms</td>\n";
	options_html += "	</tr>\n";
	options_html += "	<tr class='found_total'>\n";
	options_html += "		<td>For Sale</td>\n";
	options_html += "		<td>Rent</td>\n";
	options_html += "	</tr>\n";
	options_html += create_room_option_row("0", "Unknown", 0, 1);
	options_html += create_room_option_row("1", "1", 2, 3);
	options_html += create_room_option_row("2", "2", 4, 5);
	options_html += create_room_option_row("3", "3", 6, 7);
	options_html += create_room_option_row("4", "4", 8, 9);
	options_html += create_room_option_row("5", "5", 10, 11);
	options_html += create_room_option_row("6", "6", 12, 13);
	options_html += create_room_option_row("7", "7", 14, 15);
	options_html += create_room_option_row("8", "8", 16, 17);
	options_html += create_room_option_row("9", "9", 18, 19);
	options_html += "	</tr>\n";
	options_html += "</table>\n";
	options_html += "<table class='view_results'>\n";
	options_html += "	<tr class='search_title' onClick='javascript:hide_options();'>\n";
	options_html += "		<td class='map_total_white' colspan='2'>Hide Options</td>\n";
	options_html += "		<td class='map_total_white' align='center' width='40'><a href='javascript:hide_options();'><img src='http://www.suburbview.com/images/up.png' /></a></td>\n";
	options_html += "	</tr>\n";
	options_html += "</table>\n";
	options_html += "</form>\n";

	
	document.getElementById("show_options").innerHTML = options_html;
}


function create_category_option_row(id, image, category, row1, row2){
	var options_html = "";
	var category_name = category.charAt(0).toUpperCase()+category.substring(1,category.length);

	var style="";
	style = " style='font-size: 7pt;'";
	if (display_options_counter % 2) {
		options_html += "<tr class='alt_property' "+style+">";
	}else{
		options_html += "<tr "+style+">";
	}
	display_options_counter++;
	options_html += "		<td width='9'><img src='http://www.suburbview.com/mapsicons/"+image+"' height='15'/></td>\n";
	options_html += "		<td><input type='checkbox' name='cat' onClick='add_option(this,\"."+category+"\", \"buy\", \""+category+"\", "+row1+", \"category\")' value='"+row1+"' ";

	if(get_option("buy", category, "category") != "n"){
		options_html += "checked='checked'";
	}
	options_html += ">"+category_name+"</td>\n";
	options_html += "		<td><input type='checkbox' name='cat' onClick='add_option(this,\"."+category+"\",\"rent\", \""+category+"\", "+row2+", \"category\")' value='"+row2+"' ";
	if(get_option("rent", category, "category") != "n"){
		options_html += "checked='checked'";
	}
	options_html += ">"+category_name+"</td>\n";
	options_html += "	</tr>\n";

	return options_html;
}

function create_price_option_row(id, buy_text, rent_text, row1, row2){
	var options_html = "";
	if (display_options_counter % 2) {
		options_html += "<tr class='alt_property' style='font-size: 7pt;'>";
	}else{
		options_html += "<tr style='font-size: 7pt;'>";
	}
	display_options_counter++;
	options_html += "		<td><input type='checkbox' name='display_price' onClick='add_option(this,\".g"+id+"\",\"buy\", \""+id+"\", "+row1+", \"price\")' value='"+row1+"' ";
	if(get_option("buy", id, "price") != "n"){
		options_html += "checked='checked'";
	}
	options_html += ">"+buy_text+"</td>\n";
	options_html += "		<td><input type='checkbox' name='display_price' onClick='add_option(this,\".g"+id+"\",\"rent\", \""+id+"\", "+row2+", \"price\")' value='"+row2+"' ";
	if(get_option("rent", id, "price") != "n"){
		options_html += "checked='checked'";
	}
	options_html += ">"+rent_text+"</td>\n";
	options_html += "	</tr>\n";

	return options_html;
}

function create_room_option_row(id, text, row1, row2){
	var options_html = "";
	if (display_options_counter % 2) {
		options_html += "<tr class='alt_property' style='font-size: 7pt;'>";
	}else{
		options_html += "<tr style='font-size: 7pt;'>";
	}
	display_options_counter++;
	options_html += "		<td><input type='checkbox' name='display_room' onClick='add_option(this,\".p"+id+"\",\"buy\", \""+id+"\", "+row1+", \"room\")' value='"+row1+"' ";
	if(get_option("buy", id, "room") != "n"){
		options_html += "checked='checked'";
	}
	options_html += ">"+text+"</td>\n";
	options_html += "		<td><input type='checkbox' name='display_room' onClick='add_option(this,\".p"+id+"\",\"rent\", \""+id+"\", "+row2+", \"room\")' value='"+row2+"' ";
	if(get_option("rent", id, "room") != "n"){
		options_html += "checked='checked'";
	}
	options_html += ">"+text+"</td>\n";
	options_html += "	</tr>\n";

	return options_html;
}



function hide_options(){
	var options_html = "";
	options_html += "<table class='view_results'>\n";
	options_html += "	<tr class='search_title' onClick='javascript:show_options();'>\n";
	options_html += "		<td class='map_total_white' colspan='2' >Show Options</td>\n";
	options_html += "		<td class='map_total_white' align='center' width='40'><a href='javascript:show_options();'><img src='http://www.suburbview.com/images/down.png' /></a></td>\n";
	options_html += "	</tr>\n";
	options_html += "</table>\n";
	if(document.getElementById('show_options')){
		document.getElementById("show_options").innerHTML = options_html;
	}
}

function add_option(box, css, prop_type, name, id, type){
	var temp_display_type = display_type;
	display_type = prop_type;
	add_cookie(name, id, type);
	display_type = temp_display_type;
	
	hide_show_block_type(box,css);
	options_cookie(); // sync the list
	sync_list();
}

function get_option(prop_type, name, type){
	var temp_display_type = display_type;
	var found = "y";
	display_type = prop_type;
	found = read_cookie(name, type);
	display_type = temp_display_type;
	return found;
}

function changecss(myclass,element,value) {
	if(display_type == "buy"){
		myclass = myclass.replace(".", ".B");
	}else if (display_type == "rent"){
		myclass = myclass.replace(".", ".R");
	}else if (display_type == "share"){
		myclass = myclass.replace(".", ".S");
	}

	var CSSRules
	var stylesheets = document.styleSheets.length;
	if (document.all) {
		CSSRules = 'rules'
	}
	else if (document.getElementById) {
		CSSRules = 'cssRules'
	}
	for (var stylenum = 0; stylenum < stylesheets; stylenum++) {
		for (var iss = 0; iss < document.styleSheets[stylenum][CSSRules].length; iss++) {
			if (document.styleSheets[stylenum][CSSRules][iss].selectorText == myclass) {
				document.styleSheets[stylenum][CSSRules][iss].style[element] = value
			}
		}
	}
}

function hide_show_block_cookie(box,css){
	var element = "";
	var value = "";

	if (navigator.appName == "Netscape"){
		element = 'visibility';
		value = 'collapse';
		if(box == "true"){
			value = 'visible';
		}
	}else{
		var element = 'display';
		var value = 'none';
		if(box == "true"){
			value = 'block';
		}
	}
	changecss(css,element,value);
}

function hide_show_block_type(box,css){
	var element = "";
	var value = "";

	if (navigator.appName == "Netscape"){
		element = 'visibility';
		value = 'collapse';
		if(box.checked == true){
			value = 'visible';
		}
	}else{
		var element = 'display';
		var value = 'none';
		if(box.checked == true){
			value = 'block';
		}
	}
	changecss(css,element,value);
}

function hide_show_block(box){
	var element = "";
	var value = "";

	if (navigator.appName == "Netscape"){
		element = 'visibility';
		value = 'collapse';
		if(box.checked == true){
			value = 'visible';
		}
	}else{
		var element = 'display';
		var value = 'none';
		if(box.checked == true){
			value = 'block';
		}
	}
	
	
	var cattype = box.value;
	if(cattype.length > 4){
		cattype = cattype.substring(1);	// category
	}else{
		cattype = cattype.substring(2)		//room, price
	}

	var the_type="";
	if(box.name == "cat"){
		the_type="category";
	}else if(box.name == "display_price"){
		the_type="price";
	}else if(box.name == "display_room"){
		the_type="room";
	}
	add_new_cookie(cattype, box, the_type);	// add to cooke
	changecss(box.value,element,value);
	hide_options();							// hide options
}

// not used functions, but great example of code
function link_details(id){
// links table data to map
	var counter=0;
	if(document.getElementsByTagName){  
		var table = document.getElementById(id);  
		var rows = table.getElementsByTagName("td");  
		for(irl = 0; irl < rows.length; irl++){          
		//manipulate rows
			if(rows[irl].innerHTML == "-"){
				//rows[i].innerHTML = "<a href=\"javascript:showmyclick('"+counter+"')\">View</a>";
				rows[irl].innerHTML = "";
				rows[irl+1].innerHTML = "<a href=\"javascript:showmyclick('"+counter+"')\">"+rows[irl+1].innerHTML+"</a>";
				rows[irl+2].innerHTML = "<a href=\"javascript:showmyclick('"+counter+"')\">"+rows[irl+2].innerHTML+"</a>";
				rows[irl+3].innerHTML = "<a href=\"javascript:showmyclick('"+counter+"')\">"+rows[irl+3].innerHTML+"</a>";
				counter++;
			}
			/*
			if(i % 2 == 0){
				rows[i].className = "even";
				rows[i].innerHTML = "<a href='javascript:showmyclick()'>"+rows[i].innerHTML+"</a>";
			}else{
				rows[i].className = "odd";
			} 
			*/
		}
	}
}


function options_cookie(){
	// update the display options
	// category
	if(document.map_form_new){
		for(ic = 0; ic < document.map_form_new.cat.length; ic++){
			var cattype = document.map_form_new.cat[ic].value;
			if(get_option(display_type, cattype.substring(1), "category") == "n"){
				document.map_form_new.cat[ic].checked=false;
				hide_show_block(document.map_form_new.cat[ic]);
			}else{
				document.map_form_new.cat[ic].checked=true;
			}
		}
	}
	
	// price
	if(document.map_price_form_new){
		for(ip = 0; ip < document.map_price_form_new.display_price.length; ip++){
			var cattype = document.map_price_form_new.display_price[ip].value;
			if(get_option(display_type, cattype.substring(2), "price") == "n"){
				document.map_price_form_new.display_price[ip].checked=false;
				hide_show_block(document.map_price_form_new.display_price[ip]);
			}else{
				document.map_price_form_new.display_price[ip].checked=true;
			}
		}
	}
	
	// rooms
	if(document.map_room_form_new){
		for(ir = 0; ir < document.map_room_form_new.display_room.length; ir++){
			var cattype = document.map_room_form_new.display_room[ir].value;
			if(get_option(display_type, cattype.substring(2), "room") == "n"){
				document.map_room_form_new.display_room[ir].checked=false;
				hide_show_block(document.map_room_form_new.display_room[ir]);
			}else{
				document.map_room_form_new.display_room[ir].checked=true;
			}
		}
	}
}

function sync_list(){
	var cats_array    = new Array("house","apartment","unit","townhouse","land","villa","unit-apmt","acreage-semi-rural","duplex-semi-detached", "rural","unknown");
	var prices_array  = new Array("A","B","C","D","E","F","G","H","I","J","K","L");
	var rooms_array  = new Array("0","1","2","3","4","5","6","7","8","9","10");

	// now hide them
	// category
	for(ic = 0; ic < cats_array.length; ic++){
		var cattype = cats_array[ic];
		if(get_option(display_type, cattype, "category") == "n"){
			hide_show_block_cookie('false',"."+cattype);

		}
	}
	
	// price
	for(ip = 0; ip < prices_array.length; ip++){
		var pricestype = prices_array[ip];
		if(get_option(display_type, pricestype, "price") == "n"){
			hide_show_block_cookie('false',".g"+ pricestype);
		}
	}

	// room
	for(ir = 0; ir < rooms_array.length; ir++){
		var roomstype = rooms_array[ir];
		if(get_option(display_type, roomstype, "room") == "n"){
			hide_show_block_cookie('false',".p"+ roomstype);
		}
	}

	return true;
}

function showhide_propdetails(type){
	if(type == 'show'){
		document.getElementById('detailscontainer').style.width = "350px";
		document.getElementById('prop_details').style.width = "330px";
		document.getElementById("showhide").innerHTML = "<a href=\"javascript:showhide_propdetails('hide')\" title='Hide Property Details'><img src='/images/hide_details.gif' alt='Hide Property Listings' /></a>";

	}else if(type == 'hide'){
		document.getElementById('detailscontainer').style.width = "19px";
		document.getElementById('prop_details').style.width = "0px";
		document.getElementById("showhide").innerHTML = "<a href=\"javascript:showhide_propdetails('show')\" title='Show Property Details'><img src='/images/show_details.gif' alt='Show Property Listings' /></a>";

	}
	
	var detailscontainer_size = document.getElementById('detailscontainer').offsetWidth; 
	var propoptions_size = document.getElementById('optionscontainer').offsetWidth; 
	var the_size = detailscontainer_size + propoptions_size;

	document.getElementById('mapcontainer').style.marginRight = "-"+the_size+"px";
	document.getElementById('mapcontent').style.marginRight = the_size+"px";
	document.getElementById('main').style.marginRight = "-"+the_size+"px";
	document.getElementById('sidebar').style.width = the_size+"px";
	map.checkResize();
}

function showhide_propoptions(type){
	if(type == 'show'){
		document.getElementById('optionscontainer').style.width = "220px";
		document.getElementById('prop_options_details').style.width = "200px";
		document.getElementById("showhideoptions").innerHTML = "<a href=\"javascript:showhide_propoptions('hide')\" title='Hide Property Options'><img src='/images/hide_options.gif' alt='Hide Property Listings' /></a>";

	}else if(type == 'hide'){
		document.getElementById('optionscontainer').style.width = "19px";
		document.getElementById('prop_options_details').style.width = "0px";
		document.getElementById("showhideoptions").innerHTML = "<a href=\"javascript:showhide_propoptions('show')\" title='Show Property Options'><img src='/images/show_options.gif' alt='Show Property Listings' /></a>";
	}
	
	var detailscontainer_size = document.getElementById('detailscontainer').offsetWidth; 
	var propoptions_size = document.getElementById('optionscontainer').offsetWidth; 
	var the_size = detailscontainer_size + propoptions_size;

	document.getElementById('mapcontainer').style.marginRight = "-"+the_size+"px";
	document.getElementById('mapcontent').style.marginRight = the_size+"px";
	document.getElementById('main').style.marginRight = "-"+the_size+"px";
	document.getElementById('sidebar').style.width = the_size+"px";
	map.checkResize();
}

/* gearth display options */
function changecolor(td,thecolor,type){
	
	if(type == "buy"){
		alternate('tbl');
	
		document.getElementById('selecttextcolour').style.border='1px solid #fff';
		document.getElementById('selecticoncolour').style.border='1px solid #fff';
		if(document.gearth.colourgroup[0].checked){
			document.gearth.selecttextcolour.value=thecolor;    
			document.gearth['selecttextcolour'].style.backgroundColor=thecolor;
			document.getElementById('selecttextcolour').style.border='1px solid #333';
		}else{
			document.gearth.selecticoncolour.value=thecolor;
			document.gearth['selecticoncolour'].style.backgroundColor=thecolor;
			document.getElementById('selecticoncolour').style.border='1px solid #333';
		}
	}else if(type == "rent"){
		alternate('tblrent');

		document.getElementById('selecttextcolourrent').style.border='1px solid #fff';
		document.getElementById('selecticoncolourrent').style.border='1px solid #fff';
		if(document.gearthrent.colourgrouprent[0].checked){
			document.gearthrent.selecttextcolourrent.value=thecolor;    
			document.gearthrent['selecttextcolourrent'].style.backgroundColor=thecolor;
			document.getElementById('selecttextcolourrent').style.border='1px solid #333';
		}else{
			document.gearthrent.selecticoncolourrent.value=thecolor;
			document.gearthrent['selecticoncolourrent'].style.backgroundColor=thecolor;
			document.getElementById('selecticoncolourrent').style.border='1px solid #333';
		}
		
	}
	
	td.style.border='1px solid #20E636';

}
function alternate(id){
	if(document.getElementsByTagName){  
		var table = document.getElementById(id);  
		var cells = table.getElementsByTagName("td");  
		for(i = 0; i < cells.length; i++){          
			cells[i].style.border='1px solid white';     
		}
	}
}

function setfocusbox(box,type){

	document.getElementById("colourtable").innerHTML = show_colour_table('tbl', 'buy');
	document.getElementById("colourtablerent").innerHTML = show_colour_table('tblrent', 'rent');

	if(type == "buy"){
		document.getElementById('selecttextcolour').style.border='1px solid #fff';
		document.getElementById('selecticoncolour').style.border='1px solid #fff';
		if(box =='text'){
			document.gearth.colourgroup[0].checked=true;
			document.gearth['selecttextcolour'].style.backgroundColor=document.gearth.selecttextcolour.value;
			document.getElementById('selecttextcolour').style.border='1px solid #333';
		}else{
			document.gearth.colourgroup[1].checked=true;
			document.gearth['selecticoncolour'].style.backgroundColor=document.gearth.selecticoncolour.value;
			document.getElementById('selecticoncolour').style.border='1px solid #333';
		}
	}else if(type == "rent"){
		document.getElementById('selecttextcolourrent').style.border='1px solid #fff';
		document.getElementById('selecticoncolourrent').style.border='1px solid #fff';
		if(box =='text'){
			document.gearthrent.colourgrouprent[0].checked=true;
			document.gearthrent['selecttextcolourrent'].style.backgroundColor=document.gearthrent.selecttextcolourrent.value;
			document.getElementById('selecttextcolourrent').style.border='1px solid #333';
		}else{
			document.gearthrent.colourgrouprent[1].checked=true;
			document.gearthrent['selecticoncolourrent'].style.backgroundColor=document.gearthrent.selecticoncolourrent.value;
			document.getElementById('selecticoncolourrent').style.border='1px solid #333';
		}
	}

}

function change_rentbuy(type){
	var buy_html = '<ul id="buyskyline">';
	buy_html += '<li id="buy1b">Buy</li>';
	buy_html += '<li id="buy2b" onclick="change_rentbuy(\'rent\')" title="View Property to Rent">Rent</li>';
	buy_html += '<li id="buy3b" onclick="change_rentbuy(\'share\')" title="View Property to Share">Share</li>';
	buy_html += '</ul>';
	
	var rent_html = '<ul id="rentskyline">';
	rent_html += '<li id="rent1b" onclick="change_rentbuy(\'buy\')" title="View Property to Buy">Buy</li>';
	rent_html += '<li id="rent2b">Rent</li>';
	rent_html += '<li id="rent3b" onclick="change_rentbuy(\'share\')" title="View Property to Share">Share</li>';
	rent_html += '</ul>';

	var share_html = '<ul id="shareskyline">';
	share_html += '<li id="share1b" onclick="change_rentbuy(\'buy\')" title="View Property to Buy">Buy</li>';
	share_html += '<li id="share2b" onclick="change_rentbuy(\'rent\')" title="View Property to Rent">Rent</li>';
	share_html += '<li id="share3b">Share</li>';
	share_html += '</ul>';

/*
	var get_type = "buy";
	if(document.display_options.type[1].checked){
		// rent
		get_type = "rent";
		document.getElementById('mapbartext').style.background='#FFFFFF url(/images/rent-bar.gif) repeat-x';
	}else if(document.display_options.type[2].checked){
		// share
		get_type = "share";
		document.getElementById('mapbartext').style.background='#FFFFFF url(/images/share-bar.gif) repeat-x';
	}else{
		document.getElementById('mapbartext').style.background='#FFFFFF url(/images/buy-bar.gif) repeat-x';
	}
*/
	if(type == "buy"){
		$('#map_nav').html(buy_html);
	}else if(type == "rent"){
		$('#map_nav').html(rent_html);
	}else if(type == "share"){
		$('#map_nav').html(share_html);
	}
	
	get_type = type;
	load_property_map(document.display_options.suburbname.value , document.display_options.suburbpostcode.value , get_type);
	if(type != "share"){
		get_xml_pop_street(document.display_options.suburbname.value, document.display_options.suburbpostcode.value);
	}else{
		document.getElementById("pop_content").innerHTML="";
	}
}
function rentbuy(){
	var get_type = "buy";
	if(document.display_options.type[1].checked){
		get_type = "rent";
	}else if(document.display_options.type[2].checked){
		get_type = "share";
	}
	return get_type;
}

function show_colour_table(table_id, type){
	var html = "";
	html += "<table id='"+table_id+"'>";
	html += "<tr>";
	html += "<td bgcolor='#000000' onclick=\"changecolor(this,'#000000','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AA0000' onclick=\"changecolor(this,'#AA0000','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#005500' onclick=\"changecolor(this,'#005500','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AA5500' onclick=\"changecolor(this,'#AA5500','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#00AA00' onclick=\"changecolor(this,'#00AA00','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AAAA00' onclick=\"changecolor(this,'#AAAA00','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#00FF00' onclick=\"changecolor(this,'#00FF00','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AAFF00' onclick=\"changecolor(this,'#AAFF00','"+type+"');\"> &nbsp;</td>";
	html += "</tr>";
	html += "<tr>";
	html += "<td bgcolor='#00007F' onclick=\"changecolor(this,'#00007F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AA007F' onclick=\"changecolor(this,'#AA007F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#00557F' onclick=\"changecolor(this,'#00557F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AA557F' onclick=\"changecolor(this,'#AA557F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#00AA7F' onclick=\"changecolor(this,'#00AA7F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AAAA7F' onclick=\"changecolor(this,'#AAAA7F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#00FF7F' onclick=\"changecolor(this,'#00FF7F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AAFF7F' onclick=\"changecolor(this,'#AAFF7F','"+type+"');\"> &nbsp;</td>";
	html += "</tr>";
	html += "<tr>";
	html += "<td bgcolor='#0000FF' onclick=\"changecolor(this,'#0000FF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AA00FF' onclick=\"changecolor(this,'#AA00FF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#0055FF' onclick=\"changecolor(this,'#0055FF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AA55FF' onclick=\"changecolor(this,'#AA55FF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#00AAFF' onclick=\"changecolor(this,'#00AAFF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AAAAFF' onclick=\"changecolor(this,'#AAAAFF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#00FFFF' onclick=\"changecolor(this,'#00FFFF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#AAFFFF' onclick=\"changecolor(this,'#AAFFFF','"+type+"');\"> &nbsp;</td>";
	html += "</tr>";
	html += "<tr>";
	html += "<td bgcolor='#550000' onclick=\"changecolor(this,'#550000','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FF0000' onclick=\"changecolor(this,'#FF0000','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#555500' onclick=\"changecolor(this,'#555500','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FF5500' onclick=\"changecolor(this,'#FF5500','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#55AA00' onclick=\"changecolor(this,'#55AA00','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FFAA00' onclick=\"changecolor(this,'#FFAA00','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#55FF00' onclick=\"changecolor(this,'#55FF00','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FFFF00' onclick=\"changecolor(this,'#FFFF00','"+type+"');\"> &nbsp;</td>";
	html += "</tr>";
	html += "<tr>";
	html += "<td bgcolor='#55007F' onclick=\"changecolor(this,'#55007F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FF007F' onclick=\"changecolor(this,'#FF007F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#55557F' onclick=\"changecolor(this,'#55557F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FF557F' onclick=\"changecolor(this,'#FF557F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#55AA7F' onclick=\"changecolor(this,'#55AA7F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FFAA7F' onclick=\"changecolor(this,'#FFAA7F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#55FF7F' onclick=\"changecolor(this,'#55FF7F','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FFFF7F' onclick=\"changecolor(this,'#FFFF7F','"+type+"');\"> &nbsp;</td>";
	html += "</tr>";
	html += "<tr>";
	html += "<td bgcolor='#5500FF' onclick=\"changecolor(this,'#5500FF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FF00FF' onclick=\"changecolor(this,'#FF00FF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#5555FF' onclick=\"changecolor(this,'#5555FF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FF55FF' onclick=\"changecolor(this,'#FF55FF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#55AAFF' onclick=\"changecolor(this,'#55AAFF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FFAAFF' onclick=\"changecolor(this,'#FFAAFF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#55FFFF' onclick=\"changecolor(this,'#55FFFF','"+type+"');\"> &nbsp;</td>";
	html += "<td bgcolor='#FFFFFF' onclick=\"changecolor(this,'#FFFFFF','"+type+"');\"> &nbsp;</td>";
	html += "</tr>";
	html += "</table>";
	
	return html;
}