var SIZESTEPS = 20;
var HIDESTEPS = 10;
	
function showPopup(width,height)
{
  centerPopup();
	    
  var popup = document.getElementById("popup");
  popup.style.display = "block";
  popup.style.zIndex="0";
	  
  if(width > popup.offsetWidth)
    var xStep = parseInt((width - popup.offsetWidth) / SIZESTEPS);	  
  else
    var xStep = parseInt((popup.offsetWidth - width) / SIZESTEPS);	

  if(height > popup.offsetHeight)		
    var yStep = parseInt((height - popup.offsetHeight) / SIZESTEPS);
  else
    var yStep = parseInt((popup.offsetHeight - height) / SIZESTEPS); 
	  
  if(width > popup.offsetWidth)
    setTimeout('scalePopup(1,' + width + ',' + height + ',' + xStep + ',' + yStep + ')',10);
  else
    setTimeout('scalePopup(0,' + width + ',' + height + ',' + xStep + ',' + yStep + ')',10);

}
	
function scalePopup(direction,width,height,xStep,yStep)
{
  var popup = document.getElementById("popup");	 
  var dopup = document.getElementById("popupData");	 
	  
  if(direction == 0)
  {
    popup.style.width  = parseInt(parseInt(popup.style.width)  - xStep) + "px";	  
    popup.style.height = parseInt(parseInt(popup.style.height) - yStep) + "px";

    if(parseInt(parseInt(popup.style.width)  - xStep) > 10)
      dopup.style.width  = parseInt(parseInt(popup.style.width)  - xStep - 10) + "px";	  
  }
  else
  {
    popup.style.width  = parseInt(parseInt(popup.style.width)  + xStep) + "px";	  
    popup.style.height = parseInt(parseInt(popup.style.height) + yStep) + "px";

    if(parseInt(parseInt(popup.style.width)  - xStep) > 10)
      dopup.style.width  = parseInt(parseInt(popup.style.width)  + xStep - 10) + "px";	
  }
	  
  if((parseInt(popup.style.width) > (width - 5) && direction == 1) || (parseInt(popup.style.width) < (width + 5) && direction == 0))
  {
    popup.style.width = width + "px";
    popup.style.height = height + "px";

    centerPopup();
  }
  else
  {
    centerPopup();
    setTimeout('scalePopup(' + direction + ',' + width + ',' + height + ',' + xStep + ',' + yStep + ')',10);
  }
}
	
function centerPopup()
{
  var popup = document.getElementById("popup");
  var x = parseInt((document.body.clientWidth - popup.offsetWidth) / 2);
  var y = parseInt((document.body.clientHeight - popup.offsetHeight) / 2);
  var topPos = window.pageYOffset ? window.pageYOffset : document.body.scrollTop;

  popup.style.top = topPos + 100 + "px";
  popup.style.left = x + "px";
}
	
function hidePopup()
{
  centerPopup();
	    
  var popup = document.getElementById("popup");
  var xStep = parseInt(popup.offsetWidth / HIDESTEPS);	
  var yStep = parseInt(popup.offsetHeight / HIDESTEPS);
	  
  setTimeout('hideLoop(' + xStep + ',' + yStep + ',0)',10);
}
	
function hideLoop(xStep,yStep,step)
{
  var popup = document.getElementById("popup");	 
  var dopup = document.getElementById("popupData");

  var w = parseInt(parseInt(popup.style.width)  - xStep);
  var h = parseInt(parseInt(popup.style.height) - yStep);
	  
  if(w < 0) { w = 1; }
  if(h < 0) { h = 1; }
		
  popup.style.width  = w + "px";
  popup.style.height = h + "px";

  if(w > 10)
    dopup.style.width  = (w - 10) + "px";
    
	  
  if(step >= HIDESTEPS)
  {
    popup.style.display = "none";
    popup.style.width = 320 + "px";
    popup.style.height = 240 + "px";
    centerPopup();
  }
  else
  {
    centerPopup();
    setTimeout('hideLoop(' + xStep + ',' + yStep + ',' + (step + 1) + ')',10);
  }	
}