function getTheWindowSize(){
	
	var myXscroll;
	var myYscroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
				myXscroll = document.body.scrollWidth;
				myYscroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){
			myXscroll = document.body.scrollWidth;
			myYscroll = document.body.scrollHeight;
	} else { // code for Mac IE... but also works in Explorer 6 Strict, Mozilla and Safari
			myXscroll = document.body.offsetWidth;
			myYscroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
			currentWindowWidth = self.innerWidth;
			currentWindowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
			currentWindowWidth = document.documentElement.clientWidth;
			currentWindowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
			currentWindowWidth = document.body.clientWidth;
			currentWindowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(myYscroll < windowHeight){
			currentPageHeight = windowHeight;
	} else { 
			currentPageHeight = myYscroll;
	}

	// for small pages with total width less then width of the viewport
	if(myXscroll < windowWidth){	
			currentPageWidth = windowWidth;
	} else {
			currentPageWidth = myXscroll;
	}


	arrayWindowSize = new Array(currentPageWidth,currentPageHeight,currentWindowWidth,currentWindowHeight) 
	return arrayWindowSize;
}


function buildDiveCams(targetCam){
	//target the objects on the page
	//alert("building the cams out!");
	
	var objSurround = document.createElement('div');
	objSurround.setAttribute('id','surround');
	document.body.appendChild(objSurround);
	
	var objApp = document.createElement('div');
	objApp.setAttribute('id','app');
	document.body.appendChild(objApp);

	var objClose = document.createElement('div');
	objClose.setAttribute('id','closeEm');
	objClose.innerHTML = "<a href='javascript:closeEmUp();'>[X] CLOSE</a>";
	document.body.appendChild(objClose);
	
	//grab the current window height
	var arrayPageSize = getTheWindowSize();
	
	//size the ghosted BG to the window dimensions
	//alert("current window height is "+(arrayPageSize[1] + 'px'));
	objSurround.style.height = (arrayPageSize[1] + 'px');
	//alert("setting the surround to "+(arrayPageSize[1] + 'px'));
	
	//turn the app and sppBG div on and center in the window
	objApp.style.display = 'block';
	objApp.style.left = (((arrayPageSize[0]/2)-320) + 'px');
	objClose.style.left = (((arrayPageSize[0]/2)+220) + 'px')
	
	var targetURL = "rrdc-diving-cams.php?cam_id="+targetCam;
	
	/* BUILD OUT THE INNER PARTS OF THE APP */
	objApp.innerHTML+="<iframe id='dive-cams' src='"+targetURL+"' frameborder='0' name='dive-cams' scrolling='no' scrolling='false' width='640' height='480' allowtransparency='true'></iframe>";
	/* EOF INNER PARTS OF THE APP */
	
	scroll(0,0);
	// This sets a 5-7 minute timer to close the window if you aren't watching..
	t = setTimeout('closeEmUp();', 500000);		
	}


function closeEmUp(){
	//target the application on the page
	//alert("closing them!");
	var objSurround = document.getElementById('surround');
	var objApp = document.getElementById('app');
	var objClose = document.getElementById('closeEm');
	document.body.removeChild(objSurround);
	document.body.removeChild(objApp);
	document.body.removeChild(objClose);
}


function reposition(){
	//target the application on the page
	var objSurround = document.getElementById('surround');
	var objApp = document.getElementById('app');
	var objClose = document.getElementById('closeEm');
	
	//grab the current window height
	var arrayPageSize = getTheWindowSize();
	
	objSurround.style.height = arrayPageSize[0]+'px';
	
	//set the app to float in the middle of the current window
	objApp.style.left = (((arrayPageSize[0]/2)-320) + 'px');
	objClose.style.left = (((arrayPageSize[0]/2)+220) + 'px')

}