$(document).ready(function(){

    //navigation
    var submenuCache = {};
    var defaultTimeoutIn = 0;
    var defaultTimeoutOut = 1000;
    var lowest = $("#middle").height() + $("#middle").offset().top - 5;

    //submenu1
    var t1 = null;
    var s1 = null;
    var i1 = null;
    $("#submenu1").hover(
        function(){
            if (typeof t1 == 'number') {
                clearTimeout(t1);
                delete t1;
            }
        },
        function(){
            t1 = setTimeout(function(){
                $('#submenu1').hide();
                delete t1;
            },defaultTimeoutOut);
        }
    );
    function buildSubmenu1(data,timer,li){
        $("#submenu1").empty().append($("<ul></ul>"));
        for (var i = 0; i < data.menu.length; i++) {
            var c = data.menu[i];
            $("#submenu1 ul").append($('<li id="menu' + c.id + '" class="' + (c.sub ? 'cat' : 'prod') + '"><a href="' + c.href + '">' + c.title + '</a></li>'));
        }
        $("#submenu1").css('top', $(li).offset().top - 5).css('left', $(li).offset().left + $(li).width() - 5);
        if (parseInt($("#submenu1").css("top")) + $("#submenu1").height() > lowest) {
            $("#submenu1").css('marginTop', lowest - parseInt($("#submenu1").css("top")) - $("#submenu1").height());
        } else {
            $("#submenu1").css('marginTop', 0);
        }
        var timeOut = 0;
        var newTimer = new Date().getTime();
        if (newTimer - timer < defaultTimeoutIn) {
            timeOut = defaultTimeoutIn - (newTimer - timer);
        }
        s1 = setTimeout(function(){
            $("#submenu1").show();
            delete s1;
        },timeOut);
    }
    $("#nav > li.cat").hover(
        function(){
			if (typeof t1 == 'number') {
				clearTimeout(t1);
				delete t1;
			}
			var li = this;
			i1 = setTimeout(function(){
				if (typeof t1 == 'number') {
				    clearTimeout(t1);
				    delete t1;
				}
				var timer = new Date().getTime();
				if (!submenuCache[li.id]) {
				    $.getJSON("json/menu.asp?CategoryId=" + li.id.substring(4,li.id.length + 1),
				        function(data){
				            buildSubmenu1(data,timer,li);
				            submenuCache[li.id] = data;
				        }
				    );
				} else {
				    buildSubmenu1(submenuCache[li.id],timer,li);
				}
				delete i1;
			},400);
        },
        function(){
			if (typeof i1 == 'number') {
			    clearTimeout(i1);
			    delete i1;
			}
            t1 = setTimeout(function(){
                $('#submenu1').hide();
                delete t1;
            },defaultTimeoutOut);
        }
    );

    //submenu2
    var t2 = null;
    var s2 = null;
    var i2 = null;
    $("#submenu2").hover(
        function(){
            if (typeof t1 == 'number') {
                clearTimeout(t1);
                delete t1;
            }
            if (typeof t2 == 'number') {
                clearTimeout(t2);
                delete t2;
            }
        },
        function(){
            t1 = setTimeout(function(){
                $('#submenu1').hide();
                delete t2;
            },defaultTimeoutOut);
            t2 = setTimeout(function(){
                $('#submenu2').hide();
                delete t2;
            },defaultTimeoutOut);
        }
    );
    function buildSubmenu2(data,timer,li){
        $("#submenu2").empty().append($("<ul></ul>"));
        for (var i = 0; i < data.menu.length; i++) {
            var c = data.menu[i];
            $("#submenu2 ul").append($('<li id="menu' + c.id + '" class="' + (c.sub ? 'cat' : 'prod') + '"><a href="' + c.href + '">' + c.title + '</a></li>'));
        }
        $("#submenu2").css('top', $(li).offset().top - 5).css('left', $(li).offset().left + $(li).width() - 5);
        if (parseInt($("#submenu2").css("top")) + $("#submenu2").height() > lowest) {
            $("#submenu2").css('marginTop', lowest - parseInt($("#submenu2").css("top")) - $("#submenu2").height());
        } else {
            $("#submenu2").css('marginTop', 0);
        }
        var timeOut = 0;
        var newTimer = new Date().getTime();
        if (newTimer - timer < defaultTimeoutIn) {
            timeOut = defaultTimeoutIn - (newTimer - timer);
        }
        s2 = setTimeout(function(){
            $("#submenu2").show();
            delete s2;
        },timeOut);
    }
    $("#submenu1 li.cat").livequery(function(){
        $(this).hover(
            function(){
				if (typeof t2 == 'number') {
					clearTimeout(t2);
					delete t2;
				}
                var li = this;
                i2 = setTimeout(function(){
					if (typeof t2 == 'number') {
					    clearTimeout(t2);
					    delete t2;
					}
					var timer = new Date().getTime();
					if (!submenuCache[li.id]) {
					$.getJSON("json/menu.asp?CategoryId=" + li.id.substring(4,li.id.length + 1),
					        function(data){
					            buildSubmenu2(data,timer,li);
					            submenuCache[li.id] = data;
					        }
					    );
					} else {
					    buildSubmenu2(submenuCache[li.id],timer,li);
					}
					delete i2;
				},400);
            },
            function(){
				if (typeof i2 == 'number') {
				    clearTimeout(i2);
				    delete i2;
				}
                t2 = setTimeout(function(){
                    $('#submenu2').hide();
                    delete t2;
                },defaultTimeoutOut);
            }
        );
    }, function(){
        $(this).unbind('mouseover').unbind('mouseout');
    });

    //submenu3
    var t3 = null;
    var s3 = null;
    var i3 = null;
    $("#submenu3").hover(
        function(){
            if (typeof t1 == 'number') {
                clearTimeout(t1);
                delete t1;
            }
            if (typeof t2 == 'number') {
                clearTimeout(t2);
                delete t2;
            }
            if (typeof t3 == 'number') {
                clearTimeout(t3);
                delete t3;
            }
        },
        function(){
            t1 = setTimeout(function(){
                $('#submenu1').hide();
                delete t1;
            },defaultTimeoutOut);
            t2 = setTimeout(function(){
                $('#submenu2').hide();
                delete t2;
            },defaultTimeoutOut);
            t3 = setTimeout(function(){
                $('#submenu3').hide();
                delete t3;
            },defaultTimeoutOut);
        }
    );
    function buildSubmenu3(data,timer,li){
        $("#submenu3").empty().append($("<ul></ul>"));
        for (var i = 0; i < data.menu.length; i++) {
            var c = data.menu[i];
            $("#submenu3 ul").append($('<li id="menu' + c.id + '" class="' + (c.sub ? 'cat' : 'prod') + '"><a href="' + c.href + '">' + c.title + '</a></li>'));
        }
        $("#submenu3").css('top', $(li).offset().top - 5).css('left', $(li).offset().left + $(li).width() - 5);
        if (parseInt($("#submenu3").css("top")) + $("#submenu3").height() > lowest) {
            $("#submenu3").css('marginTop', lowest - parseInt($("#submenu3").css("top")) - $("#submenu3").height());
        } else {
            $("#submenu3").css('marginTop', 0);
        }
        var timeOut = 0;
        var newTimer = new Date().getTime();
        if (newTimer - timer < defaultTimeoutIn) {
            timeOut = defaultTimeoutIn - (newTimer - timer);
        }
        s3 = setTimeout(function(){
            $("#submenu3").show();
            delete s3;
        },timeOut);
    }
    $("#submenu2 li.cat").livequery(function(){
        $(this).hover(
            function(){
				if (typeof t3 == 'number') {
					clearTimeout(t3);
					delete t3;
				}
                var li = this;
                i3 = setTimeout(function(){
					if (typeof t3 == 'number') {
					    clearTimeout(t3);
					    delete t3;
					}
					var timer = new Date().getTime();
					if (!submenuCache[li.id]) {
					$.getJSON("json/menu.asp?CategoryId=" + li.id.substring(4,li.id.length + 1),
					        function(data){
					            buildSubmenu3(data,timer,li);
					            submenuCache[li.id] = data;
					        }
					    );
					} else {
					    buildSubmenu3(submenuCache[li.id],timer,li);
					}
					delete i3;
				},400);
            },
            function(){
				if (typeof i3 == 'number') {
				    clearTimeout(i3);
				    delete i3;
				}
                t3 = setTimeout(function(){
                    $('#submenu3').hide();
                    delete t3;
                },defaultTimeoutOut);
            }
        );
    }, function(){
        $(this).unbind('mouseover').unbind('mouseout');
    });

    //submenu4
    var t4 = null;
    var s4 = null;
    var i4 = null;
    $("#submenu4").hover(
        function(){
            if (typeof t1 == 'number') {
                clearTimeout(t1);
                delete t1;
            }
            if (typeof t2 == 'number') {
                clearTimeout(t2);
                delete t2;
            }
            if (typeof t3 == 'number') {
                clearTimeout(t3);
                delete t3;
            }
            if (typeof t4 == 'number') {
                clearTimeout(t4);
                delete t4;
            }
        },
        function(){
            t1 = setTimeout(function(){
                $('#submenu1').hide();
                delete t1;
            },defaultTimeoutOut);
            t2 = setTimeout(function(){
                $('#submenu2').hide();
                delete t2;
            },defaultTimeoutOut);
            t3 = setTimeout(function(){
                $('#submenu3').hide();
                delete t3;
            },defaultTimeoutOut);
            t4 = setTimeout(function(){
                $('#submenu4').hide();
                delete t4;
            },defaultTimeoutOut);
        }
    );
    function buildSubmenu4(data,timer,li){
        $("#submenu4").empty().append($("<ul></ul>"));
        for (var i = 0; i < data.menu.length; i++) {
            var c = data.menu[i];
            $("#submenu4 ul").append($('<li id="menu' + c.id + '" class="' + (c.sub ? 'cat' : 'prod') + '"><a href="' + c.href + '">' + c.title + '</a></li>'));
        }
        $("#submenu4").css('top', $(li).offset().top - 5).css('left', $(li).offset().left + $(li).width() - 5);
        if (parseInt($("#submenu4").css("top")) + $("#submenu4").height() > lowest) {
            $("#submenu4").css('marginTop', lowest - parseInt($("#submenu4").css("top")) - $("#submenu4").height());
        } else {
            $("#submenu4").css('marginTop', 0);
        }
        var timeOut = 0;
        var newTimer = new Date().getTime();
        if (newTimer - timer < defaultTimeoutIn) {
            timeOut = defaultTimeoutIn - (newTimer - timer);
        }
        s4 = setTimeout(function(){
            $("#submenu4").show();
            delete s4;
        },timeOut);
    }
    $("#submenu3 li.cat").livequery(function(){
        $(this).hover(
            function(){
				if (typeof t4 == 'number') {
					clearTimeout(t4);
					delete t4;
				}
                var li = this;
                i4 = setTimeout(function(){
					if (typeof t4 == 'number') {
					    clearTimeout(t4);
					    delete t4;
					}
					var timer = new Date().getTime();
					if (!submenuCache[li.id]) {
					$.getJSON("json/menu.asp?CategoryId=" + li.id.substring(4,li.id.length + 1),
					        function(data){
					            buildSubmenu4(data,timer,li);
					            submenuCache[li.id] = data;
					        }
					    );
					} else {
					    buildSubmenu4(submenuCache[li.id],timer,li);
					}
					delete i4;
				},400);
            },
            function(){
				if (typeof i4 == 'number') {
				    clearTimeout(i4);
				    delete i4;
				}
                t4 = setTimeout(function(){
                    $('#submenu4').hide();
                    delete t4;
                },defaultTimeoutOut);
            }
        );
    }, function(){
        $(this).unbind('mouseover').unbind('mouseout');
    });

    //submenu5
    var t5 = null;
    var s5 = null;
    var i5 = null;
    $("#submenu5").hover(
        function(){
            if (typeof t1 == 'number') {
                clearTimeout(t1);
                delete t1;
            }
            if (typeof t2 == 'number') {
                clearTimeout(t2);
                delete t2;
            }
            if (typeof t3 == 'number') {
                clearTimeout(t3);
                delete t3;
            }
            if (typeof t4 == 'number') {
                clearTimeout(t4);
                delete t4;
            }
            if (typeof t5 == 'number') {
                clearTimeout(t5);
                delete t5;
            }
        },
        function(){
            t1 = setTimeout(function(){
                $('#submenu1').hide();
                delete t1;
            },defaultTimeoutOut);
            t2 = setTimeout(function(){
                $('#submenu2').hide();
                delete t2;
            },defaultTimeoutOut);
            t3 = setTimeout(function(){
                $('#submenu3').hide();
                delete t3;
            },defaultTimeoutOut);
            t4 = setTimeout(function(){
                $('#submenu4').hide();
                delete t4;
            },defaultTimeoutOut);
            t5 = setTimeout(function(){
                $('#submenu5').hide();
                delete t5;
            },defaultTimeoutOut);
        }
    );
    function buildSubmenu5(data,timer,li){
        $("#submenu5").empty().append($("<ul></ul>"));
        for (var i = 0; i < data.menu.length; i++) {
            var c = data.menu[i];
            $("#submenu5 ul").append($('<li id="menu' + c.id + '" class="' + (c.sub ? 'cat' : 'prod') + '"><a href="' + c.href + '">' + c.title + '</a></li>'));
        }
        $("#submenu5").css('top', $(li).offset().top - 5).css('left', $(li).offset().left + $(li).width() - 5);
        if (parseInt($("#submenu5").css("top")) + $("#submenu5").height() > lowest) {
            $("#submenu5").css('marginTop', lowest - parseInt($("#submenu5").css("top")) - $("#submenu5").height());
        } else {
            $("#submenu5").css('marginTop', 0);
        }
        var timeOut = 0;
        var newTimer = new Date().getTime();
        if (newTimer - timer < defaultTimeoutIn) {
            timeOut = defaultTimeoutIn - (newTimer - timer);
        }
        s5 = setTimeout(function(){
            $("#submenu5").show();
            delete s5;
        },timeOut);
    }
    $("#submenu4 li.cat").livequery(function(){
        $(this).hover(
            function(){
				if (typeof t5 == 'number') {
					clearTimeout(t5);
					delete t5;
				}
                var li = this;
                i5 = setTimeout(function(){
					if (typeof t5 == 'number') {
					    clearTimeout(t5);
					    delete t5;
					}
					var timer = new Date().getTime();
					if (!submenuCache[li.id]) {
					$.getJSON("json/menu.asp?CategoryId=" + li.id.substring(4,li.id.length + 1),
					        function(data){
					            buildSubmenu5(data,timer,li);
					            submenuCache[li.id] = data;
					        }
					    );
					} else {
					    buildSubmenu5(submenuCache[li.id],timer,li);
					}
					delete i5;
				},400);
            },
            function(){
				if (typeof i5 == 'number') {
				    clearTimeout(i5);
				    delete i5;
				}
                t5 = setTimeout(function(){
                    $('#submenu5').hide();
                    delete t5;
                },defaultTimeoutOut);
            }
        );
    }, function(){
        $(this).unbind('mouseover').unbind('mouseout');
    });

});