// Settings
menuAnimationTimeout = 9; // In seconds

fadingSpeed = 40; // In miliseconds
fadingStep = 0.20; // In miliseconds

if ( $.browser.mozilla ) {
        fadingSpeed = 60; // In miliseconds
        fadingStep = 0.5; // In miliseconds
}

// Initialise variables
curMenuN = "0";
animationId = 0;
animationHoldId = 0;
fadingId = 0;
curFadeOpacity = 0;

menuImagesSrc = {
        hovered : [
                "images/mumenu-on.jpg",
                "images/mumenu-on.jpg",
                "images/mumenu-on.jpg",
                "images/mumenu-on.jpg"
        ], houted : [
                "images/mumenu-off.jpg",
                "images/mumenu-off.jpg",
                "images/mumenu-off.jpg",
                "images/mumenu-off.jpg"
        ]
};

function preload_images(img_arr) {
        $.each(img_arr, function() {
                var img = new Image();
                img.src = this;
        });
}

function switchMenuItems (newN, curN) {
        menuImages[curN].attr("src", menuImagesSrc.houted[curN]);
        menuImages[newN].attr("src", menuImagesSrc.hovered[newN]);
}

function animateMenu () {
        var n = parseInt(curMenuN);
        n = ( n == 2 ) ? 0 : n+1;
        menuImages[n].triggerHandler("mouseover", [true]);
}

function initMenuAnimation () {
        if ( animationId ) {
                stopMenuAnimation();
        }
        animationId = window.setInterval("animateMenu()", menuAnimationTimeout*1100 );
}

function stopMenuAnimation () {
        if ( !animationId )
                return
        window.clearInterval(animationId);
        animationId = 0;
}

function fadeInMenuBloc (newN, curN) {
        curFadeOpacity += fadingStep;
        menuBlocs[newN].css('opacity', curFadeOpacity);
        if ( curFadeOpacity >= 1 ) {
                window.clearInterval(fadingId);
                menuBlocs[curN].css('opacity', 0).css('zIndex', 0);
                fadingId = 0;
                curFadeOpacity = 0;
        }
}
       
function switchMenu (e, isTriggeredByTimeout) {
        var n = e.data.n;
        if ( !isTriggeredByTimeout )
                stopMenuAnimation ();
        if ( n == curMenuN )
                return;
        if ( fadingId ) {
                window.clearInterval(fadingId);
                menuBlocs[curMenuN].css('opacity', 1);
                curFadeOpacity = 0;
        }
        $.each(menuBlocs, function(i, val) {
                if ( i != curMenuN ) {
                        menuBlocs[i].css('opacity', 0).css("zIndex", "0");
                }
        });
        menuBlocs[curMenuN ].css("zIndex", "1");
        menuBlocs[n].show().css("zIndex", "2");
        switchMenuItems (n, curMenuN);
        fadingId = window.setInterval("fadeInMenuBloc(" + n + ", " + curMenuN +  ")", fadingSpeed);
        curMenuN = n;
}

function opera_switchMenu (e, isTriggeredByTimeout) {
        var n = e.data.n;
        if ( !isTriggeredByTimeout )
                stopMenuAnimation ();
        if ( n == curMenuN )
                return;
        switchMenuItems (n, curMenuN);
        menuBlocs[n].show();
        menuBlocs[curMenuN].hide();
        curMenuN = n;
}

$(function() {

        preload_images([
                "images/mumenu-on.jpg",
                "images/mumenu-on.jpg",
                "images/mumenu-on.jpg"
        ]);

        initMenuAnimation();
       
        menuImages = [
                $("img", "#menu_item_0"),
                $("img", "#menu_item_1"),
                $("img", "#menu_item_2"),
		$("img", "#menu_item_3")
        ];

        menuBlocs = [
                $("#bn0"),
                $("#bn1"),
                $("#bn2"),
		$("#bn3")
        ];

        if ( $.browser.opera ) {
                $.each(menuBlocs, function(i, val) {
                        if (i) val.hide();
                });
                $.each(menuImages , function(i, val) {
                        val.bind("mouseover", {n: i}, opera_switchMenu);
                });
        } else {
                $.each(menuBlocs, function(i, val) {
                        if (i) val.css("opacity", 0);
                });
                $.each(menuImages , function(i, val) {
                        val.bind("mouseover", {n: i}, switchMenu);
                });
        }

        $("#menu_items").mouseout(initMenuAnimation);
	
	   1.
$('#menu_items').hover(function() {
$(this).addClass('pointer');
}, function() {
$(this).removeClass('pointer');
});



});