/*****************************************************************************
 *                                 menuLayer.js                              *
 *                       Copyright © 2006 OrangeDesign.nl                    *
 *     All code from our site and our customers belongs to OrangeDesign.nl   *
 *		Do not use anything from these site without permissions!     *
 *									     *
 *		       For questions: mail us @ info@orangedesign.nl         *
 *****************************************************************************/


// Abstract class Point, to be used as super class.
function Point(x,y) {
  this.x = x;
  this.y = y;
}

// Get the Mouse position relative to the document.
function MousePoint(event) {
  if (!document.all) { // NetScape Compatible browser.
    this.x = event.pageX;
    this.y = event.pageY;
  }
  else if (document.compatMode == "CSS1Compat") { // Internet Explorer 6 Standards compatibility mode.
    this.x = event.x + document.body.parentNode.scrollLeft;
    this.y = event.y + document.body.parentNode.scrollTop;
  }
  else { // Other Internet Explorer.
    this.x = event.x + document.body.scrollLeft;
    this.y = event.y + document.body.scrollTop;
  }
}

// Get the Element position relative to the document.
function ElementPoint(element) {
  this.x = 0;
  this.y = 0;
  if (element.offsetParent) {
    while (element.offsetParent) {
      this.x += element.offsetLeft;
      this.y += element.offsetTop;
      element = element.offsetParent;
    }
  }
  else if (element.x) {
    this.x += element.x;
    this.y += element.y;
  }
  if (document.all) { // This browser is Internet Explorer, seems to miss 2px offset.
    this.x += 2;
    this.y += 2;
  }
}

// Get the width of an element.
function getWidth(element) {
  return element.offsetWidth;
}

// Get the height of an element.
function getHeight(element) {
  return element.offsetHeight;
}

// Box class, gives us positioning information about an element relative to the document.
function Box(element) {
  var point = new ElementPoint(element);
  this.x = point.x;
  this.y = point.y;
  this.x2 = this.x+getWidth(element)-1;
  this.y2 = this.y+getHeight(element)-1;
}

// Returns true if an point is in the area of a box.
function isPointOnBox(point,box) {
  if (point.x >= box.x && point.x <= box.x2 && point.y >= box.y && point.y <= box.y2) {
    return true;
  }
  return false;
}

// Sets the opacity of an html element. value is in the range of 0-100
function setOpacity(element,value) {
  if (value == null) {
    value = 100.0;
  }
  element.style.opacity = value/100;
  element.style.filter = 'alpha(opacity=' + value + ')';
}

function showMenuLayer(button,layer,opacity) {
  setOpacity(button,opacity);
  if (layer != null) {
    layer.style.display='block';
  }
}

/* This function determinates if the mouse is on a button or layer. If not it will hide it.
   This function should be called in the onmouseout event attribute of both the button and layer element.
*/
function hideMenuLayer(event,button,layer,opacity) {
  var mousePoint = new MousePoint(event);
  //alert("mousePoint: "+mousePoint.x+","+mousePoint.y+"\n\nbuttonBox:\nX: "+buttonBox.x+","+buttonBox.x2+"\nY: "+buttonBox.y+","+buttonBox.y2+"\n\nlayerBox:\nX: "+layerBox.x+","+layerBox.x2+"\nY: "+layerBox.y+","+layerBox.y2);

  if (!isPointOnBox(mousePoint,new Box(button))) {
    if (layer != null) {
      if (!isPointOnBox(mousePoint,new Box(layer))) {
        layer.style.display = 'none';
        setOpacity(button,opacity);
      }
    }
    else {
      setOpacity(button,opacity);
    }
  }
}