// image_preview.js

// USAGE
// <a href="javascript:ImagePreview('image/enlarge/aozora_top.png',1018,758);"><img href="image/enlarge/aozora_top.png" width="800" height="600"></a>
// 

var absolute_prefix = "/aozora/"

function ImagePreview(src, width, height) {
	var imgdiv = document.getElementById("image_preview");
	if (imgdiv == null) {
		 document.body.innerHTML += '<div id="image_preview"></div>';
		 imgdiv = document.getElementById("image_preview");
	}
	var pageX = 0;
	var pageY = 0;
	var pageW = 0;
	var pageH = 0;
	if (navigator.appName.indexOf("Microsoft ") != -1) {
		pageX = document.body.scrollLeft;
		pageY = document.body.scrollTop;
		pageW = document.body.clientWidth;
		pageH = document.body.clientHeidth;
	} else {
		pageX = window.pageXOffset;
		pageY = window.pageYOffset;
		pageW = window.innerWidth;
		pageH = window.innerHeight;
	}
	var x = pageX;
	var y = pageY;
	var w = width + 20;
	var h = height + 40;
	if (w < 200) { w = 200; }
	if (pageW > w) { x += (pageW - w) / 2; }
	if (x - pageX < 10) { x = pageX + 10; }
	if (pageH > h) { y += (pageH - h) / 2; }
	if (y - pageY < 10) { y = pageY + 10; }
//	alert(""
//		+ "pageX=" + pageX + "\n"
//		+ "pageY=" + pageY + "\n"
//		+ "pageW=" + pageW + "\n"
//		+ "pageH=" + pageH + "\n"
//		+ "x=" + x + "\n"
//		+ "y=" + y + "\n"
//		+ "w=" + w + "\n"
//		+ "h=" + h + "\n"
//	);
	imgdiv.style.background = "white";
	imgdiv.style.border = "groove"; 
	imgdiv.style.position = 'absolute';
	imgdiv.style.left = x + 'px';
	imgdiv.style.top = y + 'px';
	imgdiv.style.width = w + 'px';
	imgdiv.style.height = h + 'px';
	imgdiv.innerHTML = '<div style="text-align:left; margin:2px;"><a href="javascript:CloseImage();">クリックでイメージを閉じます</a></div>'
	+ '<a href="javascript:CloseImage();"><img '
	+ 'style="margin:2px 5px 5px 5px;"'
	+ 'src="' + src + '" '
	+ 'alt="拡大イメージ" '
	+ 'onclick="CloseImage();" '
	+ ' /><br /></a>';
}

function CloseImage(){
	var imgdiv = document.getElementById("image_preview");
	imgdiv.style.border = 'none';
	imgdiv.style.left = '0px';
	imgdiv.style.top = '0px';
	imgdiv.style.width = '0px';
	imgdiv.style.height = '0px';
	imgdiv.innerHTML = '';
}