/**
* Sets up the necessary variables to get goNext() and goPrev() to work
*/
var d = document;
var browseDivPos = 0;
var curDesc = 0;
var rate = 1; //minimum of one. how many items the viewer scrolls by at a time.
//makes sure that the user cannot click "Next" or "Prev" while the scrolling is in motion.
var notMoving = true;
var itemWidth = 186;


//pops up the contact page
function popup_contact() {
	window.open('contact.php','Contact','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=540,height=560');
	return false;
}

//pops up any page when the url is passed
function popup(thePage) {
	window.open(thePage,'','toolbar=0,scrollbars=1,location=0,statusbar=0,menubar=0,resizable=1,width=640,height=580');
	return false;
}

//an easing function from shiriru.blogspot.com
function moveTo(elm,dist) {
	notMoving = false;
	var x=parseInt(elm.style.marginLeft);
	var distance=dist-x;
	//6 is an arbitrary number. the larger the number, the longer it takes to move
	var tot=x+Math.floor(distance/6);
	elm.style.marginLeft=tot+'px';
	function c() {
		moveTo(elm,dist);
	}
	if(distance==0) {
		if(timer) {
			clearTimeout(timer);
			notMoving = true;
			return;
		}
	}
	timer=setTimeout(c,33);
}

/*
* @id			the id of the target object
* @speed		the interval at which the fade function is called
* @duration	amount of time it takes to fade
* @whichWay	either "in" (0 to 1) or "out" (1 to 0)
* @opacity		opacity to set
* @ftimer		timer; speed is subtracted each loop. should start as zero, so it can be set 
*/
function opacity(id, speed, duration, whichWay, ftimer) {
	var object = d.getElementById(id);
	//sets the ftimer for all following opacity function calls
	if (typeof(ftimer) == "undefined" || ftimer == 0) {ftimer = duration;}
	
	//stops the process before the timer goes below zero
	if (ftimer-speed > 0) {
		//update the timer 'ftimer'
		ftimer -= speed;
		var opacity;
		
		if (whichWay == "in") {
			opacity = (1-(ftimer / duration) ).toFixed(3);
		}
		else if (whichWay == "out") {
			opacity = (ftimer / duration).toFixed(3);
		}
		
		object.style.opacity = opacity;
		object.style.MozOpacity = opacity;
		object.style.KhtmlOpacity = opacity;
		object.style.filter = "alpha(opacity=" + opacity*100 + ")";
		
		fadeTimer = setTimeout("opacity('" + id + "', " + speed + ", " + duration + ", '" + whichWay + "', " + ftimer + ")", speed);
	} else if(whichWay == "in") {
		//if the fading has stopped, and which way is in, remove the style tag. should only be used on things with opacity as the only inline style
		object.removeAttribute("style");
	}
}

//change the opacity for different browsers
function changeOpac(opacity, id) {
    var object = d.getElementById(id).style;
    object.opacity = (opacity / 100);
    object.MozOpacity = (opacity / 100);
    object.KhtmlOpacity = (opacity / 100);
    object.filter = "alpha(opacity=" + opacity + ")";
} 

//key finding function from javascriptsearch.com/tutorials
//returns which arrow, or if enter was pressed
function pressArrows(oEvent) {
	if(window.event) {
		switch(oEvent.keyCode) {
		    case 38: //up arrow
				//goPrev();
				break;
			case 37: //left arrow
				goPrev();
				break;
		    case 40: //down arrow
				//goNext();
				break;
			case 39: //right arrow
				goNext();
				break;
		    case 13: //enter
				break;
		}
	} else if(oEvent.which) {
		switch(oEvent.which) {
		    case 38: //up arrow
				//goPrev();
				break;
			case 37: //left arrow
				goPrev();
				break;
		    case 40: //down arrow
				//goNext();
				break;
			case 39: //right arrow
				goNext();
				break;
		    case 13: //enter
				break;
		}
	}
}

//function that allows you to retrieve applied stylesheet styles
// oElm is the object (document.getElementById("object") )
// strCssRule is the rule to look for (font-size) (margin-left)
// returns the result in string format
/*
function getStyle(oElm, strCssRule){
	var strValue = "0";
	if(d.defaultView && d.defaultView.getComputedStyle){
		strValue = d.defaultView.getComputedStyle(oElm, "").getPropertyValue(strCssRule);
	}
	else if(oElm.currentStyle){
		strCssRule = strCssRule.replace(/\-(\w)/g, function (strMatch, p1){
			return p1.toUpperCase();
		});
		strValue = oElm.currentStyle[strCssRule];
	}
	return strValue;
}
*/

/**
* These functions are used specifically for the browsing of events.
* They allow for the scrolling left and right of each item
*/
function goPrev() {
	browseDivPos += rate*itemWidth;
	curDesc--;
	if (browseDivPos >= 1){
		d.getElementById("scroll").style.marginLeft = (-1*(d.getElementById("scroll").clientWidth - 3*itemWidth))+"px";
		browseDivPos = -1*(d.getElementById("scroll").clientWidth - 4*itemWidth);
		curDesc = (d.getElementById("scroll").clientWidth - 4*itemWidth)/itemWidth;
	}
	if (notMoving == true) {
		moveTo(d.getElementById("scroll"),browseDivPos);
		//moveTo(d.getElementById("description"), descPos);
	}
	else {
		clearTimeout(timer);
		clearTimeout(fadeTimer);
		moveTo(d.getElementById("scroll"),browseDivPos);
		//moveTo(d.getElementById("description"), descPos);
	}
	if (curDesc == (d.getElementById("scroll").clientWidth - 4*itemWidth)/itemWidth) {
		//d.getElementById("desc0").style.display = "none";
	}
	//if the curDesc is 0 but the browseDivPos isn't 0
	else if (curDesc == -1) {
		curDesc = (d.getElementById("scroll").clientWidth - 4*itemWidth)/itemWidth;
		//d.getElementById("desc0").style.display = "none";
	}
	else {
		//d.getElementById("desc"+String(curDesc+1)).style.display = "none";
	}
	changeOpac(0, ("desc"));
	loadContent(curDesc);
	opacity(("desc"), 33, 700, "in", 0);
	
	//id, speed, duration, whichWay, opacity, ftimer
	//opacity(("desc"+curDesc), 33, 400, "in", 0);
	//d.getElementById("desc"+curDesc).style.display = "block";
}

function goNext() {
	browseDivPos -= rate*itemWidth;
	curDesc++;
	
	if (browseDivPos <= -1*d.getElementById("scroll").clientWidth+(itemWidth*2) ){
		d.getElementById("scroll").style.marginLeft = 0;
		browseDivPos = -1*itemWidth;
		curDesc = 1;
	}
	else if (browseDivPos <= -1*d.getElementById("scroll").clientWidth+(itemWidth*3) ){
		curDesc = 0;
	}
	if (notMoving == true) {
		moveTo(d.getElementById("scroll"),browseDivPos);
		//moveTo(d.getElementById("description"), descPos);
	}
	else {
		clearTimeout(timer);
		clearTimeout(fadeTimer);
		moveTo(d.getElementById("scroll"),browseDivPos);
		//moveTo(d.getElementById("description"), descPos);
	}
	if (curDesc == 0) {
		//d.getElementById("desc"+(d.getElementById("scroll").clientWidth - 4*itemWidth)/itemWidth).style.display = "none";
	}
	else {
		//d.getElementById("desc"+String(curDesc-1)).style.display = "none";
	}
	changeOpac(0, ("desc"));
	loadContent(curDesc);
	opacity(("desc"), 33, 700, "in", 0);
	
	//id, speed, duration, whichWay, opacity, ftimer
	//opacity(("desc"+curDesc), 33, 700, "in", 0);
	//d.getElementById("desc"+curDesc).style.display = "block";
}

function loadContent(num) {
	d.getElementById("desc-title").innerHTML = data[num]["name"];
	d.getElementById("desc-title-img").src = "images/title-"+data[num]["src"]+".gif";
	d.getElementById("desc-title-img").alt = data[num]["name"];
	d.getElementById("desc-text").innerHTML = data[num]["desc"];
}