var MenuHandler = {
  timerID  : false,
  state    : 'hidden',
  progress : 0.0,
  
  menuEl : false,

  init: function() {
    MenuHandler.writeInlineStyle('ul#products-dropdown { visibility: hidden; text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif; }');

    MenuHandler.onDomReady(MenuHandler.startup);
  },
  
  startup: function() {
    var productsitem = MenuHandler.findProductsItem();
    if (!productsitem) return;
    
    MenuHandler.menuEl = document.getElementById('products-dropdown');
    
    var root = document.documentElement ? document.documentElement : document.body;
    
    root = document.getElementsByTagName('body')[0];
    
    var oldPos = MenuHandler.getElementPosition(MenuHandler.menuEl);
    
    root.appendChild(MenuHandler.menuEl);
    
    MenuHandler.menuEl.style.left = oldPos[0] + 'px';
    MenuHandler.menuEl.style.top  = oldPos[1] + 'px';
    
    var kids = MenuHandler.menuEl.childNodes;
    for(var i=0; i<kids.length; i++) {

    }
    
    MenuHandler.addEvent(productsitem, 'mouseover', MenuHandler.showMenu, false);
    MenuHandler.addEvent(productsitem, 'mouseout', MenuHandler.hideMenu, false);
    MenuHandler.addEvent(MenuHandler.menuEl, 'mouseover', MenuHandler.showMenu, false);
    MenuHandler.addEvent(MenuHandler.menuEl, 'mouseout', MenuHandler.hideMenu, false);

    
    timerID = setInterval(MenuHandler.tick, 50);
  },
  
  tick: function() {
    var diff;
    
    switch (MenuHandler.state) {
    case 'showing':
      diff = (1.0 - MenuHandler.progress) / 5.0; if (diff < 0.01) { diff = 0.01; }
      MenuHandler.progress += diff;
      if (MenuHandler.progress >= 1.0) {
        MenuHandler.progress = 1.0;
        MenuHandler.state = 'visible';
      }
      MenuHandler.updateMenuOpacity();
      break;
    case 'hiding':
      diff = (0.0 - MenuHandler.progress) / 5.0; if (diff > -0.01) { diff = -0.01; }
      MenuHandler.progress += diff;
      if (MenuHandler.progress <= 0.0) {
        MenuHandler.progress = 0.0;
        MenuHandler.state = 'hidden';
      }
      MenuHandler.updateMenuOpacity();
      break;
    }
    
    var pos = MenuHandler.getElementPosition(MenuHandler.menuEl);
    
    //document.title = pos[0] + ", " + pos[1] + "  :  " + Math.floor(0.5 + 100.0 * MenuHandler.progress) + '%';
  },
  
  updateMenuOpacity : function() {
    var amount = MenuHandler.progress;
    amount = Math.sin(Math.PI * 0.5 * amount * amount);
    
    amount *= 0.9;
    
    MenuHandler.setOpacity(MenuHandler.menuEl, amount);
  },
  
  showMenu: function() {
    switch (MenuHandler.state) {
    case 'hiding':
    case 'hidden':
      MenuHandler.state = 'showing';
    }
  },
  
  hideMenu: function() {
    switch (MenuHandler.state) {
    case 'showing':
    case 'visible':
      MenuHandler.state = 'hiding';
    }
  },
  
  findProductsItem: function() {
    var topmenu = MenuHandler.findTopMenu();
    if (!topmenu) return;
    var ret;
    for (var i=0; i<topmenu.childNodes.length; i++) {
      if (ret = (function(el) {
        if ( (' ' + el.className + ' ').indexOf(' products ') > -1) {
          return el;
        }
        return false;
      })(topmenu.childNodes[i])) {
        return ret;
      }
    }
  },
  
  findTopMenu: function() {
    var hdr = document.getElementById("header");
    if (!hdr) return;
    var uls = document.getElementsByTagName("ul");
    if (!uls) return;
    return uls[0];
  },
  
	setOpacity: function(el, opacity) {
    if (opacity == 1 && (/Firefox/.test(navigator.userAgent))) {
      el.style.opacity = "";
      if (el.style.visibility != "visible") el.style.visibility = "visible";
      return;
    }
		if (opacity == 0 && el.style.visibility != "hidden") el.style.visibility = "hidden";
		else if (el.style.visibility != "visible") el.style.visibility = "visible";
		if (window.ActiveXObject) el.style.filter = "alpha(opacity=" + opacity*100 + ")";
		el.style.opacity = opacity;
	},
	
	writeInlineStyle: function(css) {
    document.write('<style type="text/css">');
    document.write(css);
    document.write('</style>');
	},
  
	addEvent: function(elm, evType, fn, useCapture){
		if (elm.addEventListener)
		{
			elm.addEventListener(evType, fn, useCapture);
			return true;
		} else if (elm.attachEvent) {
			var r = elm.attachEvent('on' + evType, fn);
			return r;
		} else {
			elm['on' + evType] = fn;
		}
	},
	
	getElementPosition: function(el) {
    var valueT = 0, valueL = 0;
    do {
      valueT += el.offsetTop  || 0;
      valueL += el.offsetLeft || 0;
      if (/Konqueror|Safari|KHTML/.test(navigator.userAgent)) {
        if (el.offsetParent == document.body) {
          if (getElementStyle(element, 'position') == 'absolute') break;
        }
      }
      el = el.offsetParent;
    } while (el);
    
    return [valueL, valueT];
	},
	
	_domReady: function() {
    if (MenuHandler._readyDone) {
      return;
    }
    MenuHandler._readyDone = true;
    
    if (MenuHandler._timer) { clearInterval(MenuHandler._timer); MenuHandler._timer = false; }

    for (var i=0; i<MenuHandler._readyCallbacks.length; i++) {
      (function(f) { f(); })(MenuHandler._readyCallbacks[i]);
    }
	},
	
	onDomReady: function(fn) {
    if (!this._readyCallbacks) {
      this._readyDone = false;
      this._readyCallbacks = [];
      
      if (document.addEventListener)
        document.addEventListener("DOMContentLoaded", MenuHandler._domReady, false);

        /*@cc_on @*/
        /*@if (@_win32)
            document.write("<script id=__ie_onload defer src=javascript:void(0)><\/script>");
            document.getElementById("__ie_onload").onreadystatechange = function() {
                if (this.readyState == "complete") MenuHandler._domReady();
            };
        /*@end @*/

        if (/WebKit/i.test(navigator.userAgent)) {
          this._timer = setInterval(function() {
            if (/loaded|complete/.test(document.readyState)) { MenuHandler._domReady(); };
          }, 10);
        }

        MenuHandler.addEvent(window, 'load', MenuHandler._domReady, false);
    }
    this._readyCallbacks[this._readyCallbacks.length] = fn;
	}
};
MenuHandler.init();