var colores = new Array( 1, 1, "picture.gif|Igual a la imagen", "white|Blanco", "#adcae2|Azul", "pink|Rosado", "beige|Beige", "#bd94e8|Violeta" );
	var sabores = new Array( 1, 2, "Chocolate|Chocolate", "Vainilla|Vainilla" );
	//var sabores = new Array( 1, 2, "Chocolate|Chocolate","Vanilla|Vainilla","Strawberry|Fresa","Cappuccino|Capuchino");
	var relleno = new Array( 1, "Vainilla|Vainilla", "Chocolate|Chocolate", "Coco|Coco", "Choco-Coco|Choco-Coco" );
	//var relleno = Chocolate|Chocolate","Choco-Chip|Choco-Chip","Vanilla|Vainilla","Vanilla-Chip|Vainilla-Chip","Coconut|Coco","Peanuts and Raisin|Mani y pasas","Strawberry with little fresh Strawberries|Fresa con fresitas naturales");
	var clrs = new Array();
	var flrs = new Array();
	var currentFlavor = null;
    var cakeProperties = new Array();
	cakeProperties["PrimaryColor"] = "";
	cakeProperties["SecundaryColor"] = "";
	cakeProperties["Flavor"] = "";
	cakeProperties["Fill"] = "";
	
	function createColors(id, start){
		for(c=2;c<colores.length;c++){
			if(colores[c].split("|")[0].indexOf('.gif')==-1){
				document.write('<a title="'+colores[c].split("|")[1]+'" href="javascript:ColorClick('+(c-2+start)+')" style="background-color:'+colores[c].split("|")[0]+'" id="'+id+'" tinte="'+colores[c].split("|")[1]+'">&nbsp;</a>');
			}else{
				document.write('<a title="'+colores[c].split("|")[1]+'" href="javascript:ColorClick('+(c-2+start)+')" style="background-position:center center; background-image:url(imagess/'+colores[c].split("|")[0]+')" id="'+id+'" tinte="'+colores[c].split("|")[1]+'">&nbsp;</a>');
			}
		}
	}

	function createFlavors(id){
		for(c=2;c<sabores.length;c++){
			document.write('<div style="'+(((c+1)%2)?'':'margin-left:105px; margin-top:-22px')+'"><input '+((c-1==sabores[0])?'checked':'')+' type="checkbox" name="chkFlavor" id="chkFlavor" onClick="FlavorClick('+(c-2)+')" value="'+sabores[c].split("|")[1]+'"/>'+sabores[c].split("|")[0]+'</div>');
		}
	}

	function createFill(id){
		for(c=1;c<relleno.length;c++){
			document.write('<div style="'+(((c)%2)?'':'margin-left:105px; margin-top:-22px')+'"><input '+((c==relleno[0])?'checked':'')+' type="radio" name="radFill" id="radFill" onClick="FillClick(this)" value="'+relleno[c].split("|")[1]+'"/>'+relleno[c].split("|")[0]+'</div>');
		}
	}

	function AddEventToTableCells(){
		clrs = getReference("tblColor").getElementsByTagName("A");
		for(clr=0;clr<clrs.length;clr++){
			clrs[clr].style.borderColor=((clrs[clr].id=="PrimaryColor"&&clr+1==colores[0])||(clrs[clr].id=="SecundaryColor"&&clr-(clrs.length/2)+1==colores[1]))?'#000000':'#cccccc';
			if((clrs[clr].id=="PrimaryColor"&&clr+1==colores[0])||(clrs[clr].id=="SecundaryColor"&&clr-(clrs.length/2)+1==colores[1]))cakeProperties[clrs[clr].id] = clrs[clr].getAttribute("tinte");
		}
		div_flrs = getReference("tblColor").getElementsByTagName("DIV");
		for(flr=0;flr<div_flrs.length;flr++){
			if(div_flrs[flr].getElementsByTagName("INPUT")[0].type=="checkbox"){
				flrs[flr]=div_flrs[flr].getElementsByTagName("INPUT")[0];
				if(flrs[flr].checked){
					currentFlavor=flrs[flr];
					cakeProperties["Flavor"]+=((cakeProperties["Flavor"].length!=0)?" y ":"")+flrs[flr].value;
				}
			}
		}
		cakeProperties["Fill"] = relleno[relleno[0]].split("|")[1];
		writeProperties();
	}

	function FillClick(opt){
		cakeProperties["Fill"]=opt.value;
		writeProperties()
	}	
	
	function FlavorClick(index){
		var two = 0;
        flrs[index].checked=true;
		for(flr=0;flr<flrs.length;flr++){
			if(flrs[flr].checked)two++;
			if(two>1&&currentFlavor!=null){
           		currentFlavor.checked=false;
				currentFlavor=null;
			}
		}
        
		cakeProperties["Flavor"]="";
		for(flr=0;flr<flrs.length;flr++){
			if(flrs[flr].checked)cakeProperties["Flavor"]+=((cakeProperties["Flavor"].length!=0)?" y ":"")+flrs[flr].value;
		}
		currentFlavor = flrs[index];
		writeProperties()
	}
	
	function ColorClick(index){
		for(clr=0;clr<clrs.length;clr++){
			if(clrs[clr].id == clrs[index].id){
				clrs[clr].style.borderColor=(clrs[clr]==clrs[index])?'black':'#cccccc';
				if(clrs[clr]==clrs[index])cakeProperties[clrs[index].id]=clrs[index].getAttribute("tinte");
			}
		}
		writeProperties()
	}
	
	
	function writeProperties(){
		getReference("txtCakeProperties").value = "<b>Color del cake:</b> " + cakeProperties["PrimaryColor"] + "<br/>" +
															 //"Color del merengue: " + cakeProperties["SecundaryColor"] + "<br/>" +
															 "<b>Sabor:</b> " + cakeProperties["Flavor"] + "<br/>" +
															 "<b>Relleno:</b> " + cakeProperties["Fill"] + "<br/>" +
															 "<b>Dedicatoria:</b> " + getReference("txtText").value;
		//alert(getReference("txtCakeProperties").value);															 
	}

	function getReference(elem) {
		if( document.layers ) { //Netscape layers
			return document.layers[elem]; }
		if( document.getElementById ) { //DOM; IE5, NS6, Mozilla, Opera
			return document.getElementById(elem); }
		if( document.all ) { //Proprietary DOM; IE4
			return document.all[elem]; }
		if( document[elem] ) { //Netscape alternative
			return document[elem]; }
		return false;
	}

document.write('<style>\n'+
	'#tblColor {margin:10px 2px 10px 2px; border-top:1px solid #cccccc; border-bottom:0px solid #cccccc; font-family:tahoma; font-size:11px}\n'+	
	'#tblColor A{padding:1px 6px 1px 6px; margin:2px; line-height:16px; text-decoration:none; border:2px solid #cccccc}\n'+
	'#tblColor TD{white-space:nowrap}\n'+
	'#tblColor DIV{white-space:nowrap; display:block; font-size:11px; width:100px; margin-bottom:2px}\n'+
	'#tblColor INPUT{vertical-align:middle}\n'+
	'</style>');
document.write('<table border="0" cellspacing="2" cellpadding="3" id="tblColor">\n'+
  '<tr>\n'+
    '<td align="right" nowrap="nowrap">Color del cake: </td>\n'+
    '<td width="100%" nowrap="nowrap"><script language="javascript" type="text/javascript">createColors("PrimaryColor", 0)</script></td>\n'+
  '</tr>\n'+
  '<tr>\n'+
    '<td align="right" valign="top" nowrap="nowrap" style="padding-top:6px; border-top:1px dotted #cccccc">Escoja el sabor<br/>para la panetela:</td>\n'+
    '<td style="border-top:1px dotted #cccccc"><script language="javascript" type="text/javascript">createFlavors()</script></td>\n'+
  '</tr>\n'+
  '<tr>\n'+
    '<td align="right" valign="top" nowrap="nowrap" style="padding-top:6px; border-top:1px dotted #cccccc">Escoja un sabor<br/>para el relleno:</td>\n'+
    '<td style="border-top:1px dotted #cccccc"><script language="javascript" type="text/javascript">createFill()</script></td>\n'+
  '</tr>\n'+
  '<tr>\n'+
    '<td align="right" nowrap="nowrap" style="border-top:1px dotted #cccccc">Dedicatoria:</td>\n'+
    '<td style="border-top:1px dotted #cccccc"><input name="txtText" type="text" id="txtText" size="25" maxlength="40" onchange="writeProperties()" /></td>\n'+
  '</tr>\n'+
'</table>\n'+
'<input name="txtCakeProperties" type="hidden" id="txtCakeProperties"/>');
AddEventToTableCells();