/// <reference path="jquery-1.3.2.min-vsdoc.js" />

$(document).ready(function() {
    var t;
    /*$(".nail").hover(
    function() {
    var nid = this.id.replace("nail", "");
    var position = $(this).offset();
    $container = $('<div/>').hide().attr('id', 'imgPreviewWithStyles').css("top", (position.top - 60) + "px").css("left", (position.left + 115) + "px").append('<img/>').appendTo('body');
    $img = $('img', $container).hide().attr('src', $("#nail-container" + nid + " .thumb").attr("src").replace("/thumbs/", "/large/"));
    //$("#nail-container" + nid).append($container);
    t = setTimeout('showImg()', 250);
    },
    function() {
    clearTimeout(t);
    $('#imgPreviewWithStyles').hide();
    $('#imgPreviewWithStyles').remove();
    }
    );*/
    $(".nail").hover(
        function() {
            var nid = this.id.replace("nail", "");
            var position = $(this).offset();
            $container = $('<div/>').hide().attr('id', 'imgPreviewWithStyles').css("top", (position.top - 60) + "px").css("left", (position.left + 115) + "px").append('<div/>').appendTo('body');
            $container2 = $('div', $container).append('<img/>').append($("#large-image" + nid).html());
            $img = $('img', $container2).hide().attr('src', $("#nail-container" + nid + " .thumb").attr("src").replace("/thumbs/", "/large/"));
            //$("#nail-container" + nid).append($container);
            t = setTimeout('showImg()', 250);
        },
        function() {
            clearTimeout(t);
            $('#imgPreviewWithStyles').hide();
            $('#imgPreviewWithStyles').remove();
        }
    );
    $('#registerForm').validate({
        errorClass: "field-validation-error",
        rules: {
            first_name: "required",
            last_name: "required",
            email: {
                required: true,
                email: true
            },
            password: "required",
            confirm_password: {
                required: true,
                equalTo: "#password"
            }
        },
        messages: {
            first_name: "Please enter your first name",
            last_name: "Please enter your last name",
            email: {
                required: "Please enter your email address",
                email: "Please enter a valid email address"
            },
            password: "Please enter a password",
            confirm_password: {
                required: "Please re-enter a password",
                equalTo: "Passwords must be equal"
            }
        }

    });

    $('#loginForm').validate({
        errorClass: "field-validation-error",
        rules: {
            email_address: "required",
            login_password: "required"
        },
        messages: {
            email_address: "Please enter your email address",
            login_password: "Please enter your password"
        }

    });
    $('#recoverPasswordForm').validate({
        errorClass: "field-validation-error",
        rules: {
            recover_email_address: {
                required: true,
                email: true
            }
        },
        messages: {
            recover_email_address: {
                required: "Please enter your email address",
                email: "Please enter a valid email address"
            }
        }

    });

    $("#entryForm").validate({
        errorClass: "field-validation-error",
        rules: {
            display_name: "required",
            age: "required",
            country: "required",
            entry_name: "required",
            colours_used: "required",
            effects_used: "required",
            entry_picture: "required",
            agree: "required"
        },
        messages: {
            display_name: "Please enter your display name",
            age: "Please select your age",
            country: "Please select your country",
            entry_name: "Please enter a name",
            colours_used: "Please select at least one colour",
            effects_used: "Please select at least one effect",
            entry_picture: "Please select a picture of your design",
            agree: "Please indicate that you read the competition rules"
        },
        errorPlacement: function(error, element) {
            if (element.attr("name") == "agree")
                error.insertAfter("#lblAgree");
            else
                error.insertAfter(element);
        }

    });

    $("select#state").val($("select#state").attr("class"));
    $("select#country").val($("select#country").attr("class"));

    $("input#address").focus(function() {
        clearField(this, "Enter Street");
    }).blur(function() {
        populateField(this, "Enter Street");
    });
    $("input#city").focus(function() {
        clearField(this, "Enter City");
    }).blur(function() {
        populateField(this, "Enter City");
    });
    $("input#zip").focus(function() {
        clearField(this, "Enter Zip/Postal");
    }).blur(function() {
        populateField(this, "Enter Zip/Postal");
    });

    $("#change").click(function() {
        $("#divProfilePicture").hide();
        $("#divProfilePictureUpload").show();
        return false;
    });
    $("#cancel").click(function() {
        $("#divProfilePictureUpload").hide();
        $("#divProfilePicture").show();
        return false;
    });
    if ($.browser.msie) {
        $(".multi").addClass("ie");
    }

    if ($("#country").val() == "US" || $("#country").val() == "CA") {
        $("#stateSelect").show();
    }

    $("#country").change(function() {
        if ($(this).val() == "US" || $("#country").val() == "CA") {
            $("#stateSelect").show();
        } else {
            $("#stateSelect").hide();
            $("#state").val("");
        }
    });

});

function showImg() {
    $('#imgPreviewWithStyles').css("display", "block");
    $('#imgPreviewWithStyles div img').fadeIn();
}

function clearField(obj, text) {
    if (obj.value == text) {
        obj.value = "";
    }
}

function populateField(obj, text) {
    if (obj.value == "") {
        obj.value = text;
    }
}

$.browser.msie6 = $.browser.msie && /MSIE 6\.0/i.test(window.navigator.userAgent) && !/MSIE 7\.0/i.test(window.navigator.userAgent) && !/MSIE 8\.0/i.test(window.navigator.userAgent);
if ($.browser.msie6) {
    DD_belatedPNG.fix('#imgPreviewWithStyles, #imgPreviewWithStyles div, .nail, .thumb-border');
}