function resizeimage(sizex, sizey)
{
	// Get viewport size
	viewportx = window.innerWidth;
	if ( viewportx == undefined )
	{
		viewportx = document.body.offsetWidth;
	}
	viewporty = window.innerHeight;
	if ( viewporty == undefined )
	{
		viewporty = document.body.offsetHeight;
	}

	// Set some variables
	sizex = sizex * 1;
	sizey = sizey * 1;
	landscape = 0;

	// Determine orientation and size images
	if (sizex > sizey)
	{
		landscape=1;
	}
	if (sizex > viewportx - 50)
	{
	ratio = ( ( viewportx - 50 ) / sizex );
		sizex = ( viewportx - 50 );
		sizey = sizey * ratio;
	}
	if (sizey > viewporty - 50)
	{
	ratio = ( ( viewporty - 50 ) / sizey );
		sizey = ( viewporty - 50 );
		sizex = sizex * ratio;
	}

	document.getElementById('overlay_image').style.width = sizex + 'px';
	document.getElementById('overlay_image').style.height = sizey + 'px';

	topmargin = ( viewporty / 2 ) - ( sizey / 2 );
	document.getElementById('overlay_image_table').style.marginTop = topmargin + 'px';
}

function showimage(image, project, title, sizex, sizey)
{
	// Set global variables
	origx = sizex;
	origy = sizey;

	// Get viewport size
	viewportx = window.innerWidth;
	if ( viewportx == undefined )
	{
		viewportx = document.body.offsetWidth;
	}
	viewporty = window.innerHeight;
	if ( viewporty == undefined )
	{
		viewporty = document.body.offsetHeight;
	}

	// Set some variables
	sizex = (sizex * 1) - 4;
	sizey = (sizey * 1) - 16;
	landscape = 0;

	// Determine orientation and size images
	if (sizex > sizey)
	{
		landscape=1;
	}
	if (sizex > viewportx - 50)
	{
	ratio = ( ( viewportx - 50 ) / sizex );
		sizex = ( viewportx - 50 );
		sizey = sizey * ratio;
	}
	if (sizey > viewporty - 50)
	{
	ratio = ( ( viewporty - 50 ) / sizey );
		sizey = ( viewporty - 50 );
		sizex = sizex * ratio;
	}

	// write image to page
	if (landscape == '1')
	{
		document.getElementById('overlay_image_cell').innerHTML='<IMG ID="overlay_image" SRC="/images/project/' + project + '/' + image + '_large.jpg" WIDTH="' + sizex + '" STYLE="border: 2px solid #555566;">';
	}
	else
	{
		document.getElementById('overlay_image_cell').innerHTML='<IMG ID="overlay_image" SRC="/images/project/' + project + '/' + image + '_large.jpg" HEIGHT="' + sizey + '" STYLE="border: 2px solid #555566;">';
	}
	topmargin = ( viewporty / 2 ) - ( sizey / 2 ) - 14;
	document.getElementById('overlay_image_title').innerHTML='<B>' + title + '</B>';
	document.getElementById('overlay_image_table').style.marginTop = topmargin + 'px';
	document.getElementById('overlay_page').style.display='block';
	document.getElementById('overlay_bg').style.display='block';

	window.onresize = function () { resizeimage(origx, origy); };
}

function close_overlay()
{
	document.getElementById('overlay_page').style.display='none';
	document.getElementById('overlay_bg').style.display='none';
}
