function getTextArea(dropdownID) {
	return document.getElementById(dropdownID + '_textarea');
}
function getDropdownArea(dropdownID) {
	return document.getElementById(dropdownID + '_dropdownarea');
}

function toggleDropdownArea(event, dropdownID){
	if (getDropdownArea(dropdownID).style.visibility == 'visible')
		hideDropdownArea(dropdownID);
	else
		showDropdownArea(dropdownID);

	event.cancelBubble = true;
}

function showDropdownArea(dropdownID) {
	getTextArea(dropdownID).attributes["class"].value =
		elementStringAdd(getTextArea(dropdownID).attributes["class"].value, "text-area-down");
	getDropdownArea(dropdownID).style.visibility = 'visible';
}

function hideDropdownArea(dropdownID) {
	getTextArea(dropdownID).attributes["class"].value =
		elementStringRemove(getTextArea(dropdownID).attributes["class"].value, "text-area-down");
	getDropdownArea(dropdownID).style.visibility = 'hidden';
}

function mouseOut(event, dropdownID) {
	var ancestor = document.getElementById(dropdownID);
	var descendant = event.toElement ? event.toElement : event.relatedTarget;

	// Check if the 'toElement' is a descendant (inside the dropdown)
	var hide = true;
	while (descendant) {
		if (descendant == ancestor) {
			hide = false;
			break;
		}

		descendant = descendant.parentNode;
	}

	if (hide) {
		window.setTimeout('hideDropdownArea(\'' + dropdownID + '\')', 500);
	}
}