// JavaScript Document
$(document).ready(init);

function init(){
    //window.alert("jQuery: ready");
	hideSubMenu();
	$('#menu>ul>li').mouseover(mouseInHandler);
	$('#menu>ul>li').mouseout(mouseOutHandler);
    $('ul>li>ul').mouseout(mouseOutHandler);
}

function hideSubMenu(){
	$('ul>li>ul').hide();
}

function mouseInHandler(e){

    //Zelf aanpassen naar gelang afbeelding
    var arrowWidth = 0;

    var currentSubMenu = $("ul",e.currentTarget);
    $(currentSubMenu).show().addClass("hovermenu");
	

    if(currentSubMenu.length == 1){
    var currentSubMenuWidth = $(currentSubMenu).width();

    var currentSubMenuPaddingLeft = $(currentSubMenu).css('padding-left').replace("px","").replace("em","").replace("pt","").replace(";","");
    var currentSubMenuPaddingRight = $(currentSubMenu).css('padding-right').replace("px","").replace("em","").replace("pt","").replace(";","");

    var currentSubMenuMarginLeft = $(currentSubMenu).css('margin-left').replace("px","").replace("em","").replace("pt","").replace(";","");
    var currentSubMenuMarginRight = $(currentSubMenu).css('margin-right').replace("px","").replace("em","").replace("pt","").replace(";","");

    var currentSubMenuBorderLeft = $(currentSubMenu).css('border-left-width').replace("px","").replace("em","").replace("pt","").replace(";","").replace("medium",0);
    var currentSubMenuBorderRight = $(currentSubMenu).css('border-right-width').replace("px","").replace("em","").replace("pt","").replace(";","").replace("medium",0);

    var currentSubMenuTotalWidth = currentSubMenuWidth + parseInt(currentSubMenuMarginLeft) + parseInt(currentSubMenuMarginRight) + parseInt(currentSubMenuPaddingLeft) + parseInt(currentSubMenuPaddingRight) + parseInt(currentSubMenuBorderLeft) + parseInt(currentSubMenuBorderRight);


    }

    
    var currentMenuItem = $(e.currentTarget);
	
    var currentMenuItemWidth = $(currentMenuItem).width();
    var currentMenuItemIndex = $(currentMenuItem).index();

    var currentMenuItemPaddingLeft = $(currentMenuItem).css('padding-left').replace("px","").replace("em","").replace("pt","").replace(";","");
    var currentMenuItemPaddingRight = $(currentMenuItem).css('padding-right').replace("px","").replace("em","").replace("pt","").replace(";","");


    var currentMenuItemMarginLeft = $(currentMenuItem).css('margin-left').replace("px","").replace("em","").replace("pt","").replace(";","");
    var currentMenuItemMarginRight = $(currentMenuItem).css('margin-right').replace("px","").replace("em","").replace("pt","").replace(";","");


    var currentMenuItemBorderLeft = $(currentMenuItem).css('border-left-width').replace("px","").replace("em","").replace("pt","").replace(";","").replace("medium",0);
    var currentMenuItemBorderRight = $(currentMenuItem).css('border-right-width').replace("px","").replace("em","").replace("pt","").replace(";","").replace("medium",0);


    var currentMenuItemTotalWidth = currentMenuItemWidth + parseInt(currentMenuItemMarginLeft) + parseInt(currentMenuItemMarginRight) + parseInt(currentMenuItemPaddingLeft) + parseInt(currentMenuItemPaddingRight) + parseInt(currentMenuItemBorderLeft) + parseInt(currentMenuItemBorderRight);

   
    var mainMenu = $(e.currentTarget).parent();

    var mainMenuHeight = $(mainMenu).height();

    var mainMenuPaddingBottom = $(mainMenu).css('padding-top').replace("px","").replace("em","").replace("pt","").replace(";","");
    var mainMenuPaddingTop = $(mainMenu).css('padding-bottom').replace("px","").replace("em","").replace("pt","").replace(";","");

    var mainMenuMarginTop = $(mainMenu).css('margin-top').replace("px","").replace("em","").replace("pt","").replace(";","");
    var mainMenuMarginBottom = $(mainMenu).css('margin-bottom').replace("px","").replace("em","").replace("pt","").replace(";","");

    var mainMenuBorderTop = $(mainMenu).css('border-top-width').replace("px","").replace("em","").replace("pt","").replace(";","").replace("medium",0);
    var mainMenuBorderBottom = $(mainMenu).css('border-bottom-width').replace("px","").replace("em","").replace("pt","").replace(";","").replace("medium",0);

    var mainMenuTotalHeight = mainMenuHeight + parseInt(mainMenuMarginTop) + parseInt(mainMenuMarginBottom) + parseInt(mainMenuPaddingTop) + parseInt(mainMenuPaddingBottom) + parseInt(mainMenuBorderTop) + parseInt(mainMenuBorderBottom);

    var currentSubMenuPosLeft = (currentMenuItemTotalWidth * currentMenuItemIndex) + (currentMenuItemTotalWidth * 0.5) - (currentSubMenuTotalWidth *0.5);

    var arrowTopPos = 0;
    var arrowLeftPos = (currentSubMenuTotalWidth * 0.5) - (arrowWidth *.5);
    $(currentSubMenu).css('top',mainMenuTotalHeight+'px');
    $(currentSubMenu).css('left',currentSubMenuPosLeft+'px');
    $(currentSubMenu).css('background-position',+arrowLeftPos+"px "+arrowTopPos+"px");
	$(currentMenuItem).css('background-image','url(html/382/images/actief.jpg)');
	$(currentMenuItem).css('background-position','0px 93px');
	$(currentMenuItem).css('background-repeat','repeat-x');
	
}

function mouseOutHandler(e){
	var currentMenuItem = $(e.currentTarget);
	$(".hovermenu").hide();
	$(currentMenuItem).css('background-image','');
	$(currentMenuItem).css('background-position','');
	$(currentMenuItem).css('background-repeat','');
}
