$(function () {
    // Declare variables
    var defaultBkgd = $("#menu").css("background-image");
    var currentBkgd = defaultBkgd;
    var clickedElement;
    var contentLeft = "-70px";
    var contentRight = "240px";
    var contentCenter = "164px";

    $(document).ready(function () {
        $('ul.gallery_list').galleria({
            clickNext: false,
            history: false
        });
        $('ul.gallery_list').jcarousel({
            scroll: 5
        });
        $('.facebookicon, .facebook').hover(function (e) {
            $(".facebook a").css("background-position", "left -9px");
        }, function (e) {
            $(".facebook a").css("background-position", "left top");
        })
    })


    SetupContactForm("Captins Club", "/register/captains-club");
    SetupContactForm("Saturday Confidential", "/register/saturday-confidential");

    BindContactFormEvents("Captins Club", "/register/captains-club");
    BindContactFormEvents("Saturday Confidential", "/register/saturday-confidential");

    function SetupContactForm(name, url) {
        var safeName = name.replace(" ", "-");
        var contactForm = "<div id='" + safeName + "'>" + $("#contact-form").clone().html() + "</div>";

        var replaceForm = $("#content .lunch");
        var regex = new RegExp('<p>' + name + '</p>', 'gi');


        var newHtml = replaceForm.html().replace(regex, contactForm);

        replaceForm.html(newHtml);
    }

    function BindContactFormEvents(name, url) {

        var safeName = name.replace(" ", "-");
        $("#" + safeName + " .clickme").click(function () {
            form = $(this).parents(".contact-form");
            email = form.find("input[type='text']").val();
            member = form.find("input[type='checkbox']").is(":checked") ? "on" : "";
            errorHolder = form.find(".contact-messages");
            errorHolder.html("<div class='loading'>Submitting..</div>");
            $.ajax({
                type: "post",
                url: url,
                dataType: "json",
                data: "email=" + email + "&member=" + member,
                success: function (result) {
                    if (result.length == 0) {
                        form.find("form").hide();
                        errorHolder.html("<div class='success'>Thanks for registering</div>");
                    } else {
                        errorHolder.html("");
                        $(result).each(function (i, k) {
                            errorHolder.append("<div class='error'>" + k + "</div>");
                        });
                    }
                }

            });
            return false;
        });

    }

    // Apply hover to menu items
    setHover();

    // Apply click handlers for menu items
    setMenuClick();

    // Apply click handler for close button for content
    $("#close").click(function (e) {
        closeContent(e);
    });

    // Menu item rollover function
    function menuOver(element) {
        // Change the main background image
        var parentClass = (element.parent().attr("class"));

        setMenuBkgd(parentClass);
    }

    // Menu item rollout function
    function menuOut(element) {
        // Change the main background image
        if ($("#content").is(":visible")) {
            var parentClass = (element.parent().attr("class"));

            setMenuBkgd(parentClass);
        }
    }

    // Set the main background image function
    function setMenuBkgd(url) {
        var i = 0;
        switch (url) {
            case "about":
                i = 0;
                break;
            case "lunch":
                i = 1;
                break;
            case "evenings":
                i = 2;
                break;
            case "drinks":
                i = 3;
                break;
            case "functions":
                i = 4;
                break;
            case "gallery":
                i = 5;
                break;
            case "contact":
                i = 6;
                break;
            case "porthole":
                i = 7;
                break;
            case "facebook":
                i = 8;
                break;
            case "facebookicon":
                i = 8;
                break;
            default:
                i = 0;
        }
        $("#menuImg").css("background-position", "center " + (-i * 500) + "px");
    }

    // Apply hover to the menu items function
    function setHover() {
        $("#menu li a").hover(function (e) {
            menuOver($(this));
        }, function (e) {
            menuOut($(this));
        })
    }

    // Apply click handlers for menu items function
    function setMenuClick() {
        $("#menu li.porthole a").click(function (e) {
            // Stop normal link click
            e.preventDefault();

            var element = $(this);

            if ($("#content").is(":visible")) {
                closeContent(e, function () {
                    viewPorthole();
                });
            } else {
                viewPorthole();
            }
        });

        $("#menu li:not(.porthole, .facebook, .facebookicon) a").click(function (e) {
            // Stop normal link click
            e.preventDefault();

            var element = $(this);

            if ($("#content").is(":visible")) {
                closeContent(e, function () {
                    clickHandler(element);
                });
            } else if ($(".portholeVideo").is(":visible")) {
                $(".portholeVideo").fadeOut("fast", function () {
                    clickHandler(element);
                });
            } else {
                clickHandler(element);
            }
        });
    }

    function clickHandler(element) {
        // Store the clicked element
        clickedElement = element;

        // Set the content background
        var parentClass = (element.parent().attr("class"));
        var showClass = parentClass;
        $("#contentBg").attr("src", "../images/" + parentClass + "_content.png");

        // Check if location of menu is left or right of the center of the main background image, and animate content appropriately
        if ((element.parent().css("left").substring(0, element.parent().css("left").length - 2)) > ($("#menu").css("width").substring(0, $("#menu").css("width").length - 2) / 2)) {
            $("#inner").css("padding-left", "100px");
            $("#content").animate({
                "width": 540,
                "height": 540,
                "top": 172,
                "left": contentRight,
                "opacity": "show"
            }, function () { showInnerContent(showClass) });
        } else {
            $("#inner").css("padding-left", "150px");
            $("#content").animate({
                "width": 540,
                "height": 540,
                "top": 172,
                "left": contentLeft,
                "opacity": "show"
            }, function () { showInnerContent(showClass) });
        }

        function showInnerContent(showClass) {
            if (showClass == "gallery") {
                $("#gallery-object").css("top", "270px");
            }

            $("#content #inner ." + element.parent().attr('class')).fadeIn();
            $("#content #inner ." + element.parent().attr('class')).children().fadeIn();

            $("#content #inner").scrollTop(0);
        }

        // Set the main background image
        setMenuBkgd(parentClass);
    }

    function viewPorthole() {
        $(".portholeVideo").fadeIn("fast");
    }

    function closeContent(element, fn) {
        if (element) {
            // Stop normal link click
            element.preventDefault();

            // Hide the inner content
            var visibleDiv = $("#content #inner div:visible");
            if (visibleDiv.attr('class') == "gallery") {
                $("#gallery-object").css("top", "-1000px");
            }
            visibleDiv.fadeOut(function () {
                $("#content").animate({
                    "width": 375,
                    "height": 375,
                    "top": 254,
                    "left": contentCenter,
                    "opacity": "hide"
                }, function () {
                    if (typeof fn == "function") {
                        fn();
                    }
                });
            });
        }
    }

    function resetMenu(fn) {
        // Get the currently visible content
        var visibleDiv = $("#content #inner div:visible");

        // Reset (hide) the currently visible content
        $("#content").fadeOut("fast", function () {
            visibleDiv.hide();

            if (typeof fn == "function") {
                fn();
            }
        });
    }
});