var DROP_DOWN_SPEED = 10;
var DROP_DOWN_TIMER = 15;

function dropDownMenu(id) {
  var header = document.getElementById(id + "_header");
  var content = document.getElementById(id + "_content");
  clearInterval(content.timer);
  clearTimeout(header.timer);
  if (content.maxh) {
    if (content.maxh <= content.offsetHeight) {
      return;
    }
  }
  else {
    content.style.display = "block";
    content.style.height = "auto";
    content.maxh = content.offsetHeight;
    content.style.height = "0";
  }
  content.timer = setInterval(function() { slideDropDown(content, 1) }, DROP_DOWN_TIMER);
}

function startDropDownTimeout(id) {
  var header = document.getElementById(id + "_header");
  var content = document.getElementById(id + "_content");
  clearInterval(content.timer);
  header.timer = setTimeout(function() { collapseDropDown(content) }, 50); 
}

function collapseDropDown(content) {
  content.timer = setInterval(function() { slideDropDown(content, -1) }, DROP_DOWN_TIMER);
}

function cancelDropDownHide(id) {
  var header = document.getElementById(id + '_header');
  var content = document.getElementById(id + '_content');
  clearTimeout(header.timer);
  clearInterval(content.timer);
  if(content.offsetHeight < content.maxh) {
    content.timer = setInterval(function() { slideDropDown(content, 1) }, DROP_DOWN_TIMER);
  }
}

function slideDropDown(content, direction) {
  var currentHeight = content.offsetHeight;
  var distance;
  if (direction == 1) {
    distance = (Math.round((content.maxh - currentHeight) / DROP_DOWN_SPEED));
  } 
  else {
    distance = (Math.round(currentHeight / DROP_DOWN_SPEED));
  }
  if (distance <= 1 && direction == 1) {
    distance = 1;
  }
  content.style.height = currentHeight + (distance * direction) + "px";
  content.style.opacity = currentHeight / content.maxh;
  content.style.filter = "alpha(opacity=" + (currentHeight * 100 / content.maxh) + ")";
  if ((currentHeight < 2 && direction != 1) || (currentHeight > (content.maxh - 2) && direction == 1)) {
    clearInterval(content.timer);
  }
}