var ExpandingFromId = "";
var ExpandingToId = "";
var ExpRect = new Rect(0, 0, 0, 0);
var ExpTimeOut = 0;
var ExpStep = 1;
var ExpandingTotalSteps = 10;
var ExpandDirection = '';
var Expandvalign = '';

function GrowPicture(fromId, toId, fullwidth, fullheight, direction, valign)
{
	if (direction == 'ffleft') 
	{
		direction = 'left';
	}
	if (direction == 'ffright') 
	{
		direction = 'right';
	}

	if (ExpTimeOut != 0)
	{
		clearTimeout(ExpTimeOut);
	}
	if (ExpandingFromId != "" && ExpandingFromId != fromId)
	{
		RestoreThumb();
	}

	if (ExpandingFromId != fromId)
	{
		var img = document.getElementById(toId);
		img.style.display = 'block';
		ExpandingFromId = fromId;
		ExpandingToId = toId;
		ExpandDirection = direction;
		Expandvalign = valign;
		ExpStep = 1;
		ExpRect.width = fullwidth;
		ExpRect.height = fullheight;
		ExpRect.top = img.offsetTop;
		ExpRect.left = img.offsetLeft;
	}
	else if (ExpStep < 1)
	{
		ExpStep = 1;
	}
	ExpandStep();
}

function ExpandStep()
{
	ExpTimeOut = 0;
	GrowByOne();
	if (ExpStep < ExpandingTotalSteps)
	{
		ExpStep++;
		ExpTimeOut = setTimeout("ExpandStep()", 20);
	}
}

function GrowByOne()
{
	var img = document.getElementById(ExpandingToId);
	var thumb = document.getElementById(ExpandingFromId);
	var myscroll = GetRect();
	var finaltop, finalleft;


	if (Expandvalign == 'top')
	{
		finaltop = ExpRect.top - (ExpRect.height - thumb.height) + 40;
	}
	else
	{
		finaltop = ExpRect.top - (ExpRect.height - thumb.height)/2;
	}	
	
	/*	
	if (ExpRect.top + ExpRect.height > myscroll.top + myscroll.height)
	{
		finaltop = myscroll.top + myscroll.height - ExpRect.height + thumb.height;
	}
	else
	{
		finaltop = ExpRect.top - (ExpRect.height - thumb.height)/2;
		if (finaltop < myscroll.top)
		{
			finaltop = myscroll.top;
		}
	}
	*/

	if (ExpRect.left + ExpRect.width > myscroll.left + myscroll.width)
	{
		finalleft = myscroll.left + myscroll.width - ExpRect.width;
	}
	else
	{
		if (ExpandDirection == '')
		{
			finalleft = ExpRect.left - (ExpRect.width - thumb.width)/2;
		}
		else
		{
			if (ExpandDirection == 'left')
			{
				finalleft = ExpRect.left - (ExpRect.width - thumb.width);
			}
			if (ExpandDirection == 'right')
			{
				finalleft = ExpRect.left;
			}
		}
	}
	
	var imgLeft, imgTop, imgWidth, imgHeight
	imgLeft	= finalleft + ((ExpRect.left - finalleft) * (ExpandingTotalSteps - ExpStep) / ExpandingTotalSteps) + 'px';
	imgTop = finaltop + ((ExpRect.top - finaltop) * (ExpandingTotalSteps - ExpStep) / ExpandingTotalSteps) + 'px';
	imgWidth = thumb.height + ((ExpRect.height - thumb.height) * ExpStep / ExpandingTotalSteps);
	imgHeight = thumb.width + ((ExpRect.width - thumb.width) * ExpStep / ExpandingTotalSteps);
	
	img.style.left = imgLeft;
	img.style.top = imgTop;
	img.height = imgWidth;
	img.width = imgHeight;
}

function ShrinkPic()
{
	if (ExpTimeOut == 0)
	{
		if (ExpTimeOut != 0)
		{
			clearTimeout(ExpTimeOut);
		}
		if (ExpStep > 0)
		{
			ShrinkByOne();
		}
		return false;
	}
}

function ShrinkByOne()
{
	ExpTimeOut = 0;
	GrowByOne('');
	if (ExpStep > 0)
	{
		ExpStep--;
		ExpTimeOut = setTimeout("ShrinkByOne()", 20);
	}
	else
	{
		RestoreThumb();
	}
}

function RestoreThumb()
{
	var img = document.getElementById(ExpandingToId);
	img.style.top = '';
	img.style.left = '';
	img.style.display = 'none';
	ExpandingFromId = "";
	ExpandingToId = "";
}
function Rect(vnLeft, vnTop, vnWidth, vnHeight)
{
	this.left = vnLeft;
	this.top = vnTop;
	this.width = vnWidth;
	this.height = vnHeight;
}
function GetRect()
{
	if (document.all && typeof document.body.scrollTop != "undefined")
	{
		var ieBox = document.compatMode != "CSS1Compat";
		var cont = ieBox ? document.body : document.documentElement;
		var x = new Rect(cont.scrollLeft, cont.scrollTop, cont.clientWidth, cont.clientHeight);
		return x;
	}
	else
	{
		var x = new Rect(window.pageXOffset, window.pageYOffset, window.innerWidth, window.innerHeight);
		return x;
	}
}