/*
  pulldown
  
  javascript:
    $('div#menu>ul>li').webetui_pulldown({aniLen:300, hideDelay:500, slideUp:false})

  styles:
    div#menu li div.container { z-index:100; position:absolute; visibility:hidden; overflow:hidden; }

  html:
    <div id="menu">
      [WebEtui::menu(menu)]
    </div>
*/
  
  
(function($) {
  var opts;
  var menus = [];
  $.fn.webetui_pulldown_show = function() {
    return this.each(function() {
      showmenu(this);
    })
  };

  $.fn.webetui_pulldown_hide = function() {
    return this.each(function() {
      hidenow(this.menuId);
    })
  };

  $.fn.webetui_pulldown = function(options) {
    opts = $.extend({
      aniLen    : 250,
      showDelay : 300,
      hideDelay : 1000,
      fadeOut   : 800,
      slideUp   : true,
      clickA    : false   /* klik op hoofdpagina toont menu (true) of opent pagina (false) */
    }, options || {});

    return this.each(function() {
      if ($('ul', this).length > 0)
        initmenu(this);
    });
  };
  
  function initmenu(li) {
    var i = menus.length;
    // alert($(li).html());
    var div = $('<div class="container"/>');
    $(li).append(div.append($(li).children('ul')));
    
    var ul2 = $('ul', li);
    li.accelConst     = (0 - ul2.height()) / opts.aniLen / opts.aniLen
    div.height(ul2.height());
    div.css('left', 0);
    
    $('li:last-child', ul2).addClass('lastchild');
    
    menus[i] = li;
    li.menuId = i;
    li.onmouseover = function() { showmenu(this) };
    li.onmouseout  = function() { hidemenu(this) };
    
    if (opts.clickA) {
      $(li).children('a').click(function() {
        shownow(li.menuId);
        return false;
      });
    }
  };
  
  function showmenu(node) {
    if (node.showTimer) clearInterval(node.showTimer)
  	if (node.open)
      shownow(node.menuId);
  	else
  	  node.showTimer = setInterval( (function(i){ return function() { shownow(i) }})(node.menuId), opts.showDelay);
  }
  
  function shownow(i) {
    var node = menus[i];
    clearInterval(node.showTimer);
    $(node).addClass('hover');
    for(var i=0; i<menus.length; i++)
      if(menus[i] != node) 
        hidenow(i);
   	if (node.hideTimer) window.clearTimeout(node.hideTimer)
      node.hideTimer = 0
    if (!node.open) startSlide(node, true);
  }
  
  function hidemenu(node) {
    if (node.showTimer) window.clearInterval(node.showTimer);
    if (node.hideTimer) window.clearInterval(node.hideTimer);
    $(node).removeClass('hover');
  	node.hideTimer = setInterval( (function(i){ return function() { hidenow(i) }})(node.menuId), opts.hideDelay);
  }
  
  function hidenow(i) {
    var node = menus[i];
//    clearInterval(node.showTimer);
    if (node && node.open && !node.aniTimer) {
      if (opts.slideUp) {
        startSlide(node, false);
      } else {
        node.open = false;
        $('div', node).fadeOut(opts.fadeOut, function() { $('div',node).show(); endSlide(node) } );
      }
      clearInterval(node.hideTimer);
    }
  }

  function slide(i) {
    var node = menus[i];
    var date = new Date();
    var elapsed = date.getTime() - node.startTime;
    if (elapsed > opts.aniLen) 
          endSlide(node);
    else {
          var d = Math.round(Math.pow(opts.aniLen - elapsed, 2) * node.accelConst)
          if (node.open)
           $('ul', node).css('top', d + "px");
     else 
           $('ul', node).css('top', function() { return -$(this).height() - d + "px" });
    }
  }

  function startSlide(node, open) {
  	node.open = open;
  	$('ul', node).css('top', function() { return -$(this).height() + 'px' } );
    $('div.container, ul', node).css('visibility', 'visible');
  	node.startTime = (new Date()).getTime();
    // omdat IE geen 3e argument op setInterval ondersteunt:
  	// FF en Safari: node.aniTimer = setIntervalf(slide, 10, node.menuId);
    node.aniTimer = setInterval( (function(i){ return function() { slide(i) }})(node.menuId), 10);
  }
  
  
  function endSlide(node) {
  	node.aniTimer = window.clearInterval(node.aniTimer)
  	//node.moveTo(node.open ? node.outPos : node.homePos)
  	if (!node.open) {
      $('div.container, ul', node).css('visibility', 'hidden');
    }
    if (node.open) {
    	$('ul', node).css('top', 0);
    }
  	//if ((node.open && !node.over) || (!node.open && node.over)) {
    //  startSlide()
    //	}
    if (!node.open) $(node).removeClass('hover');
  }
  
  
})(jQuery);



