//functions to show and hide border
var curId = 0;

function showBorder(obj) {	
	if (obj.className == "thumb selected")
		return;		
}

function showTab(id) {
	updateSlides(id);
	updateThumbs(id);
	updateImage(id);
	curId = id;
}

function nextSlide() {	showTab(curId + 1); }

function prevSlide() {	showTab(curId - 1); }

function updateSlides(id) {	
	var slideobj = document.getElementById("slides");
	if (!slideobj)
		return;

	var divs = slideobj.getElementsByTagName("div");
	var slides = new Array();
	
	// go through all divs, and if they are a slide, store them in the slides array
	for (var i=0; i < divs.length; i++) {
		if (divs[i].className == "slide" || divs[i].className == "slide firstslide"){
			slides.push(divs[i]);
			divs[i].style.display = "none";
		}
	}	
	
	// then just display the current slide
	
	slides[id].style.display = "block"; 		
	var prevButton = document.getElementById("previous");
	if (!prevButton)
		return;
		
	//show and hide previous and next buttons in top ten module		
	if (id!=0){		
		prevButton.style.display = "block";
		document.getElementById("previous_inactive").style.display = "none";
	} else {
		prevButton.style.display = "none";
		document.getElementById("previous_inactive").style.display = "block";
	}
	
	var nextButton = document.getElementById("next");
	if (!nextButton)
		return;
	
	if (id!=slides.length-1){		
		nextButton.style.display = "block";
		document.getElementById("next_inactive").style.display = "none";
	} else {
		nextButton.style.display = "none";
		document.getElementById("next_inactive").style.display = "block";
	}
	
}

function updateThumbs(id) {	
	// update the thumbnails
	var thumbobj = document.getElementById("thumbs");
	if (!thumbobj)
		return;

	var divs = thumbobj.getElementsByTagName("div");
	var thumbs = new Array();
	
	// go through all divs, and if they are a thumb, store them in the thumbs array
	for (var i=0; i < divs.length; i++) {
		if (divs[i].className == "thumb" || divs[i].className == "thumb selected"){
			thumbs.push(divs[i]);
			divs[i].className = "thumb";
		}
	}
	// then just select the current thumb
	showBorder(thumbs[id]);
	thumbs[id].className = "thumb selected";
}


function updateImage(id) {	

	var imageobj = document.getElementById("images");
	if (!imageobj)
		return;

	var divs = imageobj.getElementsByTagName("div");
	var images = new Array();

	// go through all divs
	for (var i=0; i < divs.length; i++) {
		if (divs[i].className == "image" || divs[i].className == "image firstimage")
			images.push(divs[i]);
	}

	// go through the slide array and hide all of the images first
	for (var i=0; i < images.length; i++) {
		images[i].style.display = "none";
		
	}
	
	// then just display the current image
	images[id].style.display = "block"; 		
}

// code for Image Gallery
var curImg = 1;
var slides = [];

function nextImage( ) {
	curImg++;
	updateImages();
}
function prevImage( ) {
	curImg--;
	updateImages();
}

function initImageGallery(){
	var slideobj = $("items");
	if (!slideobj)
		return;
		
	var divs = $("items").getElementsByTagName("div");
	slides.push([$("i_container").innerHTML, $("t_container").innerHTML]);
	for (var i=0, n=0; i < divs.length; i++) {
		if (divs[i].className == "slide"){
			slides.push([$("image_"+n).innerHTML, $("text_"+n).innerHTML, $("enlarge_"+n).innerHTML]);
			n++;
		}
	}
	Element.update('curImage', "Image "+(curImg)+" of "+slides.length);
	var b = $("bar").getElementsByTagName("img");
	b[0].setAttribute('width',(1/slides.length)*142);
	
}

function updateImages() {
	// update the current image number showing
	var id=curImg-1;
	Element.update('i_container', slides[id][0]);
	Element.update('t_container', slides[id][1]);
	Element.update('enlarge', slides[id][2]);
	Element.update('curImage', "Image "+(curImg)+" of "+slides.length);
	
	var b = $("bar").getElementsByTagName("img");
	b[0].setAttribute('width',(curImg/slides.length)*142);
	
	
	
	//show and hide previous and next buttons in top ten module
	var prevButton = $("prev");
	var prevButtonInactive = $("prev_inactive");
	if (!prevButton)
		return;
		
	if (id!=0){		
		prevButton.style.display = "block";
		prevButtonInactive.style.display= "none";
	} else {
		prevButton.style.display = "none";
		prevButtonInactive.style.display= "block";
	}
	
	var nextButton = $("next");
	var nextButtonInactive = $("next_inactive");
	if (!nextButton)
		return;
	
	if (id!=slides.length-1) {		
		nextButton.style.display = "block";
		nextButtonInactive.style.display= "none";
	} else {
		nextButton.style.display = "none";
		nextButtonInactive.style.display= "block";
	}
	
}

var hb_item;

function close_hotbox(){
	var old = $("hb_tab");
	Element.remove(old);
	Element.setStyle(hb_item,{display:'none'});
}
function open_hotbox(n){
	n--;
	
	var r = $("related_resource");
	var old = $("hb_tab");
	
	if(old) {
		close_hotbox();
	}
	
	var hb = document.getElementsByClassName("hotbox");
	hb_item = hb[n];
	
	var text = document.getElementsByClassName("text");
	var rr = r.getElementsByTagName("li");
	
	
	Element.setStyle(hb_item,{display:'block'});
	t = text[0].offsetTop+5;
	l = (text[0].offsetLeft+text[0].offsetWidth) - 270;
	h = rr[n].offsetTop-13;
	
	Element.setStyle(hb_item,{left:l+"px"});
	Element.setStyle(hb_item,{top:t+"px"});
	
	
	var objTab = document.createElement("div");
		objTab.setAttribute('id','hb_tab');
		objTab.setAttribute('class','hb_tab');
		objTab.style.left = (r.offsetLeft-16)+"px";
		objTab.style.top = h+"px";
		objTab.innerHTML = rr[n].innerHTML;
		r.appendChild(objTab);
}

