///////////////////////////////////////////////////////////////////////////////////////////////
// IMPORTANT: needs mousecapture.js
///////////////////////////////////////////////////////////////////////////////////////////////
// USAGE:
//
// 1) Put non-displayed div into your html-body:
// <div id='picturePreviewer_bigDefault' style='display:none;position:absolute;'></div>
//
// 2) Define CSS for the big image inside the div, e.g.:
// #picturePreviewer_bigImg
// {
//   border:2px solid black;
// }
//
// 3) Instantiate pic previewer:
// var picPreviewer = new TPicturePreviewer();
//
// 4) Add your items (e.g. inside a for-loop:
// picPreviewer.AddItem(bigPicPath,smallDivId,bigPicWidth,bigPicHeight,bigDivId);
//
// bigPicPath .... path of the big picture
// smallDivId .... id of the container of the small picture (currently not needed)
// bigPicWidth ... width of the big picture (needed for finding right position)
// bigPicHeight .. height of the big picture (needed for finding right position)
// bigDivId ...... id of the container of the big picture (if "", it will automatically be taken "picturePreviewer_bigDefault"
// 
///////////////////////////////////////////////////////////////////////////////////////////////
var picturePreviewer_currentOpenItem=-1;
var picturePreviewer_currentCloseItem=-1;
var picturePreviewerArray = new Array();

function PicturePreviewer_OnMouseOver_small(that)
{
  if (picturePreviewer_currentOpenItem>=0)
  {
//*
    var windowSizeX = GetWindowSizeX()-25;
    var windowSizeY = GetWindowSizeY();
//*/
/*
    var windowSizeX = GetBodySizeX()-25;
    var windowSizeY = GetBodySizeY();
//*/    
    //--------------------------------------------------------------------------
    // Consider scroll position inside window
    var windowScrollPosX = GetWindowScrollPosX();
    var windowScrollPosY = GetWindowScrollPosY();
    windowSizeX += windowScrollPosX;
    windowSizeY += windowScrollPosY;
    //--------------------------------------------------------------------------
    // Get mouse position
    var mousePosX = globalMousePositionObject['x'];
    var mousePosY = globalMousePositionObject['y'];
    var mousePosXOrig = mousePosX;
    var mousePosYOrig = mousePosY;
    //--------------------------------------------------------------------------
    // Consider space, so that onmouseover will not always be thrown
    var mouseOverSpace=8;
    
    if (mousePosX<(windowSizeX+windowScrollPosX)/2) mousePosX+=mouseOverSpace;
    else mousePosX-=mouseOverSpace;
    if (mousePosX<0) mousePosX=0;
    
    if (mousePosY<(windowSizeY+windowScrollPosY)/2) mousePosY+=mouseOverSpace;
    else mousePosY-=mouseOverSpace;
    if (mousePosY<0) mousePosY=0;
    
/*    
mousePosX+=8;
mousePosY-=8;
*/
    //--------------------------------------------------------------------------
    var myLeft = mousePosX;
    if (myLeft + picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicWidth'] > windowSizeX) myLeft = windowSizeX-picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicWidth'];
    if (myLeft<0) myLeft=0;

    var myTop = mousePosY;
    if (myTop + picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicHeight'] > windowSizeY) myTop = windowSizeY-picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicHeight'];
    if (myTop<0) myTop=0;
    //--------------------------------------------------------------------------
    // Is the mousepointer over the picture (small picture not to see?) if yes - change position
    var mouseOverLapX;
    var mouseOverLapY;
    if (mousePosX>myLeft && mousePosX<myLeft+picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicWidth']) mouseOverLapX=true;
    if (mousePosY>myTop && mousePosY<myTop+picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicHeight']) mouseOverLapY=true;
    
    if (mouseOverLapX && mouseOverLapY)
    {
      var tmpMyTop;
      var tmpMyLeft;

      tmpMyTop = mousePosY-picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicHeight'];
      if (tmpMyTop<0)
      {
        myTop=0;
        
        tmpMyLeft = mousePosX-picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicWidth'];
        if (tmpMyLeft<0)
        {
          tmpMyLeft=0;
        }
        myLeft=tmpMyLeft;
      }
      else myTop=tmpMyTop;
    }
    //--------------------------------------------------------------------------
    // Is the big picture over the mousepointer? if yes - change position
    var bigOverLapMouseX;
    var bigOverLapMouseY;
    if (mousePosXOrig>myLeft && mousePosXOrig<myLeft+picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicWidth']) bigOverLapMouseX=true;
    if (mousePosYOrig>myTop && mousePosYOrig<myTop+picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicHeight']) bigOverLapMouseY=true;
/*
if (bigOverLapMouseX) alert("bigOverLapMouseX");
if (bigOverLapMouseY) alert("bigOverLapMouseY");
*/  
    if (bigOverLapMouseX && bigOverLapMouseY)
    {
      var diffX_left = mousePosXOrig-myLeft;
      var diffX_right = mousePosXOrig-(myLeft+picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicWidth']);
      var diffY_top = mousePosYOrig-myTop;
      var diffY_bottom = mousePosYOrig-(myTop+picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicHeight']);

      if (diffX_left<0 && diffX_right<0)
      {
        if (diffX_left<diffX_right) diffX_right=0;
        else diffX_left=0;
      }
      if (diffY_top<0 && diffY_bottom<0)
      {
        if (diffY_top<diffY_bottom) diffY_bottom=0;
        else diffY_top=0;
      }
      
      if (diffX_left<0)
      {
        myLeft-=diffX_left+mouseOverSpace;
      }
      if (diffX_right<0)
      {
        myLeft+=diffX_right-mouseOverSpace;
      }
      if (diffY_top<0)
      {
        myTop-=diffY_bottom+mouseOverSpace;
      }
      if (diffY_bottom<0)
      {
        myTop+=diffY_bottom-mouseOverSpace;
      }
    }
    //--------------------------------------------------------------------------
    picturePreviewerArray[picturePreviewer_currentOpenItem]['bigDivObject'].innerHTML="<img id='picturePreviewer_bigImg' src='"+picturePreviewerArray[picturePreviewer_currentOpenItem]['bigPicPath']+"'>";
    picturePreviewerArray[picturePreviewer_currentOpenItem]['bigDivObject'].style.top=myTop+"px";
    picturePreviewerArray[picturePreviewer_currentOpenItem]['bigDivObject'].style.left=myLeft+"px";
    picturePreviewerArray[picturePreviewer_currentOpenItem]['bigDivObject'].style.display="block";
    
    picturePreviewer_currentOpenItem=-1;
  }
}

function PicturePreviewer_OnMouseOut_small(that)
{
  if (picturePreviewer_currentCloseItem>=0)
  {
    picturePreviewerArray[picturePreviewer_currentCloseItem]['bigDivObject'].style.display="none";
    picturePreviewer_currentCloseItem=-1;
  }
}

  function PicturePreviewer_CacheItem(index)
  {
    var img = new Image();
    img.src = picturePreviewerArray[index]['bigPicPath'];
  }


function TPicturePreviewer()
{
  var itemsCounter;
  var mouseOverTimeout;
  var mouseOutTimeout;
  var currentItem;

  this.Init=Init;
  this.AddItem=AddItem;
  this.CacheItem=CacheItem;
  
  this.Init();

  function Init()
  {
    this.itemsCounter=0;
    this.mouseOverTimeout_small=500;
    this.mouseOutTimeout_small=300;
    picturePreviewer_currentOpenItem=-1;
  }
  
  function AddItem(bigPicPath,smallDivId,bigPicWidth,bigPicHeight,bigDivId)
  {
    if (!bigDivId) bigDivId="picturePreviewer_bigDefault";
    picturePreviewerArray[this.itemsCounter] = new Object();
    picturePreviewerArray[this.itemsCounter]['bigPicPath'] = bigPicPath;
    picturePreviewerArray[this.itemsCounter]['bigPicWidth'] = bigPicWidth;
    picturePreviewerArray[this.itemsCounter]['bigPicHeight'] = bigPicHeight;
    picturePreviewerArray[this.itemsCounter]['smallDivId'] = smallDivId;
    picturePreviewerArray[this.itemsCounter]['bigDivId'] = bigDivId;
    
    picturePreviewerArray[this.itemsCounter]['smallDivObject'] = document.getElementById(picturePreviewerArray[this.itemsCounter]['smallDivId']);
    picturePreviewerArray[this.itemsCounter]['bigDivObject'] = document.getElementById(picturePreviewerArray[this.itemsCounter]['bigDivId']);
    
    picturePreviewerArray[this.itemsCounter]['bigDivOpenOnNext'] = false;
    
    // Define mouseover-event for the small object
    
//    var tmpEventCode = "picturePreviewerArray["+this.itemsCounter+"]['smallDivObject'].onmouseover=function(){picturePreviewerArray["+this.itemsCounter+"]['bigDivOpenOnNext']=true;picturePreviewer_currentOpenItem="+this.itemsCounter+";picturePreviewer_currentCloseItem=-1;setTimeout('PicturePreviewer_OnMouseOver_small(this)',"+this.mouseOverTimeout_small+");};";
    var tmpEventCode = "picturePreviewerArray["+this.itemsCounter+"]['smallDivObject'].onmouseover=function(){picturePreviewerArray["+this.itemsCounter+"]['bigDivOpenOnNext']=true;picturePreviewer_currentOpenItem="+this.itemsCounter+";picturePreviewer_currentCloseItem=-1;PicturePreviewer_CacheItem("+this.itemsCounter+");setTimeout('PicturePreviewer_OnMouseOver_small(this)',"+this.mouseOverTimeout_small+");};";

    eval(tmpEventCode);
    
    var tmpEventCode = "picturePreviewerArray["+this.itemsCounter+"]['smallDivObject'].onmouseout=function(){picturePreviewerArray["+this.itemsCounter+"]['bigDivOpenOnNext']=false;picturePreviewer_currentOpenItem=-1;picturePreviewer_currentCloseItem="+this.itemsCounter+";setTimeout('PicturePreviewer_OnMouseOut_small(this)',"+this.mouseOutTimeout_small+");};";
    eval(tmpEventCode);

    this.itemsCounter++;
  }

  function CacheItem(index)
  {
    PicturePreviewer_CacheItem(index);
  }
}