/*
 * Updates:
 * 2010-05-10:
 *  1.  IE mouse capture gefixed. Het bevonden probleem: 
 *     De mouse events worden niet afgevuurd buiten de afmetingen van het document object,
 *     window object en het Internet Explorer scherm zelf. Deze 'capture' moet expliciet
 *     aangegeven worden met overlaySpan.setCapture(true) en overlaySpan.releaseCapture();
 *    Hierdoor werd de mouseup niet gedetecteerd waardoor het draggen doorging terwijl er géén
 *    muisknop ingedrukt was.
 *  2.  Mouse coördinaten werden geretourneerd in een (wegwerp) object wat voor elke return opnieuw
 *    geïnitialiseerd werd. Deze hebben nu in de globale scope één enkele instantie die geupdate wordt.
 *    Dit is ten bate van de performance.
 *
 * 2010-05-11
 *  1.  Als de splitterbar én container in een iframe of frame embedded zijn, werd de onmouseup event afgehandeld door het
 *    window object in desbetreffende frame. Het window object daarboven tot aan het toplevel window object aan toe vingen
 *    daardoor niet de onmouseup event af. Dit is verholpen door te iteraten tot en met het toplevel window object
 *    en aan elke window de eventhandler te hangen. 
 */

var splitterbarElement;
var isVertical;
var previousElement, nextElement;
var containerElement;
var overlaySpan;

var clearance;
var trackCursor = false;

var currentCoords = {x:0, y:0};
var startCoords = {x:0, y:0};

var count = 0;

function setSplitterbarContainer(elementId)
{
  containerElement = document.getElementById(elementId);
  overlaySpan = document.createElement('span');
  overlaySpan.style.display = 'none';
  overlaySpan.style.position = 'absolute';
  
  //overlaySpan.style.backgroundColor = 'Orange';

  overlaySpan.style.zIndex = 10;
  overlaySpan.onmousemove = dragSplitterbar;
  overlaySpan.onmouseup = unsetCursorTracker;

  // Het window object staat mouse capture buiten het browser scherm wél impliciet toe in non-IE browsers
  // window.onmouseup = unsetCursorTracker;
  
  // FF Frame embedding workaround
  var topWindow = window;
  topWindow.onmouseup = unsetCursorTracker;
  while(topWindow.parent !== topWindow)
  {
    topWindow = topWindow.parent;
    topWindow.onmouseup = unsetCursorTracker;
  }
  
  
  
  containerElement.appendChild(overlaySpan);
}

function makeSplitterbar(elementId)
{
  splitterbarElement = document.getElementById(elementId);
  splitterbarElement.draggable = true;
  splitterbarElement.onmousedown = setCursorTracker;
  
  if(makeSplitterbar.arguments[1])
  {
    previousElement = document.getElementById(makeSplitterbar.arguments[1]);
  }
  else
  {
    previousElement = splitterbarElement.previousSibling;
  }
  
  if(makeSplitterbar.arguments[2])
  {
    nextElement = document.getElementById(makeSplitterbar.arguments[2]);
  }
  else
  {
    nextElement = splitterbarElement.nextSibling;
  }
  
  if(getElementHeight(splitterbarElement) >= getElementWidth(splitterbarElement) || makeSplitterbar.arguments[3] == true)
  {
    isVertical = true;
  }
  else
  {
    isVertical = false;
  }
  
  if(isVertical)
  {
    //splitterbarElement.onmouseover = function() { document.body.style.cursor = 'e-resize' };
    //splitterbarElement.style.backgroundImage = "url('vgrabber.gif')";
  }
  else
  {
    //splitterbarElement.onmouseover = function() { document.body.style.cursor = 'n-resize' };
    //splitterbarElement.style.backgroundImage = "url('hgrabber.gif')";
  }
  
  //splitterbarElement.style.backgroundPosition = "center center";
  //splitterbarElement.style.backgroundRepeat = "no-repeat";
  
  clearance = {  previous: getPreviousElementSize(),
          next: getNextElementSize(),
          oPrevious: 0,
          oNext: 0
  };
}

function setCursorTracker(e) {
    if (!trackCursor) {
        overlaySpan.style.top = "0px";
        overlaySpan.style.left = "0px";
        overlaySpan.style.width = getElementWidth(containerElement) + "px";
        //HACK LRF: Height *2 voor FF, werkt beter
        overlaySpan.style.height = getElementHeight(containerElement) * 2 + "px"; 
        overlaySpan.style.display = 'block';

        // IE: Mouse capture voor buiten overlaySpan afmetingen aanzetten
        if (overlaySpan.setCapture) {
            overlaySpan.setCapture(true);
        }

        updateMouseCoords(e, startCoords);

        determineClearance();
        trackCursor = true;
    }
}

function unsetCursorTracker()
{
  if(trackCursor)
  {
    trackCursor = false;
    determineClearance();
    startCoords.x = startCoords.y = 0;
    
    // IE: Mouse capture voor buiten overlaySpan afmetingen vrijgeven
    if(overlaySpan.releaseCapture)
    {
      overlaySpan.releaseCapture();
    }
    
    overlaySpan.style.display = 'none';
    document.body.style.cursor = 'auto';
  }
}

function determineClearance()
{
  clearance.oPrevious = getPreviousElementSize();
  clearance.oNext = getNextElementSize();
}

function getPreviousElementSize()
{
  if(isVertical)
  {
    return getElementWidth(previousElement);
  }
  else
  {
    return getElementHeight(previousElement);
  }
}

function getNextElementSize()
{
  if(isVertical)
  {
    return getElementWidth(nextElement);
  }
  else
  {
    return getElementHeight(nextElement);
  }
}


function dragSplitterbar(e)
{
  if(trackCursor)
  {
    updateMouseCoords(e, currentCoords);
    var clearanceDifference;

    if(isVertical)
    {
      clearanceDifference = currentCoords.x - startCoords.x;
      
      clearance.previous = clearance.oPrevious + clearanceDifference;
      clearance.next = clearance.oNext - clearanceDifference;

      if(clearance.previous > 0 && clearance.next > 0)
      {
        window.previousElement.style.width = clearance.previous + "px";
        window.nextElement.style.width = clearance.next + "px";
      }
    }
    else
    {
      clearanceDifference = currentCoords.y - startCoords.y;
      
      clearance.previous = clearance.oPrevious + clearanceDifference;
      clearance.next = clearance.oNext - clearanceDifference;

      if(clearance.previous > 0 && clearance.next > 0)
      {
        window.previousElement.style.height = clearance.previous + "px";
        window.nextElement.style.height = clearance.next + "px";
      }
    }
  }
}

function updateMouseCoords(e, coords)
{
  e = e || window.event;
  
  if(e.pageX || e.pageY)
  { 
    coords.x = e.pageX;
    coords.y = e.pageY;
  } 
  else
  {
    coords.x = e.clientX + document.body.scrollLeft - document.body.clientLeft;
    coords.y = e.clientY + document.body.scrollTop  - document.body.clientTop;
  }
}

// De volgende functies zijn er omdat niet in alle browsers de resulterende afmetingen van objecten in
// een dergelijke veelvoud vermeldt worden.

function getElementHeight(element) {
    return Math.max(
    element.scrollHeight,
    element.offsetHeight,
    element.clientHeight
    );
}

function getElementWidth(element) {
    return Math.max(
    element.scrollWidth,
    element.offsetWidth,
    element.clientWidth
    );
}