var selectedIcon = "sticker1";
var selectedSize = "icn_small";
var selectedColour = "white";

var tlFont1 = "Arial", tlFont2 = "Arial", tlFont3 = "Arial", tlFont4 = "Arial";

var tlSize1 = "small", tlSize2 = "small", tlSize3 = "small", tlSize4 = "small";

var tlAlign1 = "left", tlAlign2 = "left", tlAlign3 = "left", tlAlign4 = "left";

var tlColour1 = "black", tlColour2 = "black", tlColour3 = "black", tlColour4 = "black";


function inputToLabel(inputId, labelId)
{
	document.getElementById(labelId).innerHTML = document.getElementById(inputId).value;
}




function makeColourBorder(imageId)
{
	document.getElementById(imageId).style.border = "2px solid red";
}



function removeColourBorder(imageId)
{
	if ( selectedColour != imageId )
	{
		document.getElementById(imageId).style.border = "2px solid #818181";
	}	
}




function selectColour(imageId)
{
	if (selectedColour != "none")
	{
		if (selectedColour != imageId)
		{
			document.getElementById(selectedColour).style.border = "2px solid #818181";
		}
	}
	
	selectedColour = imageId;
	
	var clientId = document.getElementById ('hdSelectedColour').value;
	document.getElementById (clientId).value = selectedColour;
}




function makeborder(imageId)
{
	document.getElementById(imageId).style.border = "2px solid red";
	document.getElementById(imageId).style.marginTop = "0px";
}



function removeborder(imageId)
{
	if ( selectedIcon != imageId )
	{
		document.getElementById(imageId).style.border = "";
		document.getElementById(imageId).style.marginTop = "2px";
	}	
}


function selectIcon(imageId)
{
	if (selectedIcon != "none")
	{
		if (selectedIcon != imageId)
		{
			document.getElementById(selectedIcon).style.border = "";
			document.getElementById(selectedIcon).style.marginTop = "2px";
		}
	}
	
	selectedIcon = imageId;
	
	var str = document.getElementById(imageId).src;
	document.getElementById("BigSticker").src = str.replace("small", "large");
	
	var clientId = document.getElementById ('hdSelectedIcon').value;
	document.getElementById (clientId).value = selectedIcon;
	
	if (imageId == "sticker7" || imageId == "sticker8" || imageId == "sticker9")
	{
		document.getElementById("dvMedium").style.visibility = "hidden";
		document.getElementById("dvLarge").style.visibility = "hidden";
		
		selectSize("icn_small");
	}
	else
	{
		if (document.getElementById("dvMedium") != null) document.getElementById("dvMedium").style.visibility = "visible";
		if (document.getElementById("dvLarge") != null) document.getElementById("dvLarge").style.visibility = "visible";
	}
}





function highlightSize(sizeId)
{
	document.getElementById(sizeId).src = "images/" + sizeId + "_ovr.gif";
}


function removeHighlight(sizeId)
{
	if ( selectedSize != sizeId )
	{
		document.getElementById(sizeId).src = "images/" + sizeId + ".gif";
	}	
}


function selectSize(sizeId)
{
	if (selectedSize != "none")
	{
		if (selectedSize != sizeId)
		{
			document.getElementById(selectedSize).src = "images/" + selectedSize + ".gif";
		}
	}
	
	selectedSize = sizeId;
	
	var clientId = document.getElementById ('hdSelectedSize').value;
	document.getElementById (clientId).value = selectedSize;
	
	if (selectedSize == "icn_small")
	{
		document.getElementById('tSmall').style.fontWeight = "bold";
		document.getElementById('tMedium').style.fontWeight = "normal";
		document.getElementById('tLarge').style.fontWeight = "normal";
	}
	
	if (selectedSize == "icn_medium")
	{
		document.getElementById('tSmall').style.fontWeight = "normal";
		document.getElementById('tMedium').style.fontWeight = "bold";
		document.getElementById('tLarge').style.fontWeight = "normal";
	}
	
	if (selectedSize == "icn_large")
	{
		document.getElementById('tSmall').style.fontWeight = "normal";
		document.getElementById('tMedium').style.fontWeight = "normal";
		document.getElementById('tLarge').style.fontWeight = "bold";
	}
}



function hideProduct(divid)
{
	if (document.getElementById(divid) != null ) document.getElementById(divid).style.visibility = "hidden";
}


	
//<![CDATA[
function SetColor(colImg, lineNum)
{
  var chosen = document.getElementById('ChosenColor');
  chosen.style.backgroundColor = colImg.style.backgroundColor;
  chosen.innerHTML = colImg.alt;
  
  document.getElementById("lblTextLine" + lineNum).style.color = colImg.style.backgroundColor;
  
  if (lineNum == "1")
	{
		tlColour1 = colImg.alt;
	}
	else if (lineNum == "2")
	{
		tlColour2 = colImg.alt;
	}
	else if (lineNum == "3")
	{
		tlColour3 = colImg.alt;
	}
	else if (lineNum == "4")
	{
		tlColour4 = colImg.alt;
	}
}
//]]>


//<![CDATA[
function SetColor2(colImg)
{
  var chosen = document.getElementById('ChosenColor');
  chosen.style.backgroundColor=colImg.style.backgroundColor;
  chosen.innerHTML = colImg.alt;  
}
//]]>
		

function changeTextFont(font, lineNum)
{
	document.getElementById("lblTextLine" + lineNum).style.fontFamily = font;
	
	if (lineNum == "1")
	{
		tlFont1 = font;
	}
	else if (lineNum == "2")
	{
		tlFont2 = font;
	}
	else if (lineNum == "3")
	{
		tlFont3 = font;
	}
	else if (lineNum == "4")
	{
		tlFont4 = font;
	}
}
		
		
function changeTextSize(size, lineNum)
{
	document.getElementById("lblTextLine" + lineNum).style.fontSize = size;
	var sizeName;
	
	switch (size)
	{
		case '16px':
			sizeName = "Small";
		break;
		case '20px':
			sizeName = "Medium";
		break;
		case '24px':
			sizeName = "Large";
		break;
		default : sizeName = "Small";
	}
	
	if (lineNum == "1")
	{
		tlSize1 = sizeName;
	}
	else if (lineNum == "2")
	{
		tlSize2 = sizeName;
	}
	else if (lineNum == "3")
	{
		tlSize3 = sizeName;
	}
	else if (lineNum == "4")
	{
		tlSize4 = sizeName;
	}
}



function changeTextAlignment(align, lineNum)
{
	document.getElementById("divTextline" + lineNum).style.textAlign = align;
	
	if (lineNum == "1")
	{
		tlAlign1 = align;
	}
	else if (lineNum == "2")
	{
		tlAlign2 = align;
	}
	else if (lineNum == "3")
	{
		tlAlign3 = align;
	}
	else if (lineNum == "4")
	{
		tlAlign4 = align;
	}
}



function addLetteringToCart()
{
	var textLine1 = document.getElementById("txtTextLine1").value;
	var textLine2; 
	if (document.getElementById("txtTextLine2") != null) {textLine2 = document.getElementById("txtTextLine2").value;} else {textLine2 = "";};
	var textLine3;
	if (document.getElementById("txtTextLine3") != null) {textLine3 = document.getElementById("txtTextLine3").value;} else {textLine3 = "";};
	var textLine4;
	if (document.getElementById("txtTextLine4") != null) {textLine4 = document.getElementById("txtTextLine4").value;} else {textLine4 = "";};
	
	var specialInstructions;
	
	if (document.getElementById("txtSpecialInstructions") != null)
	{
		specialInstructions = document.getElementById("txtSpecialInstructions").value;
	}
	else
	{
		specialInstructions = "";	
	}
	
	var quantity = 1;
	
	if (document.getElementById("txtProductQuantity") != null)
	{
		quantity = document.getElementById("txtProductQuantity").value;
	}
	
	callbAddToCart.callback(tlFont1, tlFont2, tlFont3, tlFont4, tlSize1, tlSize2, tlSize3, tlSize4, tlAlign1, tlAlign2, tlAlign3, tlAlign4, tlColour1, tlColour2, tlColour3, tlColour4, textLine1, textLine2, textLine3, textLine4, specialInstructions, quantity);
}



function callbackError()
{
  alert('Invalid data entered.');
}