$(document).ready(function() { // do stuff when DOM is ready
    // gender selector
    $("img#male,img#female").css("border", "solid 2px white");
    $("img#male,img#female").hover(function() {
            $(this).css("border-color", "#28b8d3");
        },
        function() {
            if (!$(this).hasClass("active"))
                $(this).css("border-color", "white");
        }
    );

    // update value gender radiobuttonlist on gender select
    function UpdateGender(gender) {
        var value_to_select = gender.toString().substring(0, 1).toUpperCase()
        $("input:radio[value='" + value_to_select + "']").attr("checked", true);
    }

    // active claas formfields
    $(".input_regular").focus(function() {
        $(this).toggleClass("active");
    }).blur(function() {
        $(this).toggleClass("active");
    });

//    // browserhack: firefox tooltips
//    if ($.browser.mozilla) {
//        $('#tooltipFullname').addClass('tooltipfirefox2');
//        $('#tooltipEmail').addClass('tooltipfirefox2');
//        $('#tooltipPassword').addClass('tooltipfirefox2');
//        $('#tooltipPasswordRetype').addClass('tooltipfirefox2');
//        $('#tooltipGender').addClass('tooltipfirefox1');
//        $('#tooltipDateOfBirth').addClass('tooltipfirefox1');
//        $('#tooltipCountry').addClass('tooltipfirefox1');
//    }

    // flag: inputfield with focus
    flagInputField = '';

    // EVENTS : SHOW/HIDE TOOLTIPS
    // Full Name
    $('#fieldFullname').mouseover(function() {
        $('#tooltipFullname').show();
    }).mouseout(function() {
        checkMouseOut('fullname');
    });
    $('[id$=_UserNameLabel]').mouseover(function() {
        $('#tooltipFullname').show();
    }).mouseout(function() {
        checkMouseOut('fullname');
    });
    $('.c8 :text[id$=_UserName]').focus(function() {
        flagInputField = 'fullname';
        $('#tooltipFullname').show();
    }).blur(function() {
        $('#tooltipFullname').hide();
        flagInputField = '';
    });

    // Email
    $('#fieldEmail').mouseover(function() {
        $('#tooltipEmail').show();
    }).mouseout(function() {
        checkMouseOut('email');
    });
    $('[id$=_EmailLabel]').mouseover(function() {
        $('#tooltipEmail').show();
    }).mouseout(function() {
        checkMouseOut('email');
    });
    $('.c8 :text[id$=_Email]').focus(function() {
        flagInputField = 'email';
        $('#tooltipEmail').show();
    }).blur(function() {
        $('#tooltipEmail').hide();
        flagInputField = '';
    });

    // Password
    $('#fieldPassword').mouseover(function() {
        $('#tooltipPassword').show();
    }).mouseout(function() {
        checkMouseOut('password');
    });
    $('[id$=_PasswordLabel]').mouseover(function() {
        $('#tooltipPassword').show();
    }).mouseout(function() {
        checkMouseOut('password');
    });
    $('.c8 :password[id$=_CreateUserStepContainer_Password]').focus(function() {
        flagInputField = 'password';
        $('#tooltipPassword').show();
    }).blur(function() {
        $('#tooltipPassword').hide();
        flagInputField = '';
    });

    // Confirm Password
    $('#fieldPasswordRetype').mouseover(function() {
        $('#tooltipPasswordRetype').show();
    }).mouseout(function() {
        checkMouseOut('passwordretype');
    });
    $('[id$=_ConfirmPasswordLabel]').mouseover(function() {
        $('#tooltipPasswordRetype').show();
    }).mouseout(function() {
        checkMouseOut('passwordretype');
    });
    $('.c8 :password[id$=_CreateUserStepContainer_ConfirmPassword]').focus(function() {
        flagInputField = 'passwordretype';
        $('#tooltipPasswordRetype').show();
    }).blur(function() {
        $('#tooltipPasswordRetype').hide();
        flagInputField = '';
    });

    // Gender
    $('#fieldGender').mouseover(function() {
        $('#tooltipGender').show();
    }).mouseout(function() {
        checkMouseOut('gender');
    });
    $('[id$=_GenderLabel]').mouseover(function() {
        $('#tooltipGender').show();
    }).mouseout(function() {
        checkMouseOut('gender');
    });
    $('#malelink,#femalelink').focus(function() {
        $('#tooltipGender').show();
        flagInputField = 'gender';
    }).blur(function() {
        $('#tooltipGender').hide();
        flagInputField = '';
    }).click(function(e) {
        e.preventDefault();
        $("img.active").css("border-color", "white").removeClass("active");
        var img = $(this).children("img")[0];
        $(img).addClass("active").css("border-color", "#28b8d3");
        $(img).puffy();
        UpdateGender(img.id);
        flagInputField = 'gender';
    });

    // Date Of Birth
    $('#fieldDateOfBirth').mouseover(function() {
        $('#tooltipDateOfBirth').show();
    }).mouseout(function() {
        checkMouseOut('dateofbirth');
    });
    $('[id$=_DateOfBirthLabel]').mouseover(function() {
        $('#tooltipDateOfBirth').show();
    }).mouseout(function() {
        checkMouseOut('dateofbirth');
    });
    $('#fieldDateOfBirth .select_regular').focus(function() {
        flagInputField = 'dateofbirth';
        $('#tooltipDateOfBirth').show();
    }).blur(function() {
        $('#tooltipDateOfBirth').hide();
        flagInputField = '';
    });

    // Country
    $('#fieldCountry').mouseover(function() {
        $('#tooltipCountry').show();
    }).mouseout(function() {
        checkMouseOut('country');
    });
    $('[id$=_CountryLabel]').mouseover(function() {
        $('#tooltipCountry').show();
    }).mouseout(function() {
        checkMouseOut('country');
    });
    $('#fieldCountry .select_regular').focus(function() {
        flagInputField = 'country';
        $('#tooltipCountry').show();
    }).blur(function() {
        $('#tooltipCountry').hide();
        flagInputField = '';
    });

    // EVENTS: TOOLTIP ALTERNATIVE TEXTS
    $('.c8 :password[id$=_CreateUserStepContainer_Password]').keyup(function() { showPasswordStrength(this); });
    $('.c8 :text[id$=_UserName]').keyup(function() { showFullnameGreeting(this); });
    $('.c8 :text[id$=_Email]').keyup(function() { showEmailVerify(this); });
    $('.c8 :password[id$=_CreateUserStepContainer_ConfirmPassword]').keyup(function() { showPasswordVerify(this); });

    // check if mouseout may hide tooltip (negative if still in focus)
    function checkMouseOut(field) {
        if (flagInputField != field) {
            if (field == 'fullname')
                $('#tooltipFullname').hide();
            if (field == 'email')
                $('#tooltipEmail').hide();
            if (field == 'password')
                $('#tooltipPassword').hide();
            if (field == 'passwordretype')
                $('#tooltipPasswordRetype').hide();
            if (field == 'gender')
                $('#tooltipGender').hide();
            if (field == 'dateofbirth')
                $('#tooltipDateOfBirth').hide();
            if (field == 'country')
                $('#tooltipCountry').hide();
        }
    }
    // tooltip update: fullname greeting
    function showFullnameGreeting(ctrl) {
        var fullname = $(ctrl).val();
        if (fullname.length > 0) {
            if (fullname.indexOf(" ", 0) != -1) {
                var showname = fullname.substr(0, fullname.indexOf(" ", 0));
                if (showname.length > 14)
                    $('#tooltipFullname').html('Hi ' + showname.substr(0, 14) + "...")
                else
                    $('#tooltipFullname').html('Hi ' + showname + " :)")
            }
            else {
                if (fullname.length > 14)
                    $('#tooltipFullname').html('Hi ' + fullname.substr(0, 14) + "...")
                else
                    $('#tooltipFullname').html('Hi ' + fullname + " :)")
            }
        }
        else
            $('#tooltipFullname').html('first and last name');
    }
    // tooltip update: email verification
    function showEmailVerify(ctrl) {
        var email = $(ctrl).val();
        if (email.length > 0) {
            var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
            if (filter.test(email)) {
                $('#tooltipEmail').html('yup, this one is valid');
                $('#tooltipEmail').removeClass('tooltipblue');
                $('#tooltipEmail').removeClass('tooltipgreen');
                $('#tooltipEmail').removeClass('tooltipred');
                $('#tooltipEmail').addClass('tooltipgreen');
            }
            else {
                $('#tooltipEmail').html('email not (yet) valid');
                $('#tooltipEmail').removeClass('tooltipblue');
                $('#tooltipEmail').removeClass('tooltipgreen');
                $('#tooltipEmail').removeClass('tooltipred');
                $('#tooltipEmail').addClass('tooltipred');
            }
        }
        else {
            $('#tooltipEmail').html('a valid email address');
            $('#tooltipEmail').removeClass('tooltipblue');
            $('#tooltipEmail').removeClass('tooltipgreen');
            $('#tooltipEmail').removeClass('tooltipred');
            $('#tooltipEmail').addClass('tooltipblue');
        }
    }
    // tooltip update: password strength
    function showPasswordStrength(ctrl) {
        //thanks to douglas karr
        var password = $(ctrl).val();
        var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\\W).*$", "g");
        var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g");

        if (password.length < 6) {
            //$('#tooltipPassword').removeClass('tooltipred');
            //$('#tooltipPassword').removeClass('tooltiporange');
            $('#tooltipPassword').removeClass('tooltipgreen');
            $('#tooltipPassword').addClass('tooltipblue');
            $('#tooltipPassword').html('min. 6 characters');
        }
        else if (strongRegex.test(password)) {
            $('#tooltipPassword').removeClass('tooltipblue');
            //$('#tooltipPassword').removeClass('tooltipred');
            //$('#tooltipPassword').removeClass('tooltiporange');
            //$('#tooltipPassword').removeClass('tooltipgreen');
            //$('#tooltipPassword').addClass('tooltipgreen');
            $('#tooltipPassword').addClass('tooltipgreen');
            $('#tooltipPassword').html('ok (strength: strong)');
        }
        else if (mediumRegex.test(password)) {
            $('#tooltipPassword').removeClass('tooltipblue');
            //$('#tooltipPassword').removeClass('tooltipred');
            //$('#tooltipPassword').removeClass('tooltiporange');
            //$('#tooltipPassword').removeClass('tooltipgreen');
            //$('#tooltipPassword').addClass('tooltiporange');
            $('#tooltipPassword').addClass('tooltipgreen');
            $('#tooltipPassword').html('ok (strength: medium)');
        } else {
            $('#tooltipPassword').removeClass('tooltipblue');
            //$('#tooltipPassword').removeClass('tooltipred');
            //$('#tooltipPassword').removeClass('tooltiporange');
            //$('#tooltipPassword').removeClass('tooltipgreen');
            //$('#tooltipPassword').addClass('tooltipred');
            $('#tooltipPassword').addClass('tooltipgreen');
             $('#tooltipPassword').html('ok (strength: weak)');
        }
    }

    // tooltip update: password verification
    function showPasswordVerify(verifyctrl) {
        var password = $('.c8 :password[id$=_CreateUserStepContainer_Password]').val();
        var password2 = $(verifyctrl).val();
        if (password2.length > 0) {
            if (password != password2) {
                $('#tooltipPasswordRetype').html('verification failed');
                $('#tooltipPasswordRetype').removeClass('tooltipblue');
                $('#tooltipPasswordRetype').removeClass('tooltipgreen');
                $('#tooltipPasswordRetype').removeClass('tooltipred');
                $('#tooltipPasswordRetype').addClass('tooltipred');
            }
            else {
                $('#tooltipPasswordRetype').html('verification ok');
                $('#tooltipPasswordRetype').removeClass('tooltipblue');
                $('#tooltipPasswordRetype').removeClass('tooltipgreen');
                $('#tooltipPasswordRetype').removeClass('tooltipred');
                $('#tooltipPasswordRetype').addClass('tooltipgreen');
            }
        }
        else {
            $('#tooltipPasswordRetype').html('verify password');
            $('#tooltipPasswordRetype').removeClass('tooltipblue');
            $('#tooltipPasswordRetype').removeClass('tooltipgreen');
            $('#tooltipPasswordRetype').removeClass('tooltipred');
            $('#tooltipPasswordRetype').addClass('tooltipblue');
        }
    }
});