/**
 * Benchmark Displays 
 * 
 * This file is based off Magento's menu.js file, however is adjusted for a wide menu that contains a sub category with children elements
 * for each parent category.
 *
 * @category    Benchmark Displays
 * @package     js
 * @author      Graphtek Interactive
 */

/**
 * @classDescription simple Wide Navigation with replacing old handlers
 * @param {String} id id of ul element with navigation lists
 * @param {Object} settings object with settings
 */
var mainWideNav = function() {

    var mainWide = {
        obj_nav :   $(arguments[0]) || $("nav"),

        settings :  {
            show_delay      :   0,
            hide_delay      :   0,
            _ie6            :   /MSIE 6.+Win/.test(navigator.userAgent),
            _ie7            :   /MSIE 7.+Win/.test(navigator.userAgent)
        },

        init :  function(obj, level) {
            obj.lists = obj.childElements();
            obj.lists.each(function(el,ind){
                mainWide.handlNavElement(el);
                if((mainWide.settings._ie6 || mainWide.settings._ie7) && level){
                    mainWide.ieFixZIndex(el, ind, obj.lists.size());
                }
            });
            if(mainWide.settings._ie6 && !level){
                document.execCommand("BackgroundImageCache", false, true);
            }
        },

        handlNavElement :   function(list) {
            if(list !== undefined){
                list.onmouseover = function(){
                    mainWide.fireNavEvent(this,true);
                };
                list.onmouseout = function(){
                    mainWide.fireNavEvent(this,false);
                };
                if(list.down("ul")){
                    mainWide.init(list.down("ul"), true);
                }
            }
        },

        ieFixZIndex : function(el, i, l) {
            if(el.tagName.toString().toLowerCase().indexOf("iframe") == -1){
                el.style.zIndex = l - i;
            } else {
                el.onmouseover = "null";
                el.onmouseout = "null";
            }
        },

        fireNavEvent :  function(elm,ev) {
            if(ev){
                elm.addClassName("over");
                elm.down("a").addClassName("over");
                if (elm.childElements()[1]) {
                    mainWide.show(elm.childElements()[1], elm);
                }
            } else {
                elm.removeClassName("over");
                elm.down("a").removeClassName("over");
                if (elm.childElements()[1]) {
                    mainWide.hide(elm.childElements()[1], elm);
                }
            }
        },

        show : function (sub_elm, elm) {
            if (sub_elm.hide_time_id) {
                clearTimeout(sub_elm.hide_time_id);
            }
            sub_elm.show_time_id = setTimeout(function() {
                if (!sub_elm.hasClassName("shown-sub")) {
                    sub_elm.addClassName("shown-sub");
                    if (elm.hasClassName("level-top")) {
        				var parentLeftOffset = elm.parentNode.viewportOffset();
        				var subLeftOffset = elm.viewportOffset().left - parentLeftOffset.left;
        				var childOffset = 0;
        				
        				if (subLeftOffset != 0) {
        					childOffset = -subLeftOffset + 'px';
        				}
        				
        				var subMenu = $$("#nav li.over ul.level0")[0]
        				if (subMenu !== undefined) {
    	    				subMenu.setStyle({
    	    					left : childOffset
    	    				});
                    	}
                    }
                }
            }, mainWide.settings.show_delay);
        },

        hide : function (sub_elm, elm) {
            if (sub_elm.show_time_id) {
                clearTimeout(sub_elm.show_time_id);
            }
            sub_elm.hide_time_id = setTimeout(function(){
                if (sub_elm.hasClassName("shown-sub")) {
                    if (elm.hasClassName('level-top')) {
        				$$("#nav li ul.level0").each(function(el,ind){
	        				if (el !== undefined) {
	            				el.setStyle({
	            					left : "-10000px"
	            				});
	                    	}
        				});
                    }
                    sub_elm.removeClassName("shown-sub");
                }
            }, mainWide.settings.hide_delay);
        }

    };
    if (arguments[1]) {
        mainWide.settings = Object.extend(mainWide.settings, arguments[1]);
    }
    if (mainWide.obj_nav) {
        mainWide.init(mainWide.obj_nav, false);
    }
};

document.observe("dom:loaded", function() {
    //run navigation without delays and with default id="#nav"
    //mainWideNav();

    //run navigation with delays
    mainWideNav("nav", {"show_delay":100,"hide_delay":100});
});