function showOverlay(id, img) {
  div=document.getElementById(id);

  if ( img ) {
    x=(img.width / 2) - 85; // Half the image width minus half the overlay image width
    y=(img.height / 2) - 15; // Half the image height minus half the overlay image height
    div.style.top=y+"px";
    div.style.left=x+"px";
  }

  div.style.visibility="visible";
}

function hideOverlay(id) {
  div=document.getElementById(id);
  div.style.visibility="hidden";
}

function previewSample(page, orientation) {
	if (orientation=='landscape') {
		winWidth = 1044;
		winHeight = 700;
	} else {
		winWidth = 712;
		winHeight = 1000;
	}
	wndPreview = window.open("preview_image.php?i=previews/"+page, "CtrlWindow", "width=" + winWidth + ",height=" + winHeight + ",left=" + (screen.availWidth-winWidth)/2 + ",top=" + (screen.availHeight-winHeight)/2 + ",status=no,address=no,toolbar=no,menubar=no,location=no,scrollbars=yes,resizable=yes");
	wndPreview.focus();
}

function displayPreview(ovrID, img, orientation) {
	if (typeof orientation=='undefined') orientation='portrait'; else orientation='landscape';
	document.write('<div class="img_container">');
	document.write('<a href="javascript:;" onClick="previewSample(\'' + img + '\',\'' + orientation + '\')"><img src="images/' + img + '" onMouseOver="showOverlay(\'overlay' + ovrID + '\', this);" onMouseOut="hideOverlay(\'overlay' + ovrID + '\');" border="0" /></a>');
	document.write('<div id="overlay' + ovrID + '" class="overlay">');
	document.write('<a href="javascript:;" onClick="previewSample(\'' + img + '\',\'' + orientation + '\')"><img src="images/overlay_click.gif" border="0" onMouseOver="showOverlay(\'overlay' + ovrID + '\', false);" /></a></div>');
	document.write('</div>');
}