function goSite(stid)
{
	if (stid == 'OKCE' || stid == 'OKCN' || stid == 'OKCW' || stid == 'SPEN') {
		document.location.href= "http://www.mesonet.org/sites/sitedescription.php?site=" + stid;
	} else {

		document.getElementById("site_box_area").style.visibility = "visible";
		blackFade();
		
		reloadSiteBox(stid);
	}
}

function closeSiteBox()
{

	document.getElementById("site_box_area").style.visibility = "hidden";
	document.getElementById("site_select_area").style.display = "block";
	
}

var siteDirection = "N_"

function goCompass(direction)
{

	document.getElementById("compass_direction").style.backgroundImage = "url(images/site_box_compass_" + direction + ".jpg)";
	
	document.getElementById("site_image_N_").style.display = "none";
	document.getElementById("site_image_S_").style.display = "none";
	document.getElementById("site_image_E_").style.display = "none";
	document.getElementById("site_image_W_").style.display = "none";
	document.getElementById("site_image_NW").style.display = "none";
	document.getElementById("site_image_NE").style.display = "none";
	document.getElementById("site_image_SW").style.display = "none";
	document.getElementById("site_image_SE").style.display = "none";

	document.getElementById("site_image_" + direction).style.display = "block";

	siteDirection = direction;

}

function goLargerSiteImage()
{

	var selectedSite = "site_image_value_" + siteDirection;

	//alert(selectedSite);
	//alert(document.site_image_form_values.elements[selectedSite].value);
	
	siteWindowURL = document.site_image_form_values.elements[selectedSite].value;

	window.open(siteWindowURL,'OKCnet_Sites','width=800,height=600');

}

function blackFade()
{
	// setPage calculates absolute values for page element widths and heights
	// different calculations are needed for different elements bases on which page is active
	
	var window_height		= 0;
	var window_width		= 0;
	var window_scroll_y		= 0;
	var site_box_left		= 0;
	var site_box_top		= 0;
	
	
	//get size of the height and width of the box  and then half it later to find the center;
	var box_height = getProperty(document.getElementById("site_box"),"height","height");
	var box_width = getProperty(document.getElementById("site_box"),"width","width");
	
	box_height = parseInt(box_height.split("px")[0]);
	box_width = parseInt(box_width.split("px")[0]);
	
	// get the current width and height of the browser window
	if ( navigator.appName.indexOf("Microsoft") != -1 ) {
		window_height = document.documentElement.clientHeight;
		window_width  = document.documentElement.clientWidth;
		
		//check if IE6 in Strict mode
		var iebody = (document.compatMode && document.compatMode != "BackCompat") ? document.documentElement : document.body;
		
		//get the amount of pixels scrolled
		window_scroll_y = iebody.scrollTop;
		
	} else {
		window_height = window.innerHeight;
		window_width  = window.innerWidth;
		
		//get the amount of pixels scrolled
		window_scroll_y = window.pageYOffset;
		
	}
			
	//calculations (set absolute position of site box)
	site_box_left		= window_width/2 - box_width/2;
	site_box_top		= window_height/2 - box_height/2 + window_scroll_y;

	//get the height of the whole window
	var docHeight = (document.height !== undefined) ? document.height : document.body.offsetHeight;
	var docWidth = (document.width !== undefined) ? document.width : document.body.offsetWidth;
		
	//set new height and width
	document.getElementById('black_fade').style.height = docHeight + 'px';
	document.getElementById('black_fade').style.width = docWidth + 'px';
	
	//place site box
	document.getElementById('site_box').style.left = site_box_left + 'px';
	document.getElementById('site_box').style.top = site_box_top + 'px';
	
	//place site box imagemap
	document.getElementById('site_box_hotspots').style.left = site_box_left + 'px';
	document.getElementById('site_box_hotspots').style.top = site_box_top + 'px';
	
	//remove form for IE 6
	document.getElementById("site_select_area").style.display = "none";
}

//resize the black fade when the window size is changed
window.onresize = blackFade;

//returns a property value in IE and NS6 Format
function getProperty(el, cssproperty, csspropertyNS)
{
	if (el.currentStyle) {
		return el.currentStyle[cssproperty];
	}
	else if (window.getComputedStyle) {
		var elstyle=window.getComputedStyle(el, "");
		return elstyle.getPropertyValue(csspropertyNS);
	}
}

function reloadSiteBox(stid) 
{

	//stid = (stid) ? stid : document.station_form.stid.value;
	
	
	var req = new Request({url: '/okcnet.php/page/site/' + stid, 
		method: 'post',
		data: 'stid=' + stid,
		onSuccess: function(txt) {
			$('site_box').set('html', txt);
		},
		onFailure: function() {
			$('site_box').set('text', 'The request failed.');
		}
	}).send();
	
}
