$().ready(function() {
    InitUI();
    var accountControllerURL;
    accountControllerURL = "http://www.mycreativeshop.com/Account.mvc/";
});

$.validator.setDefaults({
    invalidHandler: function(form, validator) {
        // Set a custom flag to activate certain functionality after the user has clicked the form submit.
        validator.settings.invalidSubmit = false;
    }
});


$(function() {

    if ($('#login').length) {

        var login_a = $('#login a');
        var login_a_offset = login_a.offset();

        var visible = false;

        $('#login_form').css({
            'left': login_a_offset.left + 'px',
            'top': login_a_offset.top + login_a.height() + parseInt(login_a.css('padding-bottom')) + parseInt(login_a.css('padding-top')) + 'px'
        });

        login_a.click(function() {
            visible = !visible;
            login_a.toggleClass('active');
            $('#login_form').slideToggle(200);
            return false;
        });

        $('#login_form').click(function(e) {
            e.stopPropagation();
        });

        $('body').click(function() {
            if (visible) {
                login_a.click();
            }
        })
    }

});


function InitUI() {

    var myForm = $("#signin-page-form");

    myForm.validate({
        errorClass: "errormessage",
        onkeyup: false,
        errorClass: 'error',
        validClass: 'valid',
        rules: {
            UserName: { required: true, email: true },
            Password: { required: true, minlength: 6 }
        },
        messages: {
            UserName: { required: "Please enter your username.", email: "Your username must be a valid email address." },
            Password: { required: "Please enter your password.", minlength: "Passwords must contain at least 6 characters." }
        },

        errorPlacement: function(error, element) {
            // Set positioning based on the elements position in the form
            var elem = $(element),
            flipIt = elem.parents('span.right').length > 0;
            // Check we have a valid error message
            if (!error.is(':empty')) {
                // Apply the tooltip only if it isn't valid
                elem.filter(':not(.valid)').qtip({
                    overwrite: false,
                    content: error,
                    position: { my: 'middle left', at: 'middle right', viewport: $(window) },
                    show: { event: false, ready: true },
                    hide: false,
                    style: { classes: 'ui-tooltip-red ui-tooltip-shadow ui-tooltip-rounded' }
                })
                // If we have a tooltip on this element already, just update its content
					.qtip('option', 'content.text', error);
            }
            // If the error is empty, remove the qTip
            else { elem.qtip('destroy'); }
        },

        success: $.noop // Odd workaround for errorPlacement not firing!

    })

    $("#signinPageLoginButton").click(function() {
        $("#signinPageError").hide();

        var username = $("#UserName").val();
        var pwd = $("#Password").val();

        var url = accountControllerURL + "ValidateUser";
        if (username != "" && pwd != "") {
            var result = $.ajax({
                url: url,
                data: "username=" + username + "&pwd=" + pwd,
                async: false
            }).responseText;
            if (result == "Invalid username or password.") {
                $("#signinPageError").text(result);
                $("#signinPageError").show();
                $("#UserName").val("");
                $("#Password").val("");
                return false;
            }
            else {
                $("#signinPageError").hide();

                return true;

            }
        }

    });
}