function toggle(div_id) {
	var el = document.getElementById(div_id);
	if ( el.style.display == 'none' ) {	el.style.display = 'block';}
	else {el.style.display = 'none';}
}
function blanket_size(popUpDivVar) {
	if (typeof window.innerWidth != 'undefined') {
		viewportheight = window.innerHeight;
	} else {
		viewportheight = document.documentElement.clientHeight;
	}
	if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) {
		blanket_height = viewportheight;
	} else {
		if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) {
			blanket_height = document.body.parentNode.clientHeight;
		} else {
			blanket_height = document.body.parentNode.scrollHeight;
		}
	}
	var blanket = document.getElementById('blanket');
	blanket.style.height = blanket_height + 'px';
	var popUpDiv = document.getElementById(popUpDivVar);
	popUpDiv_height=blanket_height/2-150;//150 is half popup's height
	//popUpDiv.style.top = popUpDiv_height + 'px';
	popUpDiv.style.top = 200 + 'px';
}
function window_pos(popUpDivVar) {
	if (typeof window.innerWidth != 'undefined') {
		viewportwidth = window.innerHeight;
	} else {
		viewportwidth = document.documentElement.clientHeight;
	}
	if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) {
		window_width = viewportwidth;
	} else {
		if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) {
			window_width = document.body.parentNode.clientWidth;
		} else {
			window_width = document.body.parentNode.scrollWidth;
		}
	}
	var popUpDiv = document.getElementById(popUpDivVar);
	window_width=window_width/2-200;//150 is half popup's width
	popUpDiv.style.left = window_width + 'px';
}
function popup(windowname) {
	blanket_size(windowname);
	window_pos(windowname);
	toggle('blanket');
	toggle(windowname);		
}

function popuppic(windowname, picture) {
	getImgSize(picture);
	//alert(getImgSize(picture));
	var newWidth = 300;
	var picsize = getImgSize(picture);
	var picWidth = picsize[0];
	var picHeight = picsize[1];
	//alert('Height = '+picHeight+' and width = '+picWidth)
	//if (getImgSize(picture)=='width')
	if (picWidth > picHeight)
		{
		var newPicWidth = newWidth;
		document.getElementById('poppic').style.width=newWidth;
		document.getElementById('poppic').style.height='';
		//document.getElementById('popuppic').style.height='400';
		document.getElementById('popuppic').style.height=200+picHeight * newWidth / picWidth;
		}
	else
		{
		document.getElementById('poppic').style.height='300';
		document.getElementById('poppic').style.width='';
		//document.getElementById('popuppic').style.height='500';
		document.getElementById('popuppic').style.height='500';
		}
	document.getElementById('poppic').src=picture;
	blanket_size(windowname);
	window_pos(windowname);
    toggle('blanket');
	toggle(windowname);		
}

function getImgSize(imgSrc) 
{
var newImg = new Image();
newImg.src = imgSrc;
var height = newImg.height;
var width = newImg.width;
//alert ('The image size is '+width+'*'+height);
/*if (width > height)
	{
	return "width";
	}
else
	{
	return "height";
	}*/
/* =====================================================
   This line should return multiple values.
   Usage would be:
   
   var a = xyz();
   document.write('x=' + a[0] + ' and y = ' + a[1]);  
   ===================================================== */
return [width,height];
}