var ImagePopup =
{
  floatLeft: true,
  popupDiv: null,
  timeout: null,
  getPopupDiv: function()
  {
    if ( this.popupDiv == null )
      this.popupDiv = document.getElementById( "imagepopupdiv" );

    return this.popupDiv;
  },
  over: function( e, img )
  {
    if ( !e )
      e = window.event;

    var x = ( e.pageX == null ? e.clientX : e.pageX );
    var y = ( e.pageY == null ? e.clientY : e.pageY );

    if ( navigator.appName == "Microsoft Internet Explorer" )
    {
      x += getScrollLeft();
      y += getScrollTop();
    }

    clearTimeout( this.timeout );
    
    var popupDiv = this.getPopupDiv();

    popupDiv.getElementsByTagName( "img" )[0].src = img.src;
    
    popupDiv.style.display = "block";

    var width  = popupDiv.offsetWidth;
    var height = popupDiv.offsetHeight;
    var left   = 0;
    var top    = 0;

    popupDiv.style.display = "none";

    if ( this.floatLeft )
      left = x - 20 - width;
    else
      left = x + 20;

    top = y - ( height / 2 );

    if ( left < getScrollLeft() )
      left = x + 20;
    else if ( left + width > getScrollLeft() + getClientWidth() )
      left = x - 20 - width;

    if ( top + 20 < getScrollTop() )
      top = getScrollTop() + 20;
    else if ( top + height + 20 > getScrollTop() + getClientHeight() )
      top = getScrollTop() + getClientHeight() - height - 20;

    popupDiv.style.left    = left + "px";
    popupDiv.style.top     = top + "px";
    popupDiv.style.display = "block";
  },
  hide: function()
  {
    var popupDiv = ImagePopup.getPopupDiv();

    popupDiv.style.display = "none";
  },
  out: function()
  {
    this.timeout = setTimeout( this.hide, 250 );
  }
}