// Global variables
var isCSS, isW3C, isIE4, isNN4;

// initialize upon load to let all browsers establish content objects
function initDHTMLAPI() {
    if (document.images) {
        isCSS = (document.body && document.body.style) ? true : false;
        isW3C = (isCSS && document.getElementById) ? true : false;
        isIE4 = (isCSS && document.all) ? true : false;
        isNN4 = (document.layers) ? true : false;
        isIE6CSS = (document.compatMode && document.compatMode.indexOf("CSS1") >= 0) ? true : false;
    }
}

// set event handler to initialize API
window.onload = initDHTMLAPI;

//Create a XMLHttpRequest
function getconnection() {

	//Create a boolean variable to check for a valid IE instance.
	var xmlhttp = false;

	//Check if we are using IE.
	try {
		//If the javascript version is greater than 5.
		xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
	} catch (e) {
		//If not, then use the older active x object.
		try {
			//If we are using IE.
			xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
		} catch (E) {
			//Else we must be using a non-IE browser.
			xmlhttp = false;
		}
	}
	
	//If we are using a non-IE browser, create a JavaScript instance of the object.
	if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
		xmlhttp = new XMLHttpRequest();
	}
	
	return xmlhttp;
}

//Fetch the page from server and display it
//Three arguments: page to fetch from server, 
//the element id where fetched content should display,
//and the cursor event.
function getpage (thepage,theelement,e){

	var xmlhttp = getconnection();
	
	theObject = document.getElementById(theelement);
	theObject.style.visibility = "visible";
	//var elemwidth = parseInt(theObject.style.width);
	
	//var posx = 0;
	//var posy = 0;
	
	//To display element at point of cursor for both X and Y, 
	//use these:
	//posx = e.clientX + document.body.scrollLeft;
	//posy = e.clientY + document.body.scrollTop;
	
	//Otherwise, center element horizontally and display
	//element vertically at cursor:
	//var winwidth = getInsideWindowWidth();
	//var winheight = getInsideWindowHeight();
	//posx = (winwidth - elemwidth) / 2;
	//posy = winheight - e.clientY - document.body.scrollTop;
	
	//theObject.style.left = posx + "px";
	//theObject.style.bottom = posy + "px";
	
	xmlhttp.open("GET", thepage);
	xmlhttp.onreadystatechange = function() {
		if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
			theObject.innerHTML = xmlhttp.responseText;
		}
	}
	xmlhttp.send(null);
}

//Hide the element and empty of content
function hidepage (theelement){
	tObject = document.getElementById(theelement);
	tObject.style.visibility = "hidden";
	//tObject.style.display = "none";
	tObject.innerHtml = "";
}

// Return the available content width space in browser window
function getInsideWindowWidth() {
    if (window.innerWidth) {
        return window.innerWidth;
    } else if (isIE6CSS) {
        // measure the html element's clientWidth
        return document.body.parentElement.clientWidth
    } else if (document.body && document.body.clientWidth) {
        return document.body.clientWidth;
    }
    return 0;
}

// Return the available content height space in browser window
function getInsideWindowHeight() {
    if (window.innerHeight) {
        return window.innerHeight;
    } else if (isIE6CSS) {
        // measure the html element's clientHeight
        return document.body.parentElement.clientHeight
    } else if (document.body && document.body.clientHeight) {
        return document.body.clientHeight;
    }
    return 0;
}

 positionit = function(theelement,e) {

	theObject = document.getElementById(theelement);
	theObject.style.visibility = "visible";
	var elemwidth = parseInt(theObject.style.width);
	
	var posx = 0;
	var posy = 0;
	
	//To display element at point of cursor for both X and Y, 
	//use these:
	posx = e.clientX + document.body.scrollLeft;
	posy = e.clientY + document.body.scrollTop;
	
	//Otherwise, center element horizontally and display
	//element vertically at cursor:
	//var winwidth = getInsideWindowWidth();
	//var winheight = getInsideWindowHeight();
	//posx = (winwidth - elemwidth) / 2;
	//posy = winheight - e.clientY - document.body.scrollTop;
	
	theObject.style.left = posx + "px";
	theObject.style.top = posy + "px";
	//new Effect.Appear(theObject, { duration: 2.0 });

}