var DDSPEED = 5;
var DDTIMER = 16;

function ddFolder(id){
  var h = document.getElementById(id + '-ddheader');
  var c = document.getElementById(id + '-ddcontent');

  clearInterval( c.timer );
  if( !c.flag ) {
  	clearTimeout( h.timer );
    c.flag = true; // Open toggled
    
    // Initialize content box only when it is folded completely.
    if (c.style.display=='none') {
   		c.style.display = 'block';
    	c.style.height = '0px';
    }
    
    if( c.maxh && c.maxh <= c.offsetHeight ) { return }
    else if( !c.maxh ){
      c.style.display = 'block';
      c.style.height = 'auto';
      c.maxh = c.offsetHeight;
      c.style.height = '0px';
    }
    c.timer = setInterval( function(){ ddSlide(c, 1) }, DDTIMER );
  } else {
    h.timer = setTimeout( function(){ ddCollapse(c) }, 50 );
    c.flag = false; // Closing toggled
  }
}

// collapse the menu //
function ddCollapse(c){
  c.timer = setInterval( function(){ ddSlide( c, -1 ) }, DDTIMER );
}

// incrementally expand/contract the dropdown and change the opacity //
function ddSlide(c, d){
  var currh = c.offsetHeight;
  var dist;
  
  if( d == 1 ){
    dist = ( Math.round(( c.maxh - currh ) / DDSPEED ));
  } else {
    dist = ( Math.round( currh / DDSPEED ));
  }
  if( dist <= 1 && d == 1 ){
    dist = 1;
  }
  
  c.style.height = currh + ( dist * d ) + 'px';
  c.style.opacity = currh / c.maxh;
  if( ((currh <= 2) && (d != 1)) || (currh > (c.maxh - 2) && d == 1)){
	clearInterval( c.timer );
	if (d!=1) { c.style.display='none'; }
  }
  
}