window.onload = init;//call init function after the window has loaded
var NS = "http://www.w3.org/1999/xhtml";//NameSpace

function init() {
	/*Called after the page has loaded.
	*Hides all quotes, displays the show/hide quote-links and assigns click EventListeners to them.
	Visitors without JavaScript see all quotes and no show/hide links.*/
	
	//Hide all quotes after the page has loaded:
	var divs = document.getElementsByTagNameNS(NS, "div");//get all div elements
	for(var i = 0; i < divs.length; i++) {//iterate through all div elements
		if(divs[i].getAttributeNS(null, "class") == "show") {//if the div's class is "show"
			divs[i].setAttributeNS(null, "class", "hide");//set the div's class to "hide"
		}
	}
	//Display all "Show/Hide quote"-switches after the page has loaded, and add click EventListeners:
	var spans = document.getElementsByTagNameNS(NS, "span");//get all span elements
	for(var i = 0; i < spans.length; i++) {//iterate through all span elements
		if(spans[i].getAttributeNS(null, "class") == "hide") {//if the span's class is "hide"
			spans[i].setAttributeNS(null, "class", "show");//set the span's class to "show"
			spans[i].addEventListener("mouseover", addBorder, true);
			spans[i].addEventListener("mouseout", removeBorder, true);
			spans[i].addEventListener("click", showHideQuotes, true);//add a click EventListener that calls "showHideQuotes" whenever the link is clicked
		}
	}
}

function changeAnchorText(span) {
	var anchorText = span.firstChild.firstChild.nodeValue;
	if(anchorText == "Show") {
		anchorText = "Hide";
	}
	else {
		anchorText = "Show";
	}
	span.firstChild.firstChild.nodeValue = anchorText;
}

function addBorder(evnt) {
	var clickedElem = evnt.currentTarget;//get the element (a span element)
	var quotes = clickedElem.parentNode.nextSibling;//get the next sibling of the clicked element's parent node
	while(quotes.nodeName != "div") {//as long as the node is not a div (it could be #text [whitespace] instead)
		quotes = quotes.nextSibling;//get the next sibling
	}
	quotes.setAttributeNS(null, "style", "border:1px solid #FC0;");
}

function removeBorder(evnt) {
	var clickedElem = evnt.currentTarget;//get the element (a span element)
	var quotes = clickedElem.parentNode.nextSibling;//get the next sibling of the clicked element's parent node
	while(quotes.nodeName != "div") {//as long as the node is not a div (it could be #text [whitespace] instead)
		quotes = quotes.nextSibling;//get the next sibling
	}
	if(quotes.hasAttributeNS(null, "style")) {
		quotes.removeAttributeNS(null, "style");
	}
}

function showHideQuotes(evnt) {
	/*function that is called by clicking on a "Show/Hide"-link.
	 Shows or hides div sections depending on whether they're currently displayed or hidden.*/
	var clickedElem = evnt.currentTarget;//get the element (a span element)
	changeAnchorText(clickedElem);//change text to either "Show" or "Hide"
	var quotes = clickedElem.parentNode.nextSibling;//get the next sibling of the clicked element's parent node
	while(quotes.nodeName != "div") {//as long as the node is not a div (it could be #text [whitespace] instead)
		quotes = quotes.nextSibling;//get the next sibling
	}
	if(quotes.getAttributeNS(null, "class") == "hide") {//if the class is "hide" the quotes are currently hidden
		showElement(quotes);//call function to display the element
	}
	else {//if the class is not "hide", i.e. "show"
		hideElement(quotes);//call function to hide the element
	}
	evnt.preventDefault();//stay where you are and don't go to the clicked href location!
}

function showElement(elem) {
	//function that displays an element by assigning it the CSS "show" class
	elem.setAttributeNS(null, "class", "show");
}

function hideElement(elem) {
	//function that hides an element by assigning it the CSS "hide" class
	elem.setAttributeNS(null, "class", "hide");
}