function toggleLayer( whichLayer )
{
  var elem, vis;
  if( document.getElementById ) // this is the way the standards work
    	elem = document.getElementById( whichLayer );
  else if( document.all ) // this is the way old msie versions work
      	elem = document.all[whichLayer];
  else if( document.layers ) // this is the way nn4 works
    	elem = document.layers[whichLayer];
		
  vis = elem.style;
  // if the style.display value is blank we try to figure it out here
  if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined)
    vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';
  	vis.display = (vis.display==''||vis.display=='block')?'none':'block';
}

function toggleSkirt( whichLayer )   /*   takes a skirt_<%skirtTypeID%>_<%skirt_IntCounter%>  */
{
  var whichLayer2,whichLayer2_num;
  var whichLayer3;	
  whichLayer2_num = whichLayer.split("_");
  whichLayer2 	= "skirt_Container";
   whichLayer3 	= "skirt_x";
  
  for(i = 1; i < whichLayer2_num.length-1; i++)
  {
	whichLayer2=whichLayer2 + '_' + whichLayer2_num[i]; 
	whichLayer3=whichLayer3 + '_' + whichLayer2_num[i]; 
  }
  
  var whichLayer4 	= whichLayer3 + '_close';
  whichLayer3	 	= whichLayer3 + '_minimize';
  //document.write(whichLayer3);
  var elem, vis;
  var elem2, vis2;
  var elem3, vis3;
  var elem4, vis4;
  
  if( document.getElementById ) {  // this is the way the standards work
    elem	= 	document.getElementById( whichLayer );
	elem2	= 	document.getElementById( whichLayer2 );
	elem3 	= 	document.getElementById( whichLayer3 );
	elem4 	= 	document.getElementById( whichLayer4 );
  }
  else if( document.all ) { // this is the way old msie versions work
      elem 	= document.all[whichLayer];
	  elem2 = document.all[whichLayer2];
	  elem3 = document.all[whichLayer3];
	  elem4 = document.all[whichLayer4];
  }
  else if( document.layers ) { // this is the way nn4 works
    elem 	= document.layers[whichLayer];
	elem2 	= document.all[whichLayer2];
	elem3 	= document.all[whichLayer3];
	elem4 	= document.all[whichLayer4];
  }
  vis 	= elem.style;				//SKIRT CONTAINER
  vis2 	= elem2.style;			//TEXT OF CONTAINER
  vis3 	= elem3.style;			//MINIMUSE BUTTON
  vis4 	= elem4.style;			//CLOSE BUTTON 
  
  // if the style.display value is blank we try to figure it out here
  if(vis.display==''&&elem.offsetWidth!=undefined&&elem.offsetHeight!=undefined) 
    vis.display = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'block':'none';				//skirt container
	vis2.backgroundColor = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'#000000':'#1E90FF';		//optional extras
	vis2.backgroundImage = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'url(/images/optionalExtras.png)':'url(/images/optionalExtras2.png)';//optional extras
	vis3.backgroundColor = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'#FFCC66':'#0000FF';		//minimize button
	vis4.backgroundColor = (elem.offsetWidth!=0&&elem.offsetHeight!=0)?'#FFCC66':'#0000FF';		//close button
	
  	vis.display = (vis.display==''||vis.display=='block')?'none':'block';				//skirt container
	vis2.backgroundColor = (vis.display==''||vis.display=='block')?'#1E90FF':'#000000';		//optional extras
	vis2.backgroundImage = (vis.display==''||vis.display=='block')?'url(/images/optionalExtras2.png)':'url(/images/optionalExtras.png)';//optional extras
	vis3.backgroundColor = (vis.display==''||vis.display=='block')?'#0000FF':'#FFCC66';		//minimize button
	vis4.backgroundColor = (vis.display==''||vis.display=='block')?'#0000FF':'#FFCC66';		//close button
	
}
 
function highlightImg(img, width,height,marginLeft,marginBottom) {
	document.getElementById(img).style.width=width + 'px';
	document.getElementById(img).style.height=height + 'px';
	document.getElementById(img).style.marginLeft=marginLeft + 'px';
	document.getElementById(img).style.marginBottom=marginBottom + 'px';
}

function roundNumber(num, dec) {
	var result = Math.round(num*Math.pow(10,dec))/Math.pow(10,dec);
	return result;
}


function changeColour(prodID, option, bool_wood, bool_tray) 
{
	var wood, tray;
	wood = 250;
	tray = 100;
	
//	alert("option" + option + "wood:" + bool_wood +  "| tray:" + bool_tray)
	
	if ((bool_wood == 'Yes') && (bool_tray == 'Yes'))
	{
	//	alert("here!")
		document.getElementById('imageHolder').src = document.getElementById('both_' + prodID + "_" + option).value;
	//	alert(document.getElementById('both_' + prodID + "_" + option).value);
		document.getElementById('price').innerHTML = roundNumber(parseFloat(document.getElementById('old_price').value) + wood + tray,2);
	}
	else if ((bool_wood == 'Yes') && (bool_tray == 'No'))
	{
		document.getElementById('imageHolder').src = document.getElementById('wood_' + prodID + "_" + option).value;
		document.getElementById('price').innerHTML = roundNumber(parseFloat(document.getElementById('old_price').value) + wood,2);
	}
	
	else if ((bool_wood == 'No') && (bool_tray == 'Yes'))
	{
		document.getElementById('imageHolder').src = document.getElementById('tray_' + prodID + "_" + option).value;
		document.getElementById('price').innerHTML = roundNumber(parseFloat(document.getElementById('old_price').value) + tray,2);
	}
	
	else
	{
		document.getElementById('imageHolder').src = document.getElementById('colour_' + prodID + "_" + option).value;
		document.getElementById('price').innerHTML = roundNumber(parseFloat(document.getElementById('old_price').value),2);
	}

	if (document.getElementById('skirt1'))
	{
		document.getElementById('skirt1').value = document.getElementById('labels_' + prodID + "_" + option).value;
	}
	
	if (document.getElementById('skirt2'))	//wood
	{
		if (bool_wood == 'Yes') 
		{
			document.getElementById('skirt2').value = '314';
		}
		else
		{
			document.getElementById('skirt2').value = '313';
		}
	}
	
	if (document.getElementById('skirt3'))	//tray
	{
		if (bool_tray == 'Yes') 
		{
			document.getElementById('skirt3').value = '312';
		}
		else
		{
			document.getElementById('skirt3').value = '311';
		}
		
	}
	
}


function flip(holder, image)
{
	if (document.getElementById(holder).className == 'colorspa_image')
	{
		document.getElementById(holder).className='colorspa_image_normal';	
	}
	else
	{
		document.getElementById(holder).className='colorspa_image';
	}
	
	if (document.getElementById('skirt4')) 
	{
		if (document.getElementById('skirt4').value == '315')	
		{
			document.getElementById('skirt4').value = 316
		}
		else
		{
			document.getElementById('skirt4').value = 315
		}
	}
}
