// JavaScript Document

function showZoomPage(height, width, url, title)
{
	var bgShutter, fgPage, fgBanner, fgBannerTitle, fgBannerTitleText, fgCloseLink, fgCloseText, fgContent;
	var winTop, winHeight, winScrollHeight, winWidth;
	var fgHeight, fgWidth, fgTop, fgLeft;

	// Check to see if bgShutter and fgPage exist already; destroy if they do
	if (document.getElementById('bgShutter') != null) document.getElementsByTagName('body')[0].removeChild(document.getElementById('bgShutter'))
	if (document.getElementById('fgPage') != null) document.getElementsByTagName('body')[0].removeChild(document.getElementById('fgPage'))

	// Get window scroll position, height and width
	if ( typeof window.pageYOffset != 'undefined' )
	{
		winTop = window.pageYOffset;
	} else {
		winTop = (document.documentElement.scrollTop > 0) ? document.documentElement.scrollTop : document.body.scrollTop;
	}
	winHeight = Math.max(document.documentElement.clientHeight, document.body.clientHeight);
	winWidth = Math.max(document.documentElement.scrollWidth, document.body.scrollWidth);

	// NOTE - doing fgPage before bgShutter means that the shutter height is calculated correctly
	// Calculate foreground position
	fgHeight = height - 30;
	fgWidth = width;
	fgHeight = Math.round(fgHeight);
	fgWidth = Math.round(fgWidth);
	fgTop = winTop + 20; // Keep a small margin but don't try to centre vertically
	//fgTop = winTop + Math.max(Math.round((winHeight - fgHeight) * 0.15), 10); // make sure there's a small top margin
	fgLeft = Math.max(Math.round((winWidth - fgWidth) * 0.5), 0); // make sure the iframe starts in the window

	//alert('fgTop='+fgTop +', fgHeight='+ fgHeight + '\nfgLeft='+fgLeft+', fgWidth='+fgWidth);

	// Create foreground page DIV element
	fgPage = document.createElement('div');
	fgPage.setAttribute('id', 'fgPage');
	fgPage.style.top = fgTop + 'px';
	fgPage.style.left = fgLeft + 'px';
	fgPage.style.height = fgHeight + 'px';
	fgPage.style.width = fgWidth + 'px';
	document.getElementsByTagName('body')[0].appendChild(fgPage); // fgPage seems to inherit opacity so attach directly to body

	// Get document height in case scrolling (from http://cross-browser.com/x/lib/view.php?sym=xDocSize - similar for width)
	var b=document.body, e=document.documentElement;
	var esh=0, eoh=0, bsh=0, boh=0;
	if (e) {
		esh = e.scrollHeight;
		eoh = e.offsetHeight;
	}
	if (b) {
		bsh = b.scrollHeight;
		boh = b.offsetHeight;
	}
	var fullPageHeight = Math.max(esh,eoh,bsh,boh)


	//alert('winTop=' + winTop + ', winHeight=' + winHeight + ', winWidth='+winWidth);

	// Hide overflow
	document.documentElement.style.overflowX = 'hidden';

	// Create background shutter DIV element
	bgShutter = document.createElement('div');
	bgShutter.setAttribute('id', 'bgShutter');
	bgShutter.setAttribute('visibility', 'hidden');
	bgShutter.style.top = '0px';//winTop + 'px';
	bgShutter.style.height = fullPageHeight + 'px';
	document.getElementsByTagName('body')[0].appendChild(bgShutter);

	// Now create banner with title text
	fgBanner = document.createElement('div');
	fgBanner.setAttribute('id','fgBanner');
	document.getElementById('fgPage').appendChild(fgBanner);
	fgBannerTitle = document.createElement('span');
	fgBannerTitle.setAttribute('id','fgBannerTitle');
	document.getElementById('fgBanner').appendChild(fgBannerTitle);
	fgBannerText = document.createTextNode(title);
	fgBannerTitle.appendChild(fgBannerText);

	// Now create close link & text
	fgCloseLink = document.createElement('a');
	fgCloseLink.setAttribute('id','fgCloseLink');
	fgCloseLink.setAttribute('href','javascript:hideZoomPage();');
	document.getElementById('fgBanner').appendChild(fgCloseLink);
	fgCloseText = document.createTextNode('close');
	fgCloseLink.appendChild(fgCloseText);

	// Now create iframe for content
	fgContent = document.createElement('iframe');
	fgContent.setAttribute('id', 'fgContent');
	fgContent.setAttribute('scrolling', 'no');
	fgContent.setAttribute('frameborder', '0');
	fgContent.style.height = (fgHeight-30) + 'px';
	fgContent.style.width = (fgWidth) + 'px';
	fgContent.src = url;
	document.getElementById('fgPage').appendChild(fgContent);

	document.getElementById('bgShutter').style.visibility = 'visible';
	document.getElementById('fgPage').style.visibility = 'visible';

}




function hideZoomPage()
{
	if (!document.getElementById('bgShutter')) return;
	if (!document.getElementById('fgPage')) return;

	document.getElementsByTagName('body')[0].removeChild(document.getElementById('fgPage'));
	document.getElementsByTagName('body')[0].removeChild(document.getElementById('bgShutter'));
}





