function ImageExpander(oThumb, sImgSrc, link)
{
    // Check to see if we are leaving the page
    var leaving=document.getElementById("leaving");
    if (leaving.value==true) return;

    // store link 
    this.link = link;
    
	// store thumbnail image and overwrite its onclick handler.
	this.oThumb = oThumb;
	this.oThumb.expander = this;
	this.oThumb.onclick = function() { this.expander.expand(); }
	
	// record original size
	this.smallWidth = oThumb.offsetWidth;
	this.smallHeight = oThumb.offsetHeight;	

	this.bExpand = true;
	this.bTicks = false;
	
	// self organized list
	if ( !window.aImageExpanders )
	{
		window.aImageExpanders = new Array();
	}
	window.aImageExpanders.push(this);

	// create the full sized image.
	this.oImg = new Image();
	this.oImg.expander = this;
	this.oImg.onload = function(){this.expander.onload();}
	this.oImg.src = sImgSrc;
}

ImageExpander.prototype.onload = function()
{
	this.oDiv = document.createElement("div");
	document.body.appendChild(this.oDiv);
	this.oDiv.appendChild(this.oImg);
	this.oDiv.style.position = "absolute";
	this.oDiv.expander = this;
//	this.oDiv.onclick = function() {this.expander.toggle();};
	this.oDiv.onclick = function() {this.expander.display();};
//	this.oDiv.onmouseout = function() {this.expander.reduce();};
	this.oDiv.onmousemove = function(e) {this.expander.mousemove(e);};
	this.oImg.title = this.link;
	this.oImg.border="4";
	this.bigWidth = this.oImg.width;
	this.bigHeight = this.oImg.height;
	
	if ( this.bExpand )
	{
		this.expand();
	}
	else
	{
		this.oDiv.style.visibility = "hidden";
		this.oImg.style.visibility = "hidden";
	}
}
ImageExpander.prototype.mousemove = function(e)
{ 
  if (!e) e = window.event; // works on IE, but not NS (we rely on NS passing us the event)

  if (e)
  { 
   if (e.pageX || e.pageY)
    { // this doesn't work on IE6!! (works on FF,Moz,Opera7)
      mouseX = e.pageX;
      mouseY = e.pageY;
    }
    else if (e.clientX || e.clientY)
    { // works on IE6,FF,Moz,Opera7
      mouseX = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
      mouseY = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
    }  
 
	tW = this.oThumb.clientWidth;
	tH = this.oThumb.clientHeight;
	
    var offset=this.oThumb;
    tX=tY=0; // initial image location
    while(offset!=null)
    {
        tX+=offset.offsetLeft;
        tY+=offset.offsetTop;
        offset=offset.offsetParent;
    }
    
    
    
 //   alert(" mouse " + mouseX + " " + mouseY + " image " + tX + " " + tY + " " + document.body.scrollTop);

    if(mouseX>tX+tW||mouseY>tY+tH||mouseX<tX||mouseY<tY)
    {
        this.bExpand = false;
    }
  }
}

ImageExpander.prototype.toggle = function()
{
	this.bExpand = !this.bExpand;
	if ( this.bExpand )
	{
		for ( var i in window.aImageExpanders )
			if ( window.aImageExpanders[i] !== this )
				window.aImageExpanders[i].reduce();
	}
}
ImageExpander.prototype.display = function()
{
    this.oDiv.onmouseout = function () {void(0)};
    this.oDiv.onclick = function () {void(0)};
    this.oImg.onmouseover = function () {void(0)};

    var leaving=document.getElementById("leaving");
    leaving.value=true;
    
    this.bExpand = false;
    this.followLink = true;
}

ImageExpander.prototype.expand = function()
{
	// set direction of expansion.
	this.bExpand = true;

	// set all other images to reduce
	for ( var i in window.aImageExpanders )
		if ( window.aImageExpanders[i] !== this )
			window.aImageExpanders[i].reduce();

	// if not loaded, don't continue just yet
	if ( !this.oDiv ) return;
	
	// hide the thumbnail
	this.oThumb.style.visibility = "hidden";
	
	// calculate initial dimensions
    var offset=this.oThumb;
    tX=tY=0; // initial image location
    while(offset!=null)
    {
        tX+=offset.offsetLeft;
        tY+=offset.offsetTop;
        offset=offset.offsetParent;
    }
    this.x = tX;
    this.y = tY;
//	this.x = this.oThumb.offsetLeft;
//	this.y = this.oThumb.offsetTop;
	this.w = this.oThumb.clientWidth;
	this.h = this.oThumb.clientHeight;

	this.oDiv.style.left = this.x + "px";
	this.oDiv.style.top = this.y + "px";
	this.oImg.style.width = this.w + "px";
	this.oImg.style.height = this.h + "px";
	this.oDiv.style.visibility = "visible";
	this.oImg.style.visibility = "visible";
	this.oImg.border="4";
	this.oDiv.border="4";
	
	// start the animation engine.
	if ( !this.bTicks )
	{
		this.bTicks = true;
		var pThis = this;
		window.setTimeout(function(){pThis.tick();},25);	
	}
}
ImageExpander.prototype.reduce = function()
{
	// set direction of expansion.
	this.bExpand = false;
}
ImageExpander.prototype.tick = function()
{
	// calculate screen dimensions
	var frameWidth = 0;
	var frameHeight = 0;
	if (self.innerWidth)
    {
    	frameWidth = self.innerWidth;
    	frameHeight = self.innerHeight;
    }
    else if (document.documentElement && document.documentElement.clientWidth)
    {
    	frameWidth = document.documentElement.clientWidth;
    	frameHeight = document.documentElement.clientHeight;
    }
    else if (document.body)
    {
    	frameWidth = document.body.clientWidth;
    	frameHeight = document.body.clientHeight;
    }	
	var cw = frameWidth-20;
	var ch = frameHeight-20;
//	var cw = document.body.clientWidth;
//	var ch = document.body.clientHeight;
	var cx = (document.body.scrollLeft + document.documentElement.scrollLeft + 10) + cw / 2;
	var cy = (document.body.scrollTop + document.documentElement.scrollTop + 10) + ch / 2;

	// calculate target
	var tw,th,tx,ty;
	if ( this.bExpand )
	{
		tw = this.bigWidth;
		th = this.bigHeight;
		if ( tw > cw )
		{
			th *= cw / tw;
			tw = cw;
		}	
		if ( th > ch )
		{
			tw *= ch / th;
			th = ch;
		}
		tx = cx - tw / 2;
		ty = cy - th / 2; 
	}
	else
	{
		tw = this.smallWidth;
		th = this.smallHeight;
//		tx = this.oThumb.offsetLeft;
//		ty = this.oThumb.offsetTop;
        var offset=this.oThumb;
        tX=tY=0; // initial image location
        while(offset!=null)
        {
            tX+=offset.offsetLeft;
            tY+=offset.offsetTop;
            offset=offset.offsetParent;
        }
        
        tx = tX;
        ty = tY;
	}	
	// move 5% closer to target
	var nHit = 0;
	var fMove = function(n,tn) 
	{
		var dn = tn - n;
		if ( Math.abs(dn) < 3 )
		{
			nHit++;
			return tn;
		}
		else
		{
		    if (this.bExpand)
	    		return n + dn / 10;
			else
    			return n + dn / 10;
		}
	}
	this.x = fMove(this.x, tx);
	this.y = fMove(this.y, ty);
	this.w = fMove(this.w, tw);
	this.h = fMove(this.h, th);
	
	this.oDiv.style.left = this.x + "px";
	this.oDiv.style.top = this.y + "px";
	this.oImg.style.width = this.w + "px";
	this.oImg.style.height = this.h + "px";

	// if reducing and size/position is a match, stop the tick	
	if ( !this.bExpand && (nHit == 4) )
	{
		this.oImg.style.visibility = "hidden";
		this.oDiv.style.visibility = "hidden";
		this.oThumb.style.visibility = "visible";

		this.bTicks = false;
		if (this.followLink == true) 
		{    
    		this.followLink = false;
    		document.location = this.link;
		}
	}
	
	if ( this.bTicks )
	{
		var pThis = this;
		window.setTimeout(function(){pThis.tick();},25);
	}
}