/** This function checks whether a) the browser supports all the necessary DOM needed for scripting and 
	* b) if the browser window is large enough to display it. After evaluating the conditions, the script
	* changes the class of DL and returns either true or false.
	*
	* This function needs to be called when loading the page AND on every dynamic effect, in case the size of the window has changed.
	*/

// cursor position to catch UA's without mouse or similar

function enhance() {
	deflist = document.getElementById("list");
	if (
	document.body.clientWidth > 680 &&
	deflist == document.getElementsByTagName("dl")[0] &&
	(deflist.className == "static" || deflist.className == "dynamic") &&
	deflist.style.top == ""	&&
	deflist.style.display == "" &&
	deflist.getAttribute("id") == "list" &&
	document.getElementsByTagName("dt")[0].offsetTop) {
		dlArray = document.getElementsByTagName("dl");
		for (i = 0; i < dlArray.length; i++) {
			dlArray[i].className = "dynamic";
		}
		return true;
	}
	else {
		dlArray = document.getElementsByTagName("dl");
		for (i = 0; i < dlArray.length; i++) {
			dlArray[i].className = "static";
		}
		// I don't see why the for loop is needed. Just changing the className should make all the dd blocks visible.
		ddArray = document.getElementsByTagName("dd");
		for (i = 0; i < ddArray.length; i++) {
			ddArray[i].style.display = "block";
		}
		return false;
	}
}

/**	This function displays an element with a matching dd as "block", and makes all the other dd's to display="none".
	* The function also calculates the correct top position of the block.
	*/

function showSelected(nimi) {
	if(enhance()) {
		ddArray = document.getElementsByTagName("dd");
		dtArray = document.getElementsByTagName("dt");
		for (i = 0; i < ddArray.length; i++) {
			if (ddArray[i].getAttribute("id") == nimi) {
				ddArray[i].style.display = "block";
				top_position = getOffsetTop(dtArray[i])-80;
				ddArray[i].style.top = top_position + "px";
			}
			else {
				ddArray[i].style.display = "none";
			}
		}
	}
}

function getOffsetTop(element) {
   var offsetValue = 0;
   do {
      offsetValue += element.offsetTop;
      element = element.offsetParent;
   } while (element != document.body && element != null);
   return offsetValue;
}
