function Imageincreaceer(oThumb, sImgSrc)
//function Imageincreaceer(id, sImgSrc)
{
	// store thumbnail image and overwrite its onclick handler.
	//this.oThumb = document.getElementById(id);
	 this.oThumb = oThumb;
	oThumb = this.oThumb;
	this.oThumb.increaceer = this;
	this.oThumb.onclick = function() { this.increaceer.increace(); }
	
	// record original size
	this.smallWidth = oThumb.offsetWidth;
	this.smallHeight = oThumb.offsetHeight;	

	this.bIncreace = true;
	this.bTicks = false;
	this.timeout = 5;
	this.counter = 0;
	
	// self organized list
	if ( !window.aImageincreaceers )
	{
		window.aImageincreaceers = new Array();
	}
	window.aImageincreaceers.push(this);

	// create the full sized image.
	this.oImg = new Image();
	this.oImg.increaceer = this;
	this.oImg.onload = function(){this.increaceer.onload();}
	this.oImg.src = sImgSrc;
}
Imageincreaceer.prototype.findPosX = function (obj) {
// X-координата слоя
  var currleft = 0;
  if (obj.offsetParent)
    while (obj.offsetParent) {
      currleft += obj.offsetLeft
      obj = obj.offsetParent;
    }
  else if (obj.x) currleft += obj.x;
  return currleft;
}
Imageincreaceer.prototype.findPosY = function(obj) {
// Y-координата слоя
  var currtop = 0;
  if (obj.offsetParent)
    while (obj.offsetParent) {
      currtop += obj.offsetTop
      obj = obj.offsetParent;
    }
  else if (obj.y) currtop += obj.y;
  return currtop;
}


Imageincreaceer.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.increaceer = this;
	this.oDiv.onclick = function() {this.increaceer.toggle();};
	this.oImg.title = "Нажмите для уменьшения";
	this.bigWidth = this.oImg.width;
	this.bigHeight = this.oImg.height;
	
	if ( this.bIncreace )
	{
		this.increace();
	}
	else
	{
		this.oDiv.style.visibility = "hidden";
		this.oImg.style.visibility = "hidden";
	}
}
Imageincreaceer.prototype.toggle = function()
{
	
	
	this.bIncreace = !this.bIncreace;
	if ( this.bIncreace )
	{
		for ( var i in window.aImageincreaceers )
			if ( window.aImageincreaceers[i] !== this )
				window.aImageincreaceers[i].reduce();
	}
}
Imageincreaceer.prototype.increace = function()
{
	// set direction of expansion.
	this.bIncreace = true;
	this.counter = 0;

	// set all other images to reduce
	for ( var i in window.aImageincreaceers )
		if ( window.aImageincreaceers[i] !== this )
			window.aImageincreaceers[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
	this.x = this.findPosX(this.oThumb);
	this.y = this.findPosY(this.oThumb);
	this.w = this.oThumb.clientWidth;
	this.h = this.oThumb.clientHeight;
//	alert(this.oThumb.innerLeft + "-" + this.y + "-" + this.h);
	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.dRatio = 0;
	// start the animation engine.
	if ( !this.bTicks )
	{
		this.bTicks = true;
		var pThis = this;
		window.setTimeout(function(){pThis.tick();},this.timeout);	
	}
}
Imageincreaceer.prototype.reduce = function()
{
	// set direction of expansion.
	//alert("reduce");
	this.bIncreace = false;
}
Imageincreaceer.prototype.tick = function()
{
	// calculate screen dimensions
	//alert("tick");
	var cw = document.body.clientWidth;
	var ch = document.body.clientHeight;
	var cx = document.body.scrollLeft + cw / 2;
	var cy = document.body.scrollTop + ch / 2;

	// calculate target
	var tw,th,tx,ty;
	if ( this.bIncreace )
	{
		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;
		this.oImg.style.border = "30px solid white";
 
	}
	else
	{
		this.oImg.style.border = "0px solid white";
		tw = this.smallWidth;
		th = this.smallHeight;
		//tx = this.oThumb.offsetLeft;
		//ty = this.oThumb.offsetTop;
		tx = this.findPosX(this.oThumb);
		ty = this.findPosY(this.oThumb);
	}	
	// 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
		{
			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+5) + "px";
	this.oDiv.style.top = (this.y+5) + "px";
	if(this.dRatio == 0) this.dRatio = this.w/this.h;
	if(this.dRatio > 1){
		var delta = (this.dRatio*this.h - this.w +210)/this.dRatio;
		this.oImg.style.width = (this.w -210) + "px";
		this.oImg.style.height = (this.h - delta) + "px";
	}else{
		var delta = this.w - this.dRatio*this.h +this.dRatio*210;
		this.oImg.style.width = (this.w -delta) + "px";
		this.oImg.style.height = (this.h -210) + "px";
	}

	// if reducing and size/position is a match, stop the tick	
	//if(nHit != 4)alert(nHit+"-"+this.bIncreace);
	if(!this.bIncreace){
		this.counter++;
	}
	if(this.counter == 12){
		this.oImg.style.visibility = "hidden";
		this.oDiv.style.visibility = "hidden";
		this.oThumb.style.visibility = "visible";
		this.bTicks = false;
		
	}
	if ( !this.bIncreace && (nHit == 4) )
	{
		this.oImg.style.visibility = "hidden";
		this.oDiv.style.visibility = "hidden";
		this.oThumb.style.visibility = "visible";
		alert("Yess");

		this.bTicks = false;
	}
	
	if ( this.bTicks )
	{
		var pThis = this;
		window.setTimeout(function(){pThis.tick();},this.timeout);
	}
}

