$(function () {

    // Banner animation
    bannerAnimation(2000);

    function bannerAnimation(firstDelay) {
        $("img#banner-1").delay(firstDelay).fadeIn(4000, function () {
            $("img#banner-2").fadeIn(4000, function () {
                $("img#banner-3").fadeIn(4000, function () {
                    $("img#banner-2").hide();
                    $("img#banner-1").hide();
                    $("img#banner-3").fadeOut(1000, function () {
                        bannerAnimation()
                    });
                });
            });
        });
    };
    // End banner animation

    //Sign-up modal
    $("#dialog:ui-dialog").dialog("destroy");

    $("#dialog-form").dialog({
        autoOpen: false,
        height: 480,
        width: 400,
        modal: true,
        buttons: {
            "SIGN UP": function () {
                var bValid = true;
                allFields.removeClass("ui-state-error");
                bValid = bValid && checkLength(name, "name", 3, 30);
                bValid = bValid && checkLength(email, "email", 6, 80);

                bValid = bValid && checkRegexp(email, /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i, "eg. your_name@gmail.com");

                if (bValid) {
                    $(this).attr("disabled", "true");
                    tips.text("");
                    signUp();
                }
            },
            Cancel: function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            allFields.val("").removeClass("ui-state-error");
        }
    });

    function signUp() {
        $("img.ajax-loader").show();
        option = $("select#course option:selected").text()
        comment = $("#comments").val();
        $.ajax({
            type: "POST",
            dataType: 'json',
            url: "/SignUp",
            //string name, string email, string course, string message
            data: "name=" + name.val() + "&email=" + email.val() + "&course=" + option + "&comments=" + comment,
            success: function (result) {
                if (result) {
                    $("div.ui-dialog-buttonset").css("display", "hidden");
                    $("div#dialog-form").dialog({ height: 270 });
                    $("div#dialog-form").dialog({ title: "We have signed you up!" });
                    $("div#dialog-form").html('<p class="thank-you-message">Thank you for signing up for "' + $("select#course option:selected").text() +
                                                    '". </p><p><br />Look forward to seeing you soon ' + name.val() + '.</p>' +
                                                    '<p><br />For further information please <a href="/contact">contact us</a></p>');
                    $("div#dialog-form").dialog({ buttons: [{ text: "Ok", click: function () { $(this).dialog("close"); } }] });
                }
                else {
                    tips.text("All form fields are required.");
                    $("div.ui-dialog-buttonset").css("display", "hidden");
                    $("div#dialog-form").dialog({ height: 170 });
                    $("div#dialog-form").dialog({ title: "Sorry, there had been a problem..." });
                    $("div#dialog-form").html('<p class="thank-you-message">If the form continues to fail, please email us with your details to &#105;&#110;&#102;&#111;&#64;&#116;&#104;&#101;&#112;&#108;&#97;&#110;&#46;&#99;&#111;&#46;&#110;&#122;</p>');
                    $("div#dialog-form").dialog({ buttons: [{ text: "Ok", click: function () { $(this).dialog("close"); } }] });
                }
                $("img.ajax-loader").hide();
            },
            "error": function (xhr, ajaxOptions, thrownError) {
                alert(thrownError);
                $("img.ajax-loader").hide();
                $(this).dialog("close");
            }
        });
    }

    $("button#sign-up")
			.button()
			.click(function () {
			    $("#dialog-form").dialog("open");
			});

    var name = $("#name"),
			email = $("#email"),
			confirm = $("#confirm"),
			allFields = $([]).add(name).add(email),
			tips = $(".validateTips");

    function updateTips(t) {
        tips
				.text(t)
				.addClass("ui-state-highlight");
        setTimeout(function () {
            tips.removeClass("ui-state-highlight", 1500);
        }, 500);
    };

    function checkLength(o, n, min, max) {
        if (o.val().length > max || o.val().length < min) {
            o.addClass("ui-state-error");
            updateTips("Length of " + n + " must be between " +
					min + " and " + max + ".");
            return false;
        } else {
            return true;
        }
    }

    function checkRegexp(o, regexp, n) {
        if (!(regexp.test(o.val()))) {
            o.addClass("ui-state-error");
            updateTips(n);
            return false;
        } else {
            return true;
        }
    }
    //End sign-up modal

    //Google map modal
    $("a#glen-eden-map-link")
			.click(function (e) {
			    e.preventDefault();
			    $("#map-dialog").dialog("open");
			});

    $("#map-dialog").dialog({
        autoOpen: false,
        height: 495,
        width: 455,
        modal: false,
        buttons: {
            Close: function () {
                $(this).dialog("close");
            }
        },
        close: function () {
            allFields.val("").removeClass("ui-state-error");
        }
    });
    //End Google map modal

    //$(".ui-dialog").fadeOut();
//    function runIt() {
//        $("#map-dialog").wait().dialog("close");
        //$(".ui-dialog").wait().hide();
        //              .animate({ left: '+=200' }, 2000)
        //              .wait()
        //              .animate({ left: '-=200' }, 1500, runIt);
//    }
//    runIt();
    //$("#map-dialog").dialog("close");
});