/*  This script, showBio.js, was written by Todd Skoglund for the website BackBayYoga.com.  It is meant to display and hide bio information about individual teachers when a thumbnail image is selected */

function prepareBios() { 
	if (!document.getElementsByTagName) return false;  //tests the browser's js support
	if (!document.getElementById) return false; //tests the browser's js support
	if (!document.getElementById("teacherThumbs")) return false; //tests for the existence of a teacherThumbs element, essential to the proper working of the script
	if (document.getElementById("back")) {
		document.getElementById("back").style.display = "none";
	}
	if(document.getElementById("inside-content")) {
		document.getElementById("inside-content").style.backgroundImage = "url(images/textback-tall.jpg)";
		document.getElementById("inside-content").style.height = "900px";
	}
	var thumbs = document.getElementById("teacherThumbs"); // gets the element teacherThumbs
	var links = thumbs.getElementsByTagName("a"); // makes an array of all the links in the parent element of thumbs
	for ( var i=0; i < links.length; i++) {	// loops through all the links in teacherThumbs and assigns an event handler (onclick) to each link that calls the next function showBio with the element with the id of the link's title
		var name = links[i].getAttribute("title"); // finds the title attribute of each link
		var bio = document.getElementById(name); // gets the element with the id equal to the title attribute of the clicked link
		bio.style.display = "none"; // hides the bio content so that if no JS is present, the page displays with full content
		links[i].onclick = function() { // creates an onclick event handler for each link and assigns it to call the showContent function with the clicked link as an argument
			return showBio(this); // runs the showContent with the current clicked link as the argument
		}
	}
	if (document.getElementById("showAll")) { // activates the showAll and hideAll links
		var ele = document.getElementById("showAll");
		document.getElementById("hideAll").style.display = "none";
		ele.style.display = "block";
		var showlink = ele.getElementsByTagName("a");
		showlink[0].onclick = function() { // attributes the onclick behavior to the showAll link and calls teh showAll function
			return showAll();
		}
	}
}

/* this function makes the chosen element display and then makes sure all the other elements remain hidden */
function showBio(whichbio) {
	var id = whichbio.getAttribute("title");
	var content = document.getElementById(id);
	content.style.display = "block";
	document.getElementById("hideAll").style.display = "none";
	document.getElementById("back").style.display = "block";
	var thumbs = document.getElementById("teacherThumbs");
	var links = thumbs.getElementsByTagName("a");
	for ( var i=0; i < links.length; i++) {	//this loops through the elements named by the titles in subNav (just like the loop in prepareNav) but compares the elements to the current clicked one to make sure any previously displayed elements are hidden again.
		var name = links[i].getAttribute("title"); 
		var bio = document.getElementById(name);
		if (bio != content) {
			bio.style.display = "none";
		}
	}
	document.getElementById("showAll").style.display = "block";
	return false; // makes sure the link doesn't get "clicked" (the browser doesn't follow the href)
}


function showAll() { // this displays all the bios if the showAll link is clicked
	document.getElementById("inside-content").style.backgroundImage = "url(images/textback-tall.jpg)";
	document.getElementById("inside-content").style.height = "100%";
	document.getElementById("back").style.display = "block";
	var thumbs = document.getElementById("teacherThumbs"); // gets the element teacherThumbs
	var links = thumbs.getElementsByTagName("a"); // makes an array of all the links in the parent element of thumbs
	for ( var i=0; i < links.length; i++) {	// loops through all the links in teacherThumbs and assigns an event handler (onclick) to each link that calls the next function showBio with the element with the id of the link's title
		var name = links[i].getAttribute("title"); // finds the title attribute of each link
		var bio = document.getElementById(name); // gets the element with the id equal to the title attribute of the clicked link
		bio.style.display = "block"; // makes sure all the bios are visible
	}
	document.getElementById("showAll").style.display = "none"; // hides the showAll link once it's been used
	if (document.getElementById("hideAll")) {
		var hidey = document.getElementById("hideAll"); 
		hidey.style.display = "block"; // displays the hideAll link if the showAll link has been clicked
		var hidelink = hidey.getElementsByTagName("a");
		hidelink[0].onclick = function() { //gives the hideAll link the onclick behavior and summons the hideAll function when clicked
			return hideAll();
		}
	}
	return false;
}

function hideAll() { // this function hides all the bio info when hideAll link has been clicked
	document.getElementById("inside-content").style.backgroundImage = "url(images/textback-bio.jpg)";
	document.getElementById("inside-content").style.height = "696px";
	document.getElementById("back").style.display = "none";
	var thumbs = document.getElementById("teacherThumbs"); // gets the element teacherThumbs
	var links = thumbs.getElementsByTagName("a"); // makes an array of all the links in the parent element of thumbs
	for ( var i=0; i < links.length; i++) {	// loops through all the links in teacherThumbs and assigns an event handler (onclick) to each link that calls the next function showBio with the element with the id of the link's title
		var name = links[i].getAttribute("title"); // finds the title attribute of each link
		var bio = document.getElementById(name); // gets the element with the id equal to the title attribute of the clicked link
		bio.style.display = "none"; // changes the bio display to none
	}
	document.getElementById("showAll").style.display = "block"; // shows the showAll link again
	document.getElementById("hideAll").style.display = "none"; // hides the hideAlll link
	return false;
}

function prepareLoad() { 
	simplePreload( '');
}



function simplePreload() {
	var args = simplePreload.arguments;
	document.imageArray = new Array( args.length );
	for(var i = 0; i < args.length; i++ ) {
		document.imageArray[i] = new Image;
		document.imageArray[i].src = args[i];
	}
}

/* this is just a handy generic trick to allow you to add to the list at the bottom of this page to begin any number of functions when the page loads */ 
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

/* the following command begins the following list of scripts after the page has loaded. You can add as many as you want thanks to the above addLoadEvent script */
addLoadEvent(prepareLoad);
addLoadEvent(prepareBios);