/*
  This file provides two versions of the slide-menu: the [slideMenu] and the [SlidingMenu]:
    slideMenu:    adjusted version where almost everything is adjustable in the constructor (see #CONSTRUCTOR1)
    SlidingMenu:  original version with slight adjustments and added functionality, abstracted away from constructor (see #CONSTRUCTOR2) -
                  constructor is like in original version, while i.e. the animation length property is settable by
                  an external function (setAnimationLength()).
                  functions (all static):
                    SlidingMenu.showMenu(menuname);
                    SlidingMenu.hideMenu(menuname);
                    SlidingMenu.setAnimationLength(value);
                    SlidingMenu.setHideDelay(value);
*/

slideMenu.Registry = [];
slideMenu.aniLen = 200;
slideMenu.minCPUResolution = 10;
slideMenu.hideDelay = 250;
var callback = null;
// #CONSTRUCTOR1
function slideMenu(id, dir, left, top, width, height, aniLen, hideDelay, autohide, relative,startclosed)
{
  if(relative == undefined || relative==null)
    this.relative = false;
  else
    this.relative = relative;

  if(startclosed==undefined || startclosed==null)
    this.startclosed = false
  else
    this.startclosed = startclosed

  if(aniLen != undefined && aniLen != null) slideMenu.aniLen = aniLen;
  if(hideDelay != undefined && hideDelay != null) slideMenu.hideDelay = hideDelay;
  this.ie = document.all ? 1 : 0;
  this.ns4 = document.layers ? 1 : 0;
  this.dom = document.getElementById ? 1 : 0;

  if(autohide != undefined && autohide != null) {
    this.autoHide = autohide;
  }
  else {
    this.autoHide = true;
  }

  if (this.ie || this.ns4 || this.dom)
  {
    this.id = id;
    this.dir = dir;
    this.orientation = dir == "left" || dir == "right" ? "h" : "v";
    this.dirType = dir == "right" || dir == "down" ? "-" : "+";
    this.dim = this.orientation == "h" ? width : height;
    this.hideTimer = false;
    this.aniTimer = false;
    this.open = false;
    this.over = false;

    this.startTime = 0;
    this.gRef = "slideMenu_"+id;
    eval(this.gRef+"=this");
    slideMenu.Registry[id] = this;
    var d = document;
    d.write('<style type="text/css">');
    d.write('#' + this.id + 'Container { ');

    if (!this.relative)
    {
      d.write('visibility:hidden;');
    }
    d.write('overflow:hidden; }');
    if (!this.relative)
      d.write('#' + this.id + 'Container, #' + this.id + 'Content { position: absolute; ');
    else
       d.write('#' + this.id + 'Container, #' + this.id + 'Content { position: relative; ');

      // zet dit in de bovenstaande class voor content: filter:Alpha(opacity=80,style=0); -moz-opacity: 0.8;
    d.write('left:' + left+ 'px; ');
    d.write('top:' + top + 'px; ');
    d.write('width:' + width + 'px; ');
    d.write('height:' + height + 'px; ');
    d.write('clip:rect(0 ' + width + ' ' + height + ' 0); ');
    d.write('}');
    d.write('</style>');

    this.load();
  }
}

slideMenu.prototype.load = function()
{
  var d = document;
  var lyrId1 = this.id + "Container";
  var lyrId2 = this.id + "Content";
  var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1];
  if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2);
  var temp;
  if (!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 100);
  else
  {
    this.container = obj1;
    this.menu = obj2;
    this.style = this.ns4 ? this.menu : this.menu.style;
    this.homePos = eval("0" + this.dirType + this.dim);
    this.outPos = 0;
    this.accelConst = (this.outPos - this.homePos) / slideMenu.aniLen / slideMenu.aniLen;
    // set event handlers.
    if (!this.relative)
    {
      if (this.ns4) this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
      this.menu.onmouseover = new Function("slideMenu.showMenu('" + this.id + "')");
      if(this.autoHide)
      {
          this.menu.onmouseout = new Function("slideMenu.hideMenu('" + this.id + "')");
      }
    }
    //set initial state
    this.endSlide();
  }
}

slideMenu.showMenu = function(id, dont_hideothers)
{
  // this is for fixing the overflow bug in firefox (zoekkaart.aspx)
  for (i=1; i<4;i++)
  {
    if (document.getElementById("resize"+i)!=null)
      document.getElementById("resize"+i).style.overflow="hidden";
  }

  if(dont_hideothers==undefined || dont_hideothers==null)
    dont_hideothers = true

  var reg = slideMenu.Registry;
  var obj = slideMenu.Registry[id];
  if (obj.container)
  {
    obj.over = true;
    if (!dont_hideothers)
    {
      for (menu in reg) if (id != menu) slideMenu.hide(menu);
      if (obj.hideTimer) { reg[id].hideTimer = window.clearTimeout(reg[id].hideTimer); }
    }
   if (!obj.open && !obj.aniTimer) reg[id].startSlide(true);
  }
  menubusy=true;
}

slideMenu.hideMenu = function(id)
{
  // this is for fixing the overflow bug in firefox (zoekkaart.aspx)
  for (i=1; i<4;i++)
  {
    if (document.getElementById("resize"+i)!=null)
      document.getElementById("resize"+i).style.overflow="hidden"
  }

  var obj = slideMenu.Registry[id];
  if (obj.container)
  {
    if (obj.hideTimer) {
      window.clearTimeout(obj.hideTimer);
    }
    obj.hideTimer = window.setTimeout("slideMenu.hide('" + id + "')", slideMenu.hideDelay);
  }
  menubusy=false;
}

slideMenu.hideAll = function()
{
  var reg = slideMenu.Registry;
  for (menu in reg)
  {
    slideMenu.hide(menu);
    if (menu.hideTimer) window.clearTimeout(menu.hideTimer);
  }
}

slideMenu.hide = function(id)
{
  var obj = slideMenu.Registry[id];
  obj.over = false;
  if (obj.hideTimer) {
    window.clearTimeout(obj.hideTimer);
    setTimeout(function() {
      eval(callback);
    }, slideMenu.hideDelay);
  }
  obj.hideTimer = 0;
  if (obj.open && !obj.aniTimer) obj.startSlide(false);
}

slideMenu.prototype.startSlide = function(open)
{
  this[open ? "onactivate" : "ondeactivate"]();
  this.open = open;
  if (open) this.setVisibility(true);
  this.startTime = (new Date()).getTime();
  this.aniTimer = window.setInterval(this.gRef + ".slide()", slideMenu.minCPUResolution);
}

slideMenu.prototype.slide = function()
{
  var elapsed = (new Date()).getTime() - this.startTime;

  if (elapsed > slideMenu.aniLen) this.endSlide();
  else
  {
    var d = Math.round(Math.pow(slideMenu.aniLen-elapsed, 2) * this.accelConst);
    if (this.open && this.dirType == "-") d = -d;
    else if (this.open && this.dirType == "+") d = -d;
    else if (!this.open && this.dirType == "-") d = -this.dim + d;
    else d = this.dim + d;
    this.moveTo(d,elapsed);
  }
}

slideMenu.prototype.endSlide = function()
{
  this.aniTimer = window.clearTimeout(this.aniTimer);
  this.moveTo(this.open ? this.outPos : this.homePos);    // sets the initial top position to -something
  if (!this.relative)
  {
    if (!this.open) { this.setVisibility(false); };
    if (this.autohide && ((this.open && !this.over) || (!this.open && this.over)))
    {
        this.startSlide(this.over);
    }
  } else {
    // this is for fixing the overflow bug in firefox (zoekkaart.aspx)
    for (i=1; i<4;i++)
    {
      if (document.getElementById("resize"+i)!=null)
        document.getElementById("resize"+i).style.overflow="auto"
    }
  }
}

slideMenu.prototype.setVisibility = function(bShow)
{
  var s = this.ns4 ? this.container : this.container.style;
  s.visibility = bShow ? "visible" : "hidden";
}

slideMenu.prototype.moveTo = function(p,elapsed)
{

  content = document.getElementById(this.id+"Content");
  content.style[this.orientation == "h" ? "left" : "top"] = this.ns4 ? p : p + "px";
  endopacity = 100;
  if (elapsed!=null)
    opacity = parseInt(elapsed / slideMenu.aniLen * endopacity);    // returns 100% at the end of the cycle
  else
    opacity = parseInt(endopacity);   // end of slidecycle.

  mozopacity = roundNumber(opacity/100,1);
  if(this.relative)
  {
    parentnode = document.getElementById(this.id+"Container");
    moveto = this.dim + p;
    if(moveto<0)
      moveto = 0;
    parentnode.style[this.orientation == "h" ? "width" : "height"] = this.ns4 ?(moveto) : (moveto) + "px";
  }

}

slideMenu.prototype.getPos = function(c)
{
  return parseInt(this.style[c]);
}

slideMenu.prototype.onactivate = function()
{
}

slideMenu.prototype.ondeactivate = function()
{
}

function roundNumber(num, dec) {
	var result = Math.round(num*Math.pow(20,dec))/Math.pow(20,dec);
	return result;
}

// ================================================================================

SlidingMenu.Registry = [];
SlidingMenu.aniLen = 500;
SlidingMenu.hideDelay = 750;
SlidingMenu.minCPUResolution = 10;
// #CONSTRUCTOR2
function SlidingMenu(id, dir, left, top, width, height,color)
{
  this.ie = document.all ? 1 : 0;
  this.ns4 = document.layers ? 1 : 0;
  this.dom = document.getElementById ? 1 : 0;

  if (this.ie || this.ns4 || this.dom)
  {
    this.id = id;
    this.dir = dir;
    this.orientation = dir == "left" || dir == "right" ? "h" : "v";
    this.dirType = dir == "right" || dir == "down" ? "-" : "+";
    this.dim = this.orientation == "h" ? width : height;
    this.hideTimer = false;
    this.aniTimer = false;
    this.open = false;
    this.over = false;
    this.startTime = 0;
    this.gRef = "SlidingMenu_"+id;
    eval(this.gRef+"=this");
    SlidingMenu.Registry[id] = this;
    var d = document;
    d.write('<style type="text/css">');
    d.write('#' + this.id + 'Container { visibility:hidden; ');
    d.write('overflow:hidden; }');
    d.write('#' + this.id + 'Container, #' + this.id + 'Content { position: absolute; ');
      // zet dit in de bovenstaande class voor content: filter:Alpha(opacity=80,style=0); -moz-opacity: 0.8;
    d.write('width:' + width + 'px; ');
    d.write('height:' + height + 'px; ');
    d.write('clip:rect(0 ' + width + ' ' + height + ' 0); ');
    d.write('}');
    d.write('</style>');
    this.load();
  }
}

SlidingMenu.prototype.load = function()
{
  var d = document;
  var lyrId1 = this.id + "Container";
  var lyrId2 = this.id + "Content";
  var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1];
  if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2);
  var temp;
  if (!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 100);
  else
  {
    this.container = obj1;
    this.menu = obj2;
    this.style = this.ns4 ? this.menu : this.menu.style;
    this.homePos = eval("0" + this.dirType + this.dim);
    this.outPos = 0;
    this.accelConst = (this.outPos - this.homePos) / SlidingMenu.aniLen / SlidingMenu.aniLen;
    // set event handlers.
    if (this.ns4) this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
    this.menu.onmouseover = new Function("SlidingMenu.showMenu('" + this.id + "')");
    this.menu.onmouseout = new Function("SlidingMenu.hideMenu('" + this.id + "')");
    //set initial state
    this.endSlide();
  }
}

SlidingMenu.showMenu = function(id)
{
  var reg = SlidingMenu.Registry;
  var obj = SlidingMenu.Registry[id];
  if (obj.container)
  {
    obj.over = true;
    for (menu in reg) if (id != menu) SlidingMenu.hide(menu);
    if (obj.hideTimer) { reg[id].hideTimer = window.clearTimeout(reg[id].hideTimer); }
    if (!obj.open && !obj.aniTimer) reg[id].startSlide(true);
  }
  menubusy=true;
}

SlidingMenu.hideMenu = function(id)
{
  var obj = SlidingMenu.Registry[id];
  if (obj.container)
  {
    if (obj.hideTimer) window.clearTimeout(obj.hideTimer);
    obj.hideTimer = window.setTimeout("SlidingMenu.hide('" + id + "')", SlidingMenu.hideDelay);
  }
  menubusy=false;
}

SlidingMenu.hideAll = function()
{
  var reg = SlidingMenu.Registry;
  for (menu in reg)
  {
    SlidingMenu.hide(menu);
    if (menu.hideTimer) window.clearTimeout(menu.hideTimer);
  }
}

SlidingMenu.hide = function(id)
{
  var obj = SlidingMenu.Registry[id];
  obj.over = false;
  if (obj.hideTimer) window.clearTimeout(obj.hideTimer);
  obj.hideTimer = 0;
  if (obj.open && !obj.aniTimer) obj.startSlide(false);
}

SlidingMenu.prototype.startSlide = function(open)
{
  this[open ? "onactivate" : "ondeactivate"]();
  this.open = open;
  if (open) this.setVisibility(true);
  this.startTime = (new Date()).getTime();
  this.aniTimer = window.setInterval(this.gRef + ".slide()", SlidingMenu.minCPUResolution);
}

SlidingMenu.prototype.slide = function()
{
  var elapsed = (new Date()).getTime() - this.startTime;
  if (elapsed > SlidingMenu.aniLen) this.endSlide();
  else
  {
    var d = Math.round(Math.pow(SlidingMenu.aniLen-elapsed, 2) * this.accelConst);
    if (this.open && this.dirType == "-") d = -d;
    else if (this.open && this.dirType == "+") d = -d;
    else if (!this.open && this.dirType == "-") d = -this.dim + d;
    else d = this.dim + d;
    this.moveTo(d);
  }
}

SlidingMenu.prototype.endSlide = function()
{
  this.aniTimer = window.clearTimeout(this.aniTimer);
  this.moveTo(this.open ? this.outPos : this.homePos);
  if (!this.open) this.setVisibility(false);
  if ((this.open && !this.over) || (!this.open && this.over))
  {
    this.startSlide(this.over);
  }
}

SlidingMenu.prototype.setVisibility = function(bShow)
{
  var s = this.ns4 ? this.container : this.container.style;
  s.visibility = bShow ? "visible" : "hidden";
}

SlidingMenu.prototype.moveTo = function(p)
{
  this.style[this.orientation == "h" ? "left" : "top"] = this.ns4 ? p : p + "px";
}

SlidingMenu.prototype.getPos = function(c)
{
  return parseInt(this.style[c]);
}

SlidingMenu.prototype.onactivate = function()
{
}

SlidingMenu.prototype.ondeactivate = function()
{
}

SlidingMenu.setAnimationLength = function(val) {
  SlidingMenu.aniLen = val;
}

SlidingMenu.setHideDelay = function(val) {
  SlidingMenu.hideDelay = val;
}
