/* ##### The Ray Harryhausen Creature List ##### */
/* ##### 1/2010 ##### */


/* ##### Show info and video for a selected creature, whether clicked or bookmarked ##### */
function show(obj) {

// reset the screen
hide();

// style the selected creature
obj.className = "current";

// update the url so that the creature can be bookmarked or shared
location.hash = obj.getElementsByTagName("a")[1].innerHTML;

// update the page title
document.title = "The Ray Harryhausen Creature List: "+obj.getElementsByTagName("a")[1].innerHTML;

// determine where to put the video
movieContainer = obj.getElementsByTagName("a")[0];

// display the video
movieFile = obj.id+".swf";
movieContainer.innerHTML = "";
mediaContent = "<object classid=\"clsid:d27cdb6e-ae6d-11cf-96b8-444553540000\" codebase=\"http:\/\/download.macromedia.com\/pub\/shockwave\/cabs\/flash\/swflash.cab#version=9,0,0,0\" width=\"200\" height=\"150\" id=\"video\">";
mediaContent += "<param name=\"allowScriptAccess\" value=\"sameDomain\" \/>";
mediaContent += "<param name=\"allowFullScreen\" value=\"false\" \/>";
mediaContent += "<param name=\"movie\" value=\"clips\/"+movieFile+"\" \/>";
mediaContent += "<param name=\"menu\" value=\"false\" \/>";
mediaContent += "<param name=\"quality\" value=\"best\" \/>";
mediaContent += "<param name=\"scale\" value=\"noscale\" \/>";
mediaContent += "<param name=\"bgcolor\" value=\"#ffca1c\" \/>";
mediaContent += "<param name=\"vmode\" value=\"transparent\" \/>";
mediaContent += "<embed src=\"clips\/"+movieFile+"\" menu=\"false\" quality=\"best\" scale=\"noscale\" bgcolor=\"#ffca1c\" width=\"200\" height=\"150\" name=\"video\" align=\"middle\" allowScriptAccess=\"sameDomain\" allowFullScreen=\"false\" vmode=\"transparent\" type=\"application\/x-shockwave-flash\" pluginspage=\"http:\/\/www.adobe.com\/go\/getflashplayer\" \/>";
mediaContent += "<\/object>";
movieContainer.innerHTML = mediaContent;

}

/* ##### Reset the screen ##### */
function hide() {

// reset the page title
document.title = "The Ray Harryhausen Creature List";

// If a creature is selected, restore it to the default view
var obj = document.getElementById("creatureList").getElementsByTagName("li");
for (i=0;i<obj.length;i++) {
	if (obj[i].className == "current") {
		obj[i].className = "";
		obj[i].getElementsByTagName("a")[0].innerHTML = "<img class=\"still\" src=\"images/stills\/"+obj[i].id+".jpg\"\/>";
		}
	}
}

/* ##### When the page loads, check the URL for a creature and display it ##### */
function init() {

if (location.hash) {
	var theList = document.getElementById("creatureList").getElementsByTagName("li");
	for (i=0;i<theList.length;i++) {
		obj = theList[i].getElementsByTagName("a")[1];

		// trim spaces from location.hash to help Safari
		selectedCreature = location.hash.slice(1).replace(/%20/g," ");

		// scroll the page down so that the selected creature is visible, and display the creature's info and video
		if (obj.innerHTML == selectedCreature) {

			// for Safari, Chrome
			document.body.scrollTop = theList[i].offsetTop;
			// for IE and Mozilla
			document.documentElement.scrollTop = theList[i].offsetTop;

			show(theList[i]);
			}
		}
	}
}
window.onload = init;