function menuSelect(name) {
	cancelTimer();
	if(document.getElementById(name) != null) {
		Effect.Appear(name, {duration: 0.2});
	}
	if(document.getElementById(selectedMenu) != null && selectedMenu != name) {
		Effect.Fade(selectedMenu);
	}
	selectedMenu = name;
}

function startTimer() {
	timer = setTimeout("menuUnselectSelected();", 1000);
}

function cancelTimer() {
	clearTimeout(timer);
}

function menuUnselectSelected() {
	Effect.Fade(selectedMenu);
}

function menuUnselect(name) {
	if(document.getElementById(name) != null)
		Effect.Fade(name);
}

window.onresize=function() {
	locationLoaded = false;
	positionContent();
}

function setContentPosition() {
	var myWidth = 0, myHeight = 0;
	if( typeof( window.innerWidth ) == 'number' ) {
		//Non-IE
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
		//IE 6+ in 'standards compliant mode'
		myWidth = document.documentElement.clientWidth;
		myHeight = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
		//IE 4 compatible
		myWidth = document.body.clientWidth;
		myHeight = document.body.clientHeight;
	}
	var cLeft = Math.max(10, (myWidth - 900) / 2) + 'px';
	var blLeft = Math.max(10, (myWidth - 900) / 2 + 7) + 'px';
	var cHeight = Math.max(10, ((myHeight - 500) / 2 - 70)) + 'px';
	var bottomLineTop = Math.max(myHeight - 25, 560);
	var myAjax = new Ajax.Request(
		'/set_content_location.php', 
		{
			method: 'get', 
			parameters: 'content_top=' + cHeight + '&content_left=' + cLeft + '&bottom_top=' + bottomLineTop + '&bottom_left=' + blLeft
		});
}

function positionContent() {
	var myWidth = 0, myHeight = 0;
	if( typeof( window.innerWidth ) == 'number' ) {
		//Non-IE
		myWidth = window.innerWidth;
		myHeight = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
		//IE 6+ in 'standards compliant mode'
		myWidth = document.documentElement.clientWidth;
		myHeight = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
		//IE 4 compatible
		myWidth = document.body.clientWidth;
		myHeight = document.body.clientHeight;
	}
	var cLeft = Math.max(10, (myWidth - 900) / 2) + 'px';
	var blLeft = Math.max(10, (myWidth - 900) / 2 + 7) + 'px';
	var cHeight = Math.max(10, ((myHeight - 500) / 2 - 70)) + 'px';
	document.getElementById("content").style.left = cLeft;
	document.getElementById("content").style.top = cHeight;

	if(document.getElementById("bottom_line") != null) {
		var bottomLineTop = Math.max(myHeight - 25, 560);
		document.getElementById("bottom_line").style.top = bottomLineTop + 'px';
		document.getElementById("bottom_line").style.left = blLeft;
	}

	// Send the width and height to the server so the following pages shows up in the right position
	// locationLoaded variable is specified in the html_frame.php value generated based on if
	// the location is already specified or not
	if(!locationLoaded) {
		var myAjax = new Ajax.Request(
			'/set_content_location.php', 
			{
				method: 'get', 
				parameters: 'content_top=' + cHeight + '&content_left=' + cLeft + '&bottom_top=' + bottomLineTop + '&bottom_left=' + blLeft
			});
		
	}
}

function onAppear(first_image, second_image){
	//document.getElementById('output').innerHTML += first_image +' '+ second_image +'<hr>'

	// swap the images so that the one that has been faded in is in the 
	// outer div and the next one to be faded in is waiting in the 
	// invisible inner div...
	document.getElementById("outer-div").style.backgroundImage = 'url('+first_image+')';
	document.getElementById("inner-div").style.display = 'none';
	document.getElementById("inner-div").style.backgroundImage = 'url('+second_image+')';
}


function Appear(pic_one_id, pic_two_id) {
	var one_id, two_id;

	new Effect.Appear('inner-div');

	//pic one becomes pic two, the one that has been morphed to...
	one_id = pic_two_id;

	//if we have come to end of pics array, start from start again...
	if(pic_two_id == imgArray.length-1)
		two_id = 0;
	else
		two_id = pic_two_id+1;

	//document.getElementById('output').innerHTML += one_id +' '+ two_id +'<br>';
	//get the pics to pass to onAppear...
	pic_one = imgArray[one_id];
	pic_two = imgArray[two_id];
	//document.getElementById('output').innerHTML += pic_one.src +' '+ pic_two.src +'<br>';

	setTimeout("onAppear('" + pic_one.src + "', '" + pic_two.src + "')", 4000);
	setTimeout("Appear(" + one_id + ", " + two_id + ")", 5000);
}


function startTimerDisappearMainFilter() {
	mainFilterTimer = setTimeout("disappearMainFilter();", 1000);
}

function cancelTimerDisappearMainFilter() {
	clearTimeout(mainFilterTimer);
}

function disappearMainFilter() {
	document.getElementById('filter_main').style.display = 'none';
}

function startTimerDisappearInstructorFilter() {
	instructorFilterTimer = setTimeout("disappearInstructorFilter();", 500);
}

function cancelTimerDisappearInstructorFilter() {
	clearTimeout(instructorFilterTimer);
}

function disappearInstructorFilter() {
	document.getElementById('filter_instructor').style.display = 'none';
}

function startTimerDisappearClassTypeFilter() {
	classTypeFilterTimer = setTimeout("disappearClassTypeFilter();", 500);
}

function cancelTimerDisappearClassTypeFilter() {
	clearTimeout(classTypeFilterTimer);
}

function disappearClassTypeFilter() {
	document.getElementById('filter_class_type').style.display = 'none';
}

function highlightClass() {
	cancelHighlightClass();
	for( var i = 0; i < arguments.length; i++ ) {
		document.getElementById(arguments[i]).style.backgroundColor = '#929800';
		document.getElementById(arguments[i]).style.color = '#FFFFFF';
	}
	document.getElementById('filter_main').style.display = 'none';
	document.getElementById('filter_instructor').style.display = 'none';
	document.getElementById('filter_class_type').style.display = 'none';
	document.getElementById('filter_btn').style.display = 'none';
	document.getElementById('filter_off_btn').style.display = 'inline';
}

function cancelHighlightClass() {
	var allHTMLTags = document.getElementsByTagName("*");
	var idx = 0;
	for (i=0; i<allHTMLTags.length; i++) {
		if (allHTMLTags[i].className=='one_class') {
			allHTMLTags[i].style.backgroundColor = '#DFD8C8';
			allHTMLTags[i].style.color = '#323232';
		}
	}
}

function filterOff() {
	cancelHighlightClass();
	document.getElementById('filter_off_btn').style.display='none';
	document.getElementById('filter_btn').style.display='inline';
}