function ulredit_show(e) {
	if (e != null) e.style.display="block";
}
function ulredit_hide(e) {
	if (e != null) e.style.display="none";
}

function ulredit_togglebyid(id) {
	var e = document.getElementById(id);
	if (e != null) {	
		if ((e.style.display == "none") || (e.style.display == '')) {
			ulredit_show(e);
		} else {
			ulredit_hide(e);
		}
	}
}

function ulredit_togglebyid_hidefirst(id) {
	var e = document.getElementById(id);
	if (e != null) {	
		if ((e.style.display == "none")) {
			ulredit_show(e);
		} else {
			ulredit_hide(e);
		}
	}
}

function ulredit_collapse(fieldid) {
	ulredit_togglebyid_hidefirst(fieldid + "-values");
	ulredit_togglebyid_hidefirst(fieldid + "-newvalues");
}

function ulredit_langselect(targetname) {
	document.getElementById("langselect_targetfield").value = targetname;
	ulredit_show(document.getElementById("ulredit_popup_langselect"));
}
function ulredit_valuetype(targetname) {
	document.getElementById("valuetype_targetfield").value = targetname;
	ulredit_show(document.getElementById("ulredit_popup_valuetype"));
}

function ulredit_langselect_ok() {
	targetfield = document.getElementById("langselect_targetfield").value;
	var e = document.getElementById(targetfield);
	if (e != null) e.value = document.getElementById("langselect_value").value;
	e = document.getElementById(targetfield + "-button");
	e.innerHTML =  document.getElementById("langselect_value").value + " (reselect)";
	ulredit_hide(document.getElementById("ulredit_popup_langselect"));
}
function ulredit_valuetype_ok() {
	targetfield = document.getElementById("valuetype_targetfield").value;
	var e = document.getElementById(targetfield);
	if (e != null) e.value = document.getElementById("valuetype_value").value;
	e = document.getElementById(targetfield + "-button");
	e.innerHTML =  document.getElementById("valuetype_value").value + " (reselect)";
	ulredit_hide(document.getElementById("ulredit_popup_valuetype"));
}

function ulredit_langselect_cancel() {
	var e = document.getElementById("ulredit_popup_langselect");
	ulredit_hide(e);
}
function ulredit_valuetype_cancel() {
	var e = document.getElementById("ulredit_popup_valuetype");
	ulredit_hide(e);
}


function ulredit_addnewitem() {
	var counterfield = document.getElementById("newitemcount");
	counterfield.value = eval(counterfield.value) + 1;
	var counter = counterfield.value;
	var raw = document.getElementById("template_options_itemtype").value;
	raw = raw.split('^');
	var itemtypeoptions = '';
	for (i = 0; i < raw.length; i++) {
		raw2 = raw[i].split(':');
		itemtypeoptions = itemtypeoptions + '<option value="'+raw2[0]+'">'+raw2[1] + '</option>';
	}
	var parentdiv = document.getElementById("ulredit_newitems");
	var fieldid = "ulredit_newitem-" + counter;

	//we can't directly modify the parentdiv's innerHTML cause that would erase all input values. Using a partial DOM solution instead:
	var newchild = document.createElement('div');
	newchild.setAttribute('class','ulredit_item');
	newchild.innerHTML =  '<div class="ulredit_newitemheader"><span class="ulredit_num">#'+counter+'</span> - <span class="ulredit_type">New Item</span> - <b>ID:</b> <input name="'+fieldid+'-id" /> - <b>Type:</b> <select name="'+fieldid+'-type" id="'+fieldid+'-type">'+itemtypeoptions+'</select> - <b>Category:</b> <input name="'+fieldid+'-category" value="" /></div><div class="ulredit_newvalues" id="'+fieldid+'-newvalues"><input type="hidden" name="'+fieldid+'-newvaluecount" id="'+fieldid+'-newvaluecount" value="0" /></div><div class="ulredit_add"><button type="button" onclick="javascript:ulredit_addnewvalue(\''+fieldid+'\',\'auto\')">Add a new value</button></div>';
	parentdiv.appendChild(newchild);
}

function ulredit_addnewvalue(fieldid, itemtype) {
	var raw = document.getElementById("template_options_lang").value;
	raw = raw.split('^');
	var langoptions = '';
	for (i = 0; i < raw.length; i++) {
		raw2 = raw[i].split(':');
		langoptions = langoptions + '<option value="'+raw2[0]+'">'+raw2[1] + '</option>';
	}
	if (itemtype == 'auto') {
		itemtype = document.getElementById(fieldid + "-type").value;
	}
	raw = document.getElementById("template_options_valuetype_" + itemtype).value;
	raw = raw.split('^');
	var valuetypeoptions = '';
	for (i = 0; i < raw.length; i++) {
		raw2 = raw[i].split(':');
		valuetypeoptions = valuetypeoptions + '<option value="'+raw2[0]+'">'+raw2[1] + '</option>';
	}

	var counterfield = document.getElementById(fieldid + "-newvaluecount");
	counterfield.value = eval(counterfield.value) + 1;
	var counter = counterfield.value;
	var parentdiv = document.getElementById(fieldid + "-newvalues");

	//we can't directly modify the parentdiv's innerHTML cause that would erase all input values. Using a partial DOM solution instead:
	var newchild = document.createElement('div');
	newchild.setAttribute('class','ulredit_newvalue');
	newchild.innerHTML = '<span class="num">#'+counter+'</span><table><tr><td class="col1">Value Type: </td><td class="col2"><select name="'+fieldid+'-newvalue-'+counter+'-valuetype" id="'+fieldid+'-newvalue-'+counter+'-valuetype" onchange="javascript:ulredit_typechange(\''+fieldid +'\', '+counter+')">'+valuetypeoptions+'</select></td></tr><tr><td class="col1">Language: </td><td class="col2"><select name="'+fieldid+'-newvalue-'+counter+'-lang">'+langoptions+'</select></td></tr><tr><td class="col1">Value: </td><td class="col2"><div id="'+fieldid+'-newvalue-'+counter+'-valuecontainer" class="addvaluecontainer"><textarea name="'+fieldid+'-newvalue-'+counter+'-value" rows="3"></textarea></div></td></tr></table>';
	parentdiv.appendChild(newchild); 
}

function ulredit_typechange(fieldid,counter) {
	var valuetype = document.getElementById(fieldid + '-newvalue-'+counter+'-valuetype').value;
	var valuecontainer = document.getElementById(fieldid + '-newvalue-'+counter+'-valuecontainer');
	if ((valuetype == "image") || (valuetype == "audio")) {
		valuecontainer.innerHTML = '<input class="ulredit_upload" type="file" name="'+fieldid+'-newvalue-'+counter+'-value" />';
	} else {
		valuecontainer.innerHTML = '<textarea name="'+fieldid+'-newvalue-'+counter+'-value" rows="3"></textarea>';
	}
	
}
