
function addTemplate() {
	
	// get current number of templates
	var count = getNumberOfTemplates();
	
	// remove possible removed template input
	var divOuter = document.getElementById("ts.div.templates");
	var hidden = document.getElementById("ts.id" + count);
	if(hidden != null) {
		divOuter.removeChild(hidden);
	}
	
	// create number span
	var span = document.createElement("span");
	span.innerHTML = (parseInt(count) + 1) + ".&#160;\n";
	
	// create select box
	// and add options
	var select = document.createElement("select");
	select.setAttribute("id",         "ts.id" + count);
	select.setAttribute("name",       "ts.id" + count);
	select.setAttribute("size",       "1");
	var html = "";
	for( var i = 0; i < tvalues.length; i++ ) {
		html += "<option value='"+tvalues[i]+"'>"+ttexts[i]+"</option>";
	}
	select.innerHTML = html;
	
	// create template div
	// and add span and select
	var divTemplate = document.createElement("div");
	divTemplate.setAttribute("id", "ts.div.template" + count);
	divTemplate.appendChild(span);
	divTemplate.appendChild(select);
	
	// append template div to outer div
	divOuter.appendChild(divTemplate);
}

function removeLastTemplate() {
	
	// get current number of templates
	var count = getNumberOfTemplates();

	if(count > 0) {
		
		// remove template div
		var divOuter = document.getElementById("ts.div.templates");
		var divTemplate = document.getElementById("ts.div.template"+(count-1));
		divOuter.removeChild(divTemplate);
		
		// store hidden inputs to remember that we deleted something
		var hidden = document.createElement("input");
		hidden.setAttribute("id"   , "ts.id" + (count-1));
		hidden.setAttribute("name" , "ts.id" + (count-1));
		hidden.setAttribute("type" , "hidden");
		hidden.setAttribute("value", "");
		divOuter.appendChild(hidden);
	}
}

function getNumberOfTemplates() {
	
	// we calculate it dynamically, because this avoids to have
	// another input element
	var divOuter = document.getElementById("ts.div.templates");
	var children = divOuter.childNodes;
	var count = 0;
	for( var i = 0; i < children.length; i++ ) {
		if(children[i].tagName == null) continue;
		if(children[i].tagName.toLowerCase() == "div") count++;
	}
	return count;
}
