// JavaScript Document

function addLoadEvent(func) {
// on page load, run function
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

function insertAfter(newElement,targetElement) {
// insert a new element after the 'target' element
  var parent = targetElement.parentNode;
  // find parent node of targetElement and assign its value to variable, parent
  if (parent.lastChild == targetElement) {
    parent.appendChild(newElement);
  } else {
    parent.insertBefore(newElement,targetElement.nextSibling);
  }
}

function createLastListItem () {
// create a list item at the end of each list to go back to the top

	// browser DOM object tests
	if (!document.getElementsByTagName) return false;
	if (!document.getElementById("user_content")) return false;
								 
	// variables
	var listContainer = document.getElementById("user_content");
	var listContainerId = listContainer.getAttribute("id");
	var listTag = "ul";
	var findLists = listContainer.getElementsByTagName(listTag);
	var findListsLength = findLists.length;
	
	for (var e=0; e<findListsLength; e++) {
	// for the number of elements found, get the class attribute, evaluate and if true, then...
	// create a new list item and append the list
		
		// 'for' loop variables
		var getClass = findLists[e].className;
		
		if (getClass == "longlistlinks") {
						
			// 'if' variables
			var listItem = document.createElement("li");
			// create list item
			var listItemLink = document.createElement("a");
			// create link
			var findTopAnchor = document.getElementById("pageContentAnchor");
			// find element with id = pageContentAnchor and assign to variable
			var linkText = findTopAnchor.getAttribute("id");
			var attributeText = "Back to the top";
			var listItemLinkValue = "#" + linkText;
			var listItemText = document.createTextNode(attributeText);
			// set the text value of the list item to the text value of the heading element found in createJumpLinkNav function
			var anchorStyle = "link_to_toc";
			
			listItemLink.setAttribute("href", listItemLinkValue);
			// set href attribute to the id value of findTopAnchor
			listItemLink.setAttribute("title", attributeText);
			// set the listItemLink's title attribute to the value of variable, listItemLinkTitle
			listItemLink.className = anchorStyle;
			//listItemLink.setAttribute("class",attributeText);
			listItemLink.appendChild(listItemText);
			// add the value of the variable listItemText as the text of listItemLink
			//listItem.setAttribute("class", anchorStyle);
			// set the listItem's class attribute
			listItem.appendChild(listItemLink);
			// add the value of the variable listItemLink as the text of listItem
			findLists[e].appendChild(listItem);
		}
	}	
}

function createTOCNav() {
// create a 'table of contents' (list of links) to navigate the page internally based upon the number of h2 element(s)
	
	// browser DOM object tests
	if (!document.getElementsByTagName) return false;
	// if browser does not understand DOM, getElementsByTagName, break out of function
	if (!document.getElementById) return false;
	// if browser does not understand DOM, getElementById, break out of function	
	if (!document.getElementById("user_content")) return false;
	//  test for element with the id value = user_content; if no element, break out of function
	if (!document.getElementById("toc_target")) return false;
	// test for any element with id value set to toc_target; if no element, break out of function
	
	//variables
	var container = document.getElementById("user_content");
	// set variable to desired element with id, user_content
	var targetTag = "h2";
	// set variable to desired target (x)html element
	var tagsFound = container.getElementsByTagName(targetTag); 
	// find all tags  and assign to an array when document is searched for all elements equal to the variable, targetTag
	
	createJumpList();
	// create unordered list
	
	createAnchor(tagsFound);
	// create anchors
	// pass variable, tagsFound, to function createAnchor
		
}

function createJumpList() {
// called from createTOCNav function
//create horizontal unordered list of internal page links based upon number of h2 elements
	
	// variables
	var jumpList = document.createElement("ul");
	// create unordered list
	var targetListTag = document.getElementById("toc_target");
	// set variable to the element with its id attribute value equal to jump_list_target
		
	jumpList.setAttribute("id","toc_horizontal");
	// set the id value of ul
	insertAfter(jumpList,targetListTag);
	// place jumpList after the targetListTag element	
}

function createAnchor(tags) {
// create the anchor or bookmark after each element found
// called from createTOCNav function 
// variable passed to function are assigned to variable, tags...
// e.g. variable, tagsFound, from the function, createTOCNav, are now assigned to variable, tags
	
	for (var i=0; i<tags.length; i++) {
	// for each element found, create an anchor,... 
	// insert the anchor after each element and create a list item 
	
		// variables
		var currentTag = tags[i].firstChild;
		// set variable to the current array element
		var newAnchor = document.createElement("a");
		// create a new element, eg anchor
		if (tags[i].firstChild.nodeType == 3) {
			// if the first child of the tag is a text node, assign the text (value) to a variable
			var tagsTextValue = tags[i].firstChild.nodeValue;
		}
		
		newAnchor.name = tagsTextValue; // works in IE/FF/Opera
		// create the attribute, name, of anchor element and set its value
		newAnchor.id = tagsTextValue; // works in IE/FF/Opera
		// create the attribute, id, of anchor element and set its value
		//newAnchor.setAttribute('name',tagsTextValue);	// works in only FF/Opera
				
		insertAfter(newAnchor,currentTag);
		// insert the new element
		createListItem(tagsTextValue);
		// create new list item for each element found
		// pass the value of tagsTextValue to the function, createListItem
	}
}

function createListItem(linkText) {
// called from createAnchor function
// create list item for each heading element found
// linkText is equal to variable, tagsTextValue, that was set in createAnchor function
	
	// variables
	var listItem = document.createElement("li");
	// create list item
	var listItemLink = document.createElement("a");
	// create link
	var listItemLinkValue = "#" + linkText;
	// equal to the text value of the h2 tag
	var listItemText = document.createTextNode(linkText);
	// set the text value of the list item to the text value of the heading element found in createJumpLinkNav function
	var listItemLinkTitle = "Starts with the letter, ";
	// define title attribute variable
	var getTargetList = document.getElementById("toc_horizontal");
	// find the element (ul) with id equal to targetList and assign to the variable, getTargetList
	
	listItemLink.setAttribute("href", listItemLinkValue);
	// set href attribute to the text value of the h2 tag
	listItemLinkTitle+=linkText; 
	// add the value of the heading element's text value found in createJumpLinkNav function...
	// to the variable listItemLinkTitle
	listItemLink.setAttribute("title", listItemLinkTitle);
	// set the listItemLink's title attribute to the value of variable, listItemLinkTitle
	listItemLink.appendChild(listItemText);
	// add the value of the variable listItemText as the text of listItemLink
	listItem.appendChild(listItemLink);
	// add the value of the variable listItemLink as the text of listItem
	getTargetList.appendChild(listItem);
	// add the value of listItem (li) as a child element of getJumpList (ul)
	
}

addLoadEvent(createTOCNav);  //add window.onload function, createJumpLinkNav
addLoadEvent(createLastListItem); // add window.onload function, createLastListItem