function setUp(product)
{
	top.setButton(product+1);
	parent.document.title=self.document.title;
	self.defaultStatus=self.document.title;
	if (top.aProduct[top.currentProduct].designSelected)
	{
		var imageColumnID=document.getElementById("imageColumn");
		imageColumnID.innerHTML=displayImageColumn();
	}
}

function capitalise(string)
{
	return (string.replace(/\b[a-z]/g,function(str,n) { return str.toUpperCase();}));
}

function cycleImage()
// enables switching between alernative images of the same product. 
// i.e. vases with or without flowers, lamps with or without shades and normal, edge views and size comparisons of clocks.
{
	++top.currentImage;
	if (top.currentImage>top.maxImages) top.currentImage=1;
	changeImage(self);
}

function setProduct(thisProduct)
{
	top.currentProduct=thisProduct;
	if (top.aProduct[top.currentProduct].selected)
	{
		top.currentDesign=top.aProduct[top.currentProduct].dsgnElem;
		top.currentWood=top.aProduct[top.currentProduct].wood;
	}
	top.currentImage=1;
	if (top.currentProduct<=top.nFaceClock) top.maxImages=3;
	else top.maxImages=2;
	self.defaultStatus="Original designs of "+top.aProduct[top.currentProduct].fullName+"s";
}

function productTitle()
{
	var designName=top.aDesign[top.currentDesign].name;
	if (top.currentProduct<=top.nFaceClock) designName="<I>"+designName+"<\/I>";
	designName+=" design";

	var docWrite=top.proper(top.aProduct[top.currentProduct].fullName)+" shown is "+designName;
	docWrite+=" "+top.aProduct[top.currentProduct].description;
	docWrite+=" &ndash; in "+ top.wood[top.currentWood].name+" inlays";
	if (top.currentProduct>top.nFaceClock)
	docWrite+="<BR>"+top.aProduct[top.currentProduct].sizeText+": "+top.aDesign[top.currentDesign].size;

	docWrite+="<BR>Price: &pound;"+top.formatCost(top.aDesign[top.currentDesign].price)+" (including p&amp;p)";
	return docWrite;
}

function selectDesign(thisElem,thisIcon)
{
	top.aProduct[top.currentProduct].designSelected=true;
	if (thisElem != top.aProduct[top.currentProduct].dsgnElem)
	{
		thisIcon.className="inset";
		
		if (top.aProduct[top.currentProduct].selected) // a previous icon selected - show as unselected.
		{
			var oldIcon = iconsFrame.document.getElementById("icon"+top.currentDesign);
			oldIcon.className="unselected"
		}
		
		// If the selected design is available in the currently selected 'product wood' - display it in
		// that wood - otherwise display it in the first wood available for the selected design.
		if (top.aDesign[thisElem].wood.indexOf(top.aProduct[top.currentProduct].wood)>-1) top.currentWood=top.aProduct[top.currentProduct].wood;
		else
		{
			top.currentWood=top.aDesign[thisElem].wood.charAt(0);
			top.aProduct[top.currentProduct].wood=top.currentWood;
		}
		top.currentImage=1;
		top.aProduct[top.currentProduct].dsgnElem=thisElem;
		top.currentDesign=thisElem;
		
		if (top.aProduct[top.currentProduct].selected) changeImage(self);
		else
		{
			top.aProduct[top.currentProduct].selected=true;
			var imageColumnID=document.getElementById("imageColumn");
			imageColumnID.innerHTML=displayImageColumn();
		}
		titleFrame.location.reload();
	}
}

function mouseOver(thisElem,thisIcon)
{
	if (thisElem==top.currentDesign) thisIcon.className="inset";
	else thisIcon.className="raised";
}

function mouseOut(thisElem,thisIcon)
{
	if (thisElem==top.currentDesign) thisIcon.className="inset";
	else thisIcon.className="unselected";
}

function getImageName()
{
	var imageFile="images/";
	if (top.currentImage==2)
	{
		if (top.currentProduct<=top.nFaceClock) imageFile+="clock"+(top.currentProduct+1)+"_edge_view";
		else imageFile+=top.aDesign[top.currentDesign].code+"_"+top.wood[top.currentWood].code+"_bare";
	}
	else imageFile+=top.aDesign[top.currentDesign].code+"_"+top.wood[top.currentWood].code;
	if (top.currentProduct<=top.nFaceClock) imageFile+=".gif";
	else imageFile+=".jpg";
	return imageFile;
}

function getImageText() // text displayed underneath image
{
	var imageText="Click on image ";
	if (top.currentProduct==top.nVase)
	{
		if (top.currentImage==1) imageText+="to view vase without flowers";
		else imageText+="to view vase with flowers";
	}
	else if (top.currentProduct==top.nLamp)
	{
		if (top.currentImage==1) imageText+="to view lamp without shade";
		else imageText+="to view lamp with shade";
	}
	else
	{
		if (top.currentImage==1) imageText+="for edge and size views";
		else if (top.currentImage==2) imageText+="again for size comparison";
		else imageText+="to return to main view";
	}
	return imageText;
}

function getImageBackground()
{
	var imageBackground="url(background/"+top.defaultBackground+")";
	if (top.currentProduct<=top.nFaceClock)
	{
		if (top.currentImage>1) imageBackground="#F0FFF0";
		else if (top.imageBackground>"")
		{
			if (top.imageBackground.indexOf("#")>-1) imageBackground=top.imageBackground;
			else imageBackground="url(background/"+top.imageBackground+")";
		}
	}
	return imageBackground;
}

function changeImage(window)
{
	var imageDispName=window.document.getElementById("dispName");
	var imageBoxID=window.document.getElementById("imageBox");
	var textID=window.document.getElementById("imageText");
	imageBoxID.style.background=getImageBackground();
	imageDispName.innerHTML=getImageTitle();
	imageBoxID.innerHTML=displayImage();
	textID.innerHTML=getImageText();
}

function displayImageColumn()
{
	var imageBackground=getImageBackground();
	var docWrite=displayImageTitle();
	docWrite+="<DIV CLASS='displayBox' STYLE='text-align:center; background:"+imageBackground+"' ID='imageBox' onClick='cycleImage();'>";
	docWrite+=self.displayImage();
	docWrite+="<\/DIV><DIV ID='imageText' STYLE='font-weight:bold; text-align:center;'>"+self.getImageText()+"<\/DIV>";
	return docWrite;
}

function getImageTitle()
{
	return capitalise(top.aDesign[top.currentDesign].name+" "+top.aProduct[top.currentProduct].fullName);
}

function displayImageTitle()
{
	return "<DIV CLASS='boxHeader' STYLE='width:303px;' ID='dispName'>"+getImageTitle()+"<\/DIV>";
}

function setAlt()
{
	var altText="'";
	if (top.currentImage==3) altText+="Wall clock - size comparison";
	else if (top.currentImage==2 && top.currentProduct<=top.nFaceClock) altText+="Wall clock - edge view";
	else
	{
		altText+=top.proper(top.aProduct[top.currentProduct].fullName)+" - "+top.aDesign[top.currentDesign].name+" design";
		altText+=" in "+top.wood[top.currentWood].name+ " inlays";
	}
	return altText+="'";
}

function setStat()
{
	var statText="'";
	if (top.currentImage==3) statText+="Wall clock - size comparison";
	else if (top.currentImage==2 && top.currentProduct<=top.nFaceClock) statText+="Wall clock - edge view";
	else
	{
		statText+=top.proper(top.aProduct[top.currentProduct].fullName)+" - "+top.aDesign[top.currentDesign].name;
		statText+=" in "+top.wood[top.currentWood].name+ " inlays";
	}
	return statText+="'";
}

function displayImage()
{
	var altText=setAlt();
	var statText=setStat();
	if (top.currentImage==3)
	{
		var docWrite="<TABLE CLASS='sizeImages' CELLSPACING='0' CELLPADDING='0'><TR><TD STYLE='text-align:left;' TITLE="+altText+">";
		docWrite+="<IMG SRC="+self.getImageName();
		docWrite+=" WIDTH='190' HEIGHT='190' ALT="+altText;
		docWrite+=" onMouseOver=\"status="+statText+"; return true;\"><\/TD>";
		docWrite+="<TD STYLE='vertical-align:top;'>"
		docWrite+=top.aProduct[top.currentProduct].sizeText+" "+top.aDesign[top.currentDesign].size
		docWrite+="<\/TD><\/TR><\/TABLE>"; // separate tables required as cells in each row are different widths.
		docWrite+="<TABLE CLASS='sizeImages' CELLSPACING='0' CELLPADDING='0'><TR><TD>";
		docWrite+="<BR><BR>Size compared with a standard dinner plate<BR>26 cm (10 inches) across<\/TD>";
		docWrite+="<TD ALIGN='RIGHT'><IMG SRC='images\/dinner_plate.gif' WIDTH='120' HEIGHT='120' ";
		docWrite+="ALT='Standard dinner plate' TITLE='Standard dinner plate'><\TD><\/TR><\/TABLE>";
	}
	else
	{
		var docWrite="<IMG STYLE='cursor:hand;' SRC="+self.getImageName();
		var imageWidth;
		if (top.currentProduct==top.nLamp && top.currentImage==2) imageWidth=120;
		else if (top.currentProduct==top.nVase && top.currentImage==2) imageWidth=170;
		else imageWidth=top.aProduct[top.currentProduct].imageWidth;
		docWrite+=" WIDTH="+(imageWidth);
		docWrite+=" HEIGHT="+top.aProduct[top.currentProduct].imageHeight+" ALT="+altText;
		docWrite+=" TITLE="+altText;
		docWrite+=" VSPACE=2 onMouseOver=\"status="+statText+"; return true;\">";
	}
	return docWrite;
}

function changeWood(selectElem)
{
	top.aProduct[top.currentProduct].wood= selectElem;
	top.currentWood=selectElem;
	if (top.currentProduct<=top.nFaceClock) top.currentImage=1;
	parent.changeImage(parent);
	self.document.Order.OrderQuantity.value=1;
	var priceDiv=document.getElementById("priceBox");
	priceDiv.innerHTML=self.productTitle();
}