var DDSPEED = 5;
var DDTIMER = 5;
var z = 0;

// main function to handle the mouse events //
function ddMenu(id,dir,zi) {
  var head = document.getElementById(id + '-ddheader');
  var cont = document.getElementById(id + '-ddcontent');
  var glb = document.getElementById(id + 'Btn');
  clearInterval(cont.timer);
  if(dir == 1) {
  	cont.style.zIndex = zi;
    clearTimeout(head.timer);
    if(cont.maxh && cont.maxh <= cont.offsetWidth) {
      return;
    } else if(!cont.maxh) {
      cont.style.display = 'block';
      // cont.style.width = 'auto';
      cont.maxh = cont.offsetWidth;
      cont.style.width = '0';
	  
		/* alert(cont.maxh); */
    }
    cont.timer = setInterval("ddSlide('" + id + "-ddcontent', '" + id + "Btn', 1)", DDTIMER);
  } else {
    head.timer = setTimeout('ddCollapse(\'' + id + '-ddcontent\', \'' + id + 'Btn\')', 50);
  }
}

// collapse the menu //
function ddCollapse(id,glb) {
  var cont = document.getElementById(id);
  cont.timer = setInterval("ddSlide('" + id + "', '" + glb + "', -1)", DDTIMER);
}

// cancel the collapse if a user rolls over the dropdown content //
function cancelHide(id,glb) {
  var head = document.getElementById(id + '-ddheader');
  var cont = document.getElementById(id + '-ddcontent');
  clearTimeout(head.timer);
  clearInterval(cont.timer);
  if(cont.offsetWidth < cont.maxh) {
    cont.timer = setInterval("ddSlide('" + id + "-ddcontent', '" + id + "Btn', 1)", DDTIMER);
  }
}

// incrementally expand/contract the dropdown and change the opacity //
function ddSlide(id,glb,dir) {
	var cont = document.getElementById(id);
	var glbbtn = document.getElementById(glb);
	var currwidth = cont.offsetWidth;
	var dist;
  if(dir == 1) {
	dist = (Math.round((cont.maxh - currwidth) / DDSPEED));
  } else {
    dist = (Math.round(currwidth / DDSPEED));
  }
  
  if(dist <= 2 && dir == 1) {
    dist = 1;
  }
  cont.style.width = currwidth + (dist * dir) + 'px';
  cont.style.opacity = currwidth / cont.maxh;
  cont.style.filter = 'alpha(opacity=' + (currwidth * 100 / cont.maxh) + ')';
  if((currwidth < 5 && dir != 1) || (currwidth > (cont.maxh - 2) && dir == 1)) {
	  if(dir != 1){
  		cont.style.width = 0;		
	  }
    clearInterval(cont.timer);
  }
}