var sourceForm;

function initPreview()
{
	if (document.forms.length < 1) return;
	sourceForm = document.forms[0];
	if (!sourceForm.elements["gender"]) return;
	attachPreviewElement("boy");
	attachPreviewElement("girl");
	attachPreviewElement("first");
	attachPreviewElement("second");
	attachPreviewElement("third");
	attachPreviewElement("name");
	attachPreviewElement("wishlist");
	attachPreviewElement("accomplishments");
	attachPreviewElement("ps");
	_update_preview();
}

function attachPreviewElement(id)
{
	var element = document.getElementById(id); if (!element) return;
	element.onchange = _update_preview;
	if (id == "ps")
		element.onkeydown = _preview_change;
}

function _update_preview()
{
	var template;
	for (var i = 0; i < sourceForm.elements["letter"].length; i++)
		if (sourceForm.elements["letter"][i].checked)
			template = document.getElementById("template-" + i);

	if (!template) return;

	var contentBox = document.getElementById("content-box");
	contentBox.innerHTML = template.innerHTML;

	_update_preview_value(contentBox, "kidname", "name", "friend")
	_update_preview_value(contentBox, "kidaccomplishments", "accomplishments", "your accomplishments")
	_update_preview_value(contentBox, "kidwishlist", "wishlist", "gift")
	_update_preview_value(contentBox, "kidgender", "gender")
	_update_preview_value(contentBox, "kidps", "ps", "")



}

function _preview_change()
{     
	if (this.value && this.value.length > 250)
	{
		this.value = this.value.substr(0, 250);
	}
}

function _update_preview_value(box, className, sourceName, defaultValue)
{

	var value = "";
	var element = sourceForm.elements[sourceName];
	                if (!element) alert(sourceName);
	if (element.length > 0)
	{
		for (var i = 0; i < element.length; i++)
			if (element[i].checked) value = element[i].value;
	}
	else
	{
		value = element.value;
		/*if (element.tagName == "INPUT") value = element.value;
		else value = "P.S. " + element.value;*/
	}

	if (value.length == 0) value = defaultValue
	else if (element.tagName == "TEXTAREA")
	{
		if (element.onkeydown) element.onkeydown();
		value = "P.S. " + value;
	}

	
	var SPANs = box.getElementsByTagName("SPAN");

	for (var i = 0; i < SPANs.length; i++)
		if (SPANs[i].className == className)
			SPANs[i].innerHTML = value;
}