function addProduct() {
	var mainProd = document.getElementById("mainprod");
	var mainProdClone = mainProd.cloneNode(true);
	var addedProds = document.getElementById("addedprods");
	var html = "";

	html += "<div>";
	html += "<div class=\"h\">";
	html += "<div class=\"floatright\">[-] <a href=\"javascript:;\" onclick=\"removeProduct(this);\">Remove This Product</a></div>";
	html += "<strong>Personalize This Product!</strong></div>";
	html += "<div class=\"row\">";
	
	var els = mainProdClone.getElementsByTagName("INPUT");
	for (var i=0; i<els.length; i++) {
		els[i].value = "";
	}
	
	html += mainProdClone.innerHTML;
	html += "<input name=\"vwitem" + itemCount + "\" type=\"hidden\" value=\"" + itemID.toLowerCase() + "\">";
	html += "<input type=\"hidden\" name=\"vwquantity" + itemCount + "\" value=\"1\">";
	html += "</div>";
	html += "</div>";
	
	html = html.replace(/vwattr0/gi, "vwattr" + itemCount.toString());
	html = html.replace(/vwattr1/gi, "vwattr" + itemCount.toString());
	html = html.replace(/textLineBox0/gi, "textLineBox" + itemCount.toString());
	html = html.replace(/font-img0/gi, "font-img" + itemCount.toString());
	
	html = html.replace(/itemtempl[0-9]+/gi, "itemtempl" + itemCount.toString());
	html = html.replace(/fontopt[0-9]+/gi, "fontopt" + itemCount.toString());
	html = html.replace(/sel0[0-9]+/gi, "sel0" + itemCount.toString());
	html = html.replace(/sel1[0-9]+/gi, "sel1" + itemCount.toString());
	html = html.replace(/sel2[0-9]+/gi, "sel2" + itemCount.toString());
	html = html.replace(/class=[0-9]+/gi, "class=" + itemCount.toString());
	html = html.replace(/class=\"[0-9]+/gi, "class=\"" + itemCount.toString());
	html = html.replace(/class=templ-line[0-9]+/gi, "class=templ-line" + itemCount.toString());
	html = html.replace(/class=\"templ-line[0-9]+/gi, "class=\"templ-line" + itemCount.toString());
	
	
	//alert(html)

	var subInputs = addedProds.getElementsByTagName("INPUT");
	var subSelect = addedProds.getElementsByTagName("SELECT");
	var tmpArray = new Array();
	//var selArray = new Array();
	for (var i=0; len=subInputs.length, i<len; i++) {
		tmpArray[subInputs[i].name] = subInputs[i].value;
	}

	for (var i=0; len=subSelect.length, i<len; i++) {
		tmpArray[subSelect[i].name] = subSelect[i].selectedIndex;
	}
	
	addedProds.innerHTML += html;

	for (var i=0; len=subInputs.length, i<len; i++) {
		if(tmpArray[subInputs[i].name])
			subInputs[i].value = tmpArray[subInputs[i].name];
	}

	for (var i=0; len=subSelect.length, i<len; i++) {
		if(tmpArray[subSelect[i].name])
			subSelect[i].selectedIndex = tmpArray[subSelect[i].name];
	}

	var sel = document.getElementById("itemtempl" + itemCount.toString());
	var selParent = document.getElementById("itemtempl0");
	if(sel && selParent)
		sel.selectedIndex = selParent.selectedIndex;
		
	/* If font Is There than Use This Piece Of Code */
	var sel1 = document.getElementById("fontopt" + itemCount.toString());
	var selParent1 = document.getElementById("fontopt0");
	if(sel1 && selParent1)
		sel1.selectedIndex = selParent1.selectedIndex;
	
		/* If normal Select Is There than Use This Piece Of Code */
	var sel2 = document.getElementById("sel0" + itemCount.toString());
	var selParent2 = document.getElementById("sel00");
	if(sel2 && selParent2)
		sel2.selectedIndex = selParent2.selectedIndex;
		
		/* If normal Select Is There than Use This Piece Of Code */
	var sel3 = document.getElementById("sel1" + itemCount.toString());
	var selParent3 = document.getElementById("sel10");
	if(sel3 && selParent3)
		sel3.selectedIndex = selParent3.selectedIndex;
	
	
		/* If normal Select Is There than Use This Piece Of Code */
	var sel4 = document.getElementById("sel2" + itemCount.toString());
	var selParent4 = document.getElementById("sel20");
	if(sel4 && selParent4)
		sel4.selectedIndex = selParent4.selectedIndex;
	
	itemCount++;
}

function removeProduct(obj) {
	obj.parentNode.parentNode.parentNode.parentNode.removeChild(obj.parentNode.parentNode.parentNode);
	itemCount--;
}

function pad_with_zeros(rounded_value, decimal_places) {
    var value_string = rounded_value.toString()
    var decimal_location = value_string.indexOf(".")
    if (decimal_location == -1) {
        decimal_part_length = 0
        value_string += decimal_places > 0 ? "." : ""
    }
    else {
        decimal_part_length = value_string.length - decimal_location - 1
    }
    var pad_total = decimal_places - decimal_part_length
    if (pad_total > 0) {
        for (var counter = 1; counter <= pad_total; counter++) 
            value_string += "0"
    }
    else {
	return value_string.substring(0, decimal_location + decimal_places + 1);
    }
    return value_string;
}

function clearTextarea(obj) {
	var list = document.getElementsByTagName("TEXTAREA");
	for (var i=0; i<list.length; i++) {
		if (list[i].value == textareaText) {
			list[i].value = "";
		}
	}

	var count = 0;
	var index = 0;
	var textLines = obj.getElementsByTagName("INPUT");
	if (textLines.length > 1) {
		for (var i=0; i<textLines.length; i++) {
			if (textLines[i].className.substring(0, 10) == "templ-line" && textLines[i].value != "") {
				if (index != parseInt(textLines[i].className.substring(10))) {
					addCharge(index, count);
					index = parseInt(textLines[i].className.substring(10));
					count = 0;
				}
				count++;
			}
		}
		//if there is only one product
		if (index == 0 && count != 0) {
			addCharge(index, count);
		}
		//call this function for last product
		if (index != 0 && count != 0) {
			addCharge(index, count);
		}
	}
}

function addCharge(index, count) {
	var sel = document.getElementById("itemtempl" + index.toString());
	if (sel && count != 0) {
		var res = count * parseFloat(persch.replace(/\$/gi, ""));
		if (res != 0) {
			sel.options[sel.selectedIndex].value += "(+$" + pad_with_zeros(res, 2) + ")";
		}
	}
}

function showFontPopup(link)
{
	var w = window.open(link, "win", "height=500,width=710,scrollbars=yes,resizable=yes");
}

function changeFontImg(obj, fontid) {
	var mainimg = document.getElementById(fontid);
	if (mainimg) {
		mainimg.src = obj.options[obj.selectedIndex].className;
	}
}

function convertToHex(pureString) {
	var res = "";
	for (var i=0; i<pureString.length; i++) {
		res += d2h(pureString.charCodeAt(i));
	}
	return res;
}

function d2h(d) {
	var hD="0123456789ABCDEF";
	var h = hD.substr(d&15,1);
	while(d>15) {d>>=4;h=hD.substr(d&15,1)+h;}
	return h;
}

function changeTextLines(obj, objid, prefix, index) {
	var tempStr = "";
	if (persch != "" && persch != "$0.00")
		tempStr = "(" + persch + ")";
	convertToHex("Text1");
	var box = document.getElementById(objid);
	if (box) {
		box.innerHTML = "";
		var arr = obj.options[obj.selectedIndex].className.split(" ");
		var countLines = arr[1];
		for (i=0; i<countLines; i++) {
			var inc = i + 1;
			box.innerHTML += "Engraving Line " + inc.toString() + ": " + tempStr + " " + "<input class=\"templ-line" + index + "\" maxlength=\"" + arr[i + 2] + "\" type=\"text\" name=\"" + prefix + "_Text" + inc.toString() + "\" /><br>";
		}
	}
}

function changeTextLines2(settings) {
	var tempStr = "";
	if (persch != "" && persch != "$0.00")
		tempStr = "(" + persch + ")";
	var box = document.getElementById("textLineBox0");
	if (box) {
		box.innerHTML = "";
		var arr = settings.split(" ");
		var countLines = parseInt(arr[1]);
		for (i=0; i<countLines; i++) {
			var inc = i + 1;
			box.innerHTML += "Engraving Line " + inc.toString() + ": " + tempStr + " " + "<input class=\"templ-line0\" maxlength=\"" + arr[i + 2] + "\" type=\"text\" name=\"vwattr0_Text" + inc.toString() + "\" /><br>";
		}
	}
}

function showTemplPopup() {
	var sel = document.getElementById("itemtempl0");
	if (sel) {
		var curValue = sel.options[sel.selectedIndex].value;
		for (i=0; i<arrTemplLinks.length; i++) {
			if (arrTemplLinks[i] == curValue)
				showFontPopup(arrTemplLinks[i + 1]);
		}
	}
}