//***************************************************
//***** COPYRIGHT 2006 PRACTICAL DATA, INC.  ********
//***** USE WITHOUT PERMISSION IS PROHIBITED ********
//***************************************************

function cwPersonalizationDisplay(value){

	if(value){
		var valueTrimmed;
		valueTrimmed = value.substring(0,3);
		if(valueTrimmed == 'Yes'){
			document.getElementById("cwPersonalizationWrapper").style.display = 'block';	
			var html = document.getElementById("cwEmbChooseStyle").innerHTML;
			document.getElementById("cwEmbChooseStyleDisplay").style.display = 'block';	
			document.getElementById("cwEmbChooseStyleDisplay").innerHTML = html;	
			updateCWPrice();
		}else {
			document.getElementById("cwPersonalizationWrapper").style.display = 'none';	
			//RESEST INNER INPUT DIV HTML AREAS
			document.getElementById("cwEmbChooseStyleDisplay").innerHTML = '';
			document.getElementById("cwEmbChooseStyleInputDisplay").innerHTML = '';
			document.getElementById("cwEmbChooseThreadColorDisplay").innerHTML = '';
			//HIDE PERS. DIVS
			document.getElementById("cwEmbChooseFontDisplay").style.display = 'none';
			document.getElementById("vwquantity").value = 1;
			updateCWPrice();
		}
	}else{
		return false;
	}
}


function styleDisplay(passedStyle){
	var style = trimOptionPrice(passedStyle);
	var html ='';
	var tableFormatStart = '<table border="0" cellpadding="4" cellspacing="0" width="100%"><tr valign="top"><td>';
	var tableFormatMiddle = '</td><td>';
	var tableFormatEnd = '</td></tr></table>';
	
	//FIRST NAME
	var firstNameInputHTML = '';
	var firstNameInsLenNum;
	var firstNameInsLen = document.getElementById("firstNameInsLen");
	if(firstNameInsLen){
		firstNameInsLenNum = firstNameInsLen.innerHTML - 0;
	}else{
		firstNameInsLenNum = 8;
	}

	firstNameInputHTML += '<div class="cwPurpleText">Enter First Name:</div>';
	firstNameInputHTML += '<table border="0" cellpadding="0" cellspacing="0"><tr><td>';
	firstNameInputHTML += '<input type="text" id="" name="First Name" size="20" maxlength="';
	firstNameInputHTML += firstNameInsLenNum;
	firstNameInputHTML += '" onKeyUp="cwEmbFontInputDisplay(\'firstName\');">';
	firstNameInputHTML += '</td></tr></table>'; 
	
	//SINGLE INITIAL
	var singleInitialInputHTML = '';
	singleInitialInputHTML += '<table border="0" cellpadding="0" cellspacing="0"><tr><td>';
	singleInitialInputHTML += '<span class="cwPurpleText">Enter Initial:</span> &nbsp;';
	singleInitialInputHTML += '</td><td>';
	singleInitialInputHTML += '<input type="text" id="" name="Single Initial" size="1" maxlength="1" onKeyUp="cwEmbFontInputDisplay(\'singleInitial\');">';
	singleInitialInputHTML += '</td></tr></table>'; 
	
	//INITIALS
	var initialsInputHTML = '';
	initialsInputHTML += '<div class="cwPurpleText">&nbsp;Enter Initials:</div>';
	initialsInputHTML += '<table border="0" cellpadding="3" cellspacing="1"><tr>';
	initialsInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>First</b><br><input type="text" id="Monogram-Text-1" name="Initial - First" size="1" maxlength="1" onKeyUp="cwEmbFontInputDisplay(\'initials\');"></td>';
	initialsInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>Middle</b><br><input type="text" id="Monogram-Text-2" name="Initial - Middle" size="1" maxlength="1" onKeyUp="cwEmbFontInputDisplay(\'initials\');"></td>';
	initialsInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>Last</b><br><input type="text" id="Monogram-Text-3" name="Initial - Last" size="1" maxlength="1" onKeyUp="cwEmbFontInputDisplay(\'initials\');"></td>';
	initialsInputHTML += '</tr></table>'; 
	
	//MONOGRAM
	var monogramInputHTML = '';
	monogramInputHTML += '<div class="cwPurpleText">&nbsp;Enter Monogram:</div>';
	monogramInputHTML += '<table border="0" cellpadding="3" cellspacing="1"><tr>';
	monogramInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>First</b><br><input type="text" id="Monogram-Text-1" name="Initial - First" size="1" maxlength="1" onKeyUp="cwEmbFontInputDisplay(\'monogram\');"></td>';
	monogramInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>Last</b><br><input type="text" id="Monogram-Text-2" name="Initial - Last" size="1" maxlength="1" onKeyUp="cwEmbFontInputDisplay(\'monogram\');"></td>';
	monogramInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>Middle</b><br><input type="text" id="Monogram-Text-3" name="Initial - Middle" size="1" maxlength="1" onKeyUp="cwEmbFontInputDisplay(\'monogram\');"></td>';
	monogramInputHTML += '</tr></table>'; 
			
	var firstNameHTML = tableFormatStart + firstNameInputHTML + tableFormatEnd;
	var singleInitialHTML = tableFormatStart + singleInitialInputHTML + tableFormatEnd;
	var initialsHTML = tableFormatStart + initialsInputHTML + tableFormatEnd;
	var monogramHTML = tableFormatStart + monogramInputHTML + tableFormatEnd;

	//DISPLAY STYLE INFO
	switch (style){
	case "First Name":
		styleDisplayHTML(firstNameHTML);
		updateCWPrice(passedStyle);
		break
	case "Single Initial":
		styleDisplayHTML(singleInitialHTML);
		updateCWPrice(passedStyle);
		break
	case "Initials(First-Middle-Last)":
		styleDisplayHTML(initialsHTML);
		updateCWPrice(passedStyle);
		break
	case "Monogram(First-Last-Middle)":
		styleDisplayHTML(monogramHTML);
		updateCWPrice(passedStyle);
		break
	default:
		styleDisplayHTML(html,'yes');
	}
}


function styleDisplayHTML(inputHTML,enableInfo){
	document.getElementById("cwEmbChooseStyleInputDisplay").style.display = 'block';
	document.getElementById("cwEmbChooseStyleInputDisplay").innerHTML = inputHTML;
}

function cwEmbFontInputDisplay(style){
	document.getElementById("cwEmbChooseFontDisplay").style.display = 'block';

	switch (style){
	case "firstName":
		html = document.getElementById("font-firstName").innerHTML;
		document.getElementById("cwEmbFontInputDisplay").innerHTML = html;
		break
	case "singleInitial":
		html = document.getElementById("font-singleInitial").innerHTML;
		document.getElementById("cwEmbFontInputDisplay").innerHTML = html;
		break
	case "initials":
		html = document.getElementById("font-initials").innerHTML;
		document.getElementById("cwEmbFontInputDisplay").innerHTML = html;
		break
	case "monogram":
		html = document.getElementById("font-monogram").innerHTML;
		document.getElementById("cwEmbFontInputDisplay").innerHTML = html;
		break
	default:
		cwEmbFontInputDisplay.innerHTML = '';
	}
}

function threadColorDisplay(font){
	var inputHTML = document.getElementById("cwEmbChooseThreadColor").innerHTML;	
	document.getElementById("cwEmbChooseThreadColorDisplay").style.display = 'block';
	document.getElementById("cwEmbChooseThreadColorDisplay").innerHTML = inputHTML;	
}

function updateCWPrice(){
	//alert('fired');
	//GET QUANTITY
	var quantity = document.getElementById("vwquantity").value;

	//GET ITEM PRICE
	var itemPriceStr = document.getElementById("perslPrice").innerHTML;
	var itemPriceNum = itemPriceStr - 0;

	//GET UNIT PRICE
	var unitPrice = itemPriceNum;
	if(document.getElementById("qtyPricing")){
		//GET QUANTITY PRICING STRING
		var itemQtyPricingStr = document.getElementById("qtyPricing").innerHTML;
		unitPrice = getQuantityPricing(quantity,itemQtyPricingStr);
	}

	//LOOP AND FIND ADDITIONAL OPTION FIELDS / UPDATE PRICE CHANGE VARIABLE
	var priceChange = 0;
	for(i=0; i<document.orderForm.elements.length; i++){
		var findCurrency = document.orderForm.elements[i].value.indexOf('$');
		if(findCurrency > 0){
		 	priceChange = priceChange + parseOptionPrice(document.orderForm.elements[i].value);
		}
	}

	//GET PRICE DIFF
	var priceDiff = itemPriceNum - unitPrice;

	//GET PERSONALIZE PRICE
	var personalizeOption = getCheckedValue(document.orderForm["Embroidery"]);
	var personalizePrice = parseOptionPrice(personalizeOption);

	//GET GIFT OPTION PRICE
	//var giftOption = getCheckedValue(document.orderForm["Gift Wrapping"]);
	//var giftPrice = parseOptionPrice(giftOption);
	
	//CALCULATE TOTAL PRICE
	//var totalPrice = ((unitPrice * 1) + personalizePrice + giftPrice + priceChange) * quantity;		
	var totalPrice = ((unitPrice * 1) + personalizePrice + priceChange) * quantity;		

	//DEBUG 
	/*
	var message = '';
	message += 'unit price:' + unitPrice + '\n';
	message += 'price change: ' + priceChange + '\n';
	message += 'personalize price: ' + personalizePrice + '\n';
	message += 'NEW PRICE: ' + totalPrice + '\n';
	alert(message);
	*/
	
	document.getElementById("perslPriceDisplay").innerHTML = formatCurrency(totalPrice);
}


/*************************************************************/
/****************** ENGRAVING FUNCTIONS **********************/
/*************************************************************/



function cwEngPersonalizationDisplay(value){

	if(value){
		var valueTrimmed;
		valueTrimmed = value.substring(0,3);
		if(valueTrimmed == 'Yes'){
			document.getElementById("cwPersonalizationWrapper").style.display = 'block';	
			var html = document.getElementById("cwEngChooseStyle").innerHTML;
			document.getElementById("cwEngChooseStyleDisplay").style.display = 'block';	
			document.getElementById("cwEngChooseStyleDisplay").innerHTML = html;	
			updateCWPrice();
		}else {
			document.getElementById("cwPersonalizationWrapper").style.display = 'none';	
			//RESEST INNER INPUT DIV HTML AREAS
			document.getElementById("cwEngChooseStyleDisplay").innerHTML = '';
			document.getElementById("cwEngChooseStyleInputDisplay").innerHTML = '';
			//HIDE PERS. DIVS
			document.getElementById("cwEngChooseFontDisplay").style.display = 'none';
			document.getElementById("vwquantity").value = 1;
			updateCWPrice();
		}
	}else{
		return false;
	}
}

function styleDisplayEng(passedStyle){
	var style = trimOptionPrice(passedStyle);
	var html ='';
	var tableFormatStart = '<table border="0" cellpadding="4" cellspacing="0" width="100%"><tr valign="top"><td>';
	var tableFormatMiddle = '</td><td>';
	var tableFormatEnd = '</td></tr></table>';
	
	//FIRST NAME
	var textInputHTML = '';
	var nameInsNum;
	var nameInsLen = document.getElementById("nameInsLen");
	if(nameInsLen){
		nameInsLenNum = nameInsLen.innerHTML - 0;
	}else{
		nameInsLenNum = 20;
	}
	textInputHTML += '<div class="cwPurpleText">Enter Your Text:</div>';
	textInputHTML += '<table border="0" cellpadding="0" cellspacing="0"><tr><td>';
	textInputHTML += '<input type="text" id="" name="Text" size="20" maxlength="';
	textInputHTML += nameInsLenNum;
	textInputHTML += '" onKeyUp="cwEngFontInputDisplay(\'text\');">';
	textInputHTML += '</td></tr></table>'; 
	
	//SINGLE INITIAL
	var singleInitialInputHTML = '';
	singleInitialInputHTML += '<table border="0" cellpadding="0" cellspacing="0"><tr><td>';
	singleInitialInputHTML += '<span class="cwPurpleText">Enter Initial:</span> &nbsp;';
	singleInitialInputHTML += '</td><td>';
	singleInitialInputHTML += '<input type="text" id="" name="Single Initial" size="1" maxlength="1" onKeyUp="cwEngFontInputDisplay(\'singleInitial\');">';
	singleInitialInputHTML += '</td></tr></table>'; 
	
	//INITIALS
	var initialsInputHTML = '';
	initialsInputHTML += '<div class="cwPurpleText">&nbsp;Enter Initials:</div>';
	initialsInputHTML += '<table border="0" cellpadding="3" cellspacing="1"><tr>';
	initialsInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>First</b><br><input type="text" id="Monogram-Text-1" name="Initial - First" size="1" maxlength="1" onKeyUp="cwEngFontInputDisplay(\'initials\');"></td>';
	initialsInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>Middle</b><br><input type="text" id="Monogram-Text-2" name="Initial - Middle" size="1" maxlength="1" onKeyUp="cwEngFontInputDisplay(\'initials\');"></td>';
	initialsInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>Last</b><br><input type="text" id="Monogram-Text-3" name="Initial - Last" size="1" maxlength="1" onKeyUp="cwEngFontInputDisplay(\'initials\');"></td>';
	initialsInputHTML += '</tr></table>'; 
	
	//MONOGRAM
	var monogramInputHTML = '';
	monogramInputHTML += '<div class="cwPurpleText">&nbsp;Enter Monogram:</div>';
	monogramInputHTML += '<table border="0" cellpadding="3" cellspacing="1"><tr>';
	monogramInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>First</b><br><input type="text" id="Monogram-Text-1" name="Initial - First" size="1" maxlength="1" onKeyUp="cwEngFontInputDisplay(\'monogram\');"></td>';
	monogramInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>Last</b><br><input type="text" id="Monogram-Text-2" name="Initial - Last" size="1" maxlength="1" onKeyUp="cwEngFontInputDisplay(\'monogram\');"></td>';
	monogramInputHTML += '<td width="36" align="center" class="cwMonogramCell"><b>Middle</b><br><input type="text" id="Monogram-Text-3" name="Initial - Middle" size="1" maxlength="1" onKeyUp="cwEngFontInputDisplay(\'monogram\');"></td>';
	monogramInputHTML += '</tr></table>'; 
			
	var textHTML = tableFormatStart + textInputHTML + tableFormatEnd;
	var singleInitialHTML = tableFormatStart + singleInitialInputHTML + tableFormatEnd;
	var initialsHTML = tableFormatStart + initialsInputHTML + tableFormatEnd;
	var monogramHTML = tableFormatStart + monogramInputHTML + tableFormatEnd;

	//DISPLAY STYLE INFO
	switch (style){
	case "Text":
		styleDisplayEngHTML(textHTML);
		updateCWPrice(passedStyle);
		break
	case "Single Initial":
		styleDisplayEngHTML(singleInitialHTML);
		updateCWPrice(passedStyle);
		break
	case "Initials(First-Middle-Last)":
		styleDisplayEngHTML(initialsHTML);
		updateCWPrice(passedStyle);
		break
	case "Monogram(First-Last-Middle)":
		styleDisplayEngHTML(monogramHTML);
		updateCWPrice(passedStyle);
		break
	default:
		styleDisplayEngHTML(html,'yes');
	}
}

function styleDisplayEngHTML(inputHTML,enableInfo){
	document.getElementById("cwEngChooseStyleInputDisplay").style.display = 'block';
	document.getElementById("cwEngChooseStyleInputDisplay").innerHTML = inputHTML;
}

function cwEngFontInputDisplay(style){
	document.getElementById("cwEngChooseFontDisplay").style.display = 'block';

	switch (style){
	case "text":
		html = document.getElementById("font-text").innerHTML;
		document.getElementById("cwEngFontInputDisplay").innerHTML = html;
		break
	case "singleInitial":
		html = document.getElementById("font-singleInitial").innerHTML;
		document.getElementById("cwEngFontInputDisplay").innerHTML = html;
		break
	case "initials":
		html = document.getElementById("font-initials").innerHTML;
		document.getElementById("cwEngFontInputDisplay").innerHTML = html;
		break
	case "monogram":
		html = document.getElementById("font-monogram").innerHTML;
		document.getElementById("cwEngFontInputDisplay").innerHTML = html;
		break
	default:
		document.getElementById("cwEngFontInputDisplay").innerHTML = '';
	}
}