function login() {
	var ele = document.getElementById("toggleText");
	var text = document.getElementById("displayText");
	var ele2 = document.getElementById("toggleText2");
	var text2 = document.getElementById("displayText2");
	var ele3 = document.getElementById("toggleText3");
	var text3 = document.getElementById("displayText3");
	if(ele.style.display == "block") {
    	ele.style.display = "none";
		text.innerHTML = "Login";
  	}
	else {
		ele.style.display = "block";
		text.innerHTML = "Hide login";
    	ele2.style.display = "none";
		text2.innerHTML = "Join";
    	ele3.style.display = "none";
		text3.innerHTML = "Search";
		initFormUserField()
	}
}

function register() {
	var ele = document.getElementById("toggleText");
	var text = document.getElementById("displayText");
	var ele2 = document.getElementById("toggleText2");
	var text2 = document.getElementById("displayText2");
	var ele3 = document.getElementById("toggleText3");
	var text3 = document.getElementById("displayText3");
	if(ele2.style.display == "block") {
   		ele2.style.display = "none";
		text2.innerHTML = "Join";
  	}
	else {
   		ele.style.display = "none";
		text.innerHTML = "Login";
		ele2.style.display = "block";
		text2.innerHTML = "Hide registration form";
    	ele3.style.display = "none";
		text3.innerHTML = "Search";
		initFormFieldFocus()
	}
}

function search() {
	var ele = document.getElementById("toggleText");
	var text = document.getElementById("displayText");
	var ele2 = document.getElementById("toggleText2");
	var text2 = document.getElementById("displayText2");
	var ele3 = document.getElementById("toggleText3");
	var text3 = document.getElementById("displayText3");
	if(ele3.style.display == "block") {
    	ele3.style.display = "none";
		text3.innerHTML = "Search";
  	}
	else {
    	ele.style.display = "none";
		text.innerHTML = "Login";
    	ele2.style.display = "none";
		text2.innerHTML = "Join";
		ele3.style.display = "block";
		text3.innerHTML = "Hide search";
		initFormUserField()
	}
}

function search2() {
	var ele = document.getElementById("toggleText3");
	var text = document.getElementById("displayText3");
	if(ele.style.display == "block") {
    	ele.style.display = "none";
		text.innerHTML = "Search";
  	}
	else {
		ele.style.display = "block";
		text.innerHTML = "Hide search";
		initFormUserField()
	}
}

window.onload=initFormFieldFocus;

function initFormUserField()
{
	focusField(document.getElementById("userfield"));
	return true;
}

function initFormFieldFocus()
{
	focusField(document.getElementById("focus"));
	return true;
}

function focusField(target)
{
	// The form elements that will be tested. Anything with a dot indicates the "type" attribute of the element
	var formElements = ["input.text", "input.checkbox", "input.radio", "select", "textarea"];
	var selectedNode = null;

	// IE's selection method
	if (typeof document.selection != "undefined" && document.selection != null && typeof window.opera == "undefined")
	{
		var theSelection = document.selection;
		var textRange = document.selection.createRange();

		selectedNode = textRange.parentElement();
	}
	// W3 selection method. Currently only Mozilla & Safari support it. However, neither of them support ranges inside form objects, so this part is redundant. Merely included in case they decide to include support in the future
	else if (typeof window.getSelection != "undefined")
	{
		var theSelection = window.getSelection();

		// The Safari way to get the node that a selection starts in
		if (typeof theSelection.baseNode != "undefined")
		{
			selectedNode = theSelection.baseNode;
		}
		// The Mozilla way to get the node that a selection starts in
		else if (typeof theSelection.getRangeAt != "undefined" && theSelection.rangeCount > 0)
		{
			selectedNode = theSelection.getRangeAt(0).startContainer;
		}
	}

	// If a selected node was found above, check whether it's a selection inside one of the specified form element types
	if (selectedNode != null)
	{
		for (var i = 0; i < formElements.length; i++)
		{
			if (selectedNode.nodeName.toLowerCase() == formElements[i].replace(/([^.]*)\..*/, "$1"))
			{
				return false;
			}
		}
	}

	var forms = document.forms;

	// Do a check of each form element on the page. If one of them has a value, do not focus
	for (var i = 0; i < forms.length; i++)
	{
		var formElements = forms[i];

		for (var j = 0; j < formElements.length; j++)
		{
			if (formElements[j].getAttribute("type") == "checkbox" || formElements[j].getAttribute("type") == "radio")
			{
				if (formElements[j].checked != formElements[j].defaultChecked)
				{
					return false;
				}
			}
			else
			{
				if (typeof formElements[j].defaultValue != "undefined" && formElements[j].value != formElements[j].defaultValue)
				{
					return false;
				}
			}
		}
	}

	// If no form elements were found to be focused -- or with values -- go ahead and focus
	target.focus();

	return false;
}