/*var maxChars = 2000;

    tinyMCE.init({
        mode:                   "textareas",
        theme:                  "modern",
        plugins:                "paste",
        resize:                 false,
        statusbar:              false,
        handle_event_callback:  "characterCount",
        valid_elements:         "b,br,i,p[align|class],span[class],u",
        paste_remove_styles:    true,
        paste_remove_spans:     true,
        paste_text_use_dialog:  true,

        setup: function (ed) {

            ed.on("KeyDown", function (e){

                var text_content = tinyMCE.get('description').getContent();
                var text_cleaned = text_content.replace(/<\/?[^>]+(>|$)/g, "").replace(/&nbsp;/gi, "");
                text_cleaned = text_cleaned.replace(/ /g, "");
                text_cleaned = text_cleaned.replace(/\n/g, "");
                var charsRemaining = maxChars - text_cleaned.length;
                $('#description_chars_remaining').html(charsRemaining);

                if (charsRemaining <= 0) {
                    $('#description_wrapper').addClass('form_field_error');

                    var keyCode = e.keyCode ? e.keyCode : e.charCode;
                    if (keyCode !== undefined &&
                        keyCode != 0 &&
                        keyCode != 8 &&
                        keyCode != 13 &&
                        keyCode != 46 &&
                        keyCode != 16 &&
                        keyCode != 37 &&
                        keyCode != 38 &&
                        keyCode != 39 &&
                        keyCode != 40 &&
                        keyCode != 35 &&
                        keyCode != 33 &&
                        keyCode != 34 &&
                        e.ctrlKey != true) {
                        e.stopPropagation();
                        e.preventDefault();
                    }
                    else {

                    }

                }
                else if (text_cleaned.length > 0) {
                    $('#description_wrapper').removeClass('form_field_error');
                    $('#err_description').hide();
                }

                var text_content = tinyMCE.get('description').getContent();
                var text_cleaned = text_content.replace(/<\/?[^>]+(>|$)/g, "").replace(/&nbsp;/gi, "");
                text_cleaned = text_cleaned.replace(/ /g, "");
                text_cleaned = text_cleaned.replace(/\n/g, "");
                var charsRemaining = maxChars - text_cleaned.length;

                $('#description_chars_remaining').html('<span style="color: red">' + charsRemaining + '</span>');


            });
        }


    });*/


var maxChars = 2000;
function characterCount( e ){
var text_content 	= tinyMCE.get('description').getContent();
var text_cleaned	= text_content.replace(/<\/?[^>]+(>|$)/g,"").replace(/&nbsp;/gi,"");
text_cleaned		= text_cleaned.replace(/ /g,"");
text_cleaned		= text_cleaned.replace(/\n/g,"");
var charsRemaining 	= maxChars - text_cleaned.length;
$('#description_chars_remaining').html(charsRemaining);
if( charsRemaining <= 0 )
{
$('#description_wrapper').addClass('form_field_error');

var keyCode = e.keyCode ? e.keyCode : e.charCode;
if( e.keyCode != undefined &&
e.keyCode != 0 &&
e.keyCode != 8 &&
e.keyCode != 13 &&
e.keyCode != 46 &&
e.keyCode != 16 &&
e.keyCode != 37 &&
e.keyCode != 38 &&
e.keyCode != 39 &&
e.keyCode != 40 &&
e.keyCode != 35 &&
e.keyCode != 33 &&
e.keyCode != 34 &&
e.ctrlKey != true )
{
$('#description_chars_remaining').html('<span style="color: red">'+charsRemaining+'</span>');
return false;
}
else
{
return true;
}
}
else if( text_cleaned.length > 0 )
{
$('#description_wrapper').removeClass('form_field_error');
$('#err_description').hide();
}
}

tinyMCE.init({
mode: "textareas",
theme: "advanced",
plugins: "paste",
theme_advanced_buttons1: "undo, redo, bold,italic,underline,|,justifyleft,justifycenter,justifyright,justifyfull,|,pastetext,pasteword,removeformat",
theme_advanced_buttons2: "",
theme_advanced_buttons3: "",
theme_advanced_buttons4: "",
theme_advanced_toolbar_location: "top",
theme_advanced_toolbar_align: "left",
theme_advanced_resizing: false,
theme_advanced_path: false,
handle_event_callback: "characterCount",
valid_elements : ""
+ "b,"
+ "br,"
+ "i,"
+ "p[align|class],"
+ "span[class],"
+ "u",
paste_remove_styles : true,
paste_remove_spans 	: true,
paste_text_use_dialog : true
});


    //Form Handling Below
    function FinishPage() {
        //Remove the overlay stuff.
        $('.form_submission_overlay').remove();
        $('.form_submission_box').fadeOut('slow', function () {
            $(this).remove();
        });

        //Remove the submission form and Display "Submit a new Audition" button.
        $('#form_box').html('<br><div style="margin: 20px 0px 20px 0px; text-align: center"><a style="font-size: 15px; box-shadow: 0px 1px 3px #000; color: #000000; text-decoration: none; text-shadow: 0px 1px 0px #FFF; background-color: #FFCC00; font-weight: bold; padding: 5px; border: 1px solid #EEA900;" id="submit_button" href="http://www.monroecc.edu/go/auditions">Submit a New Audition</a></div>');
    }

    function Retry() {
        $('#video_target1').contents().find("body").html("");
        $('#video_target2').contents().find("body").html("");

        //Remove the overlay stuff.
        $('.form_submission_overlay').remove();
        $('.form_submission_box').fadeOut('slow', function () {
            $(this).remove();
        });
    }


    function SubmitFormEntries()
    {
        //Check if we need to submit videos
        var videoval = "";
        if ($('#uploading_video').is(':checked'))
            videoval = $('#uploading_video').val();

        //Suck in the fields and send them to the server
        $.post("/apps/mu01_auditions/",
            {
                first_name:             $('#first_name').val(),
                last_name:              $('#last_name').val(),
                m_number:               $('#m_number').val(),
                street_address:         $('#street_address').val(),
                city:                   $('#city').val(),
                state:                  $('#state').val(),
                country:                $('#countries').val(),
                area_code:              $('#area_code').val(),
                phone_number:           $('#phone1').val() + $('#phone2').val(),
                email_address:          $('#email_address').val(),
                primary_instrument:     $('#primary_instrument').val(),
                experience_years:       $('#experience_years').val(),
                music_instructor:       $('#music_instructor').val(),
                formal_lessons_years:   $('#formal_lessons_years').val(),
                skill_level_rating:     $('input:radio[name=skill_level_rating]:checked').val(),
                uploading_video:        videoval,
                song1_title:            $('#song1_title').val(),
                song1_composer:         $('#song1_composer').val(),
                song2_title:            $('#song2_title').val(),
                song2_composer:         $('#song2_composer').val(),
                description:            tinyMCE.get('description').getContent(),
                hk_index: "21dc235fc0b4b674d9f96ace0e258fe6"
            },
            function (data){
                if (data == "success")
                {
                    //Update message to say form has been submitted.
                    //Add OK button to close window.
                    //Hide the form after the OK button is clicked.
                    $('#title_status').html('<img src="images/accept.png" style="vertical-align: middle; padding-right: 10px;"/> Form Submission Complete<br/>');
                    $('.progress_bar_container').hide();
                    $('#message').html('<div>Your form has been submitted successfully. We will contact you after reviewing the information you provided. Thank you!</div><br/>'
                        + '<div style="text-align: center"><a style="font-size: 15px; box-shadow: 0px 1px 3px #000; color: #000000; text-decoration: none; text-shadow: 0px 1px 0px #FFF; background-color: #FFCC00; font-weight: bold; padding: 5px; border: 1px solid #EEA900; padding-left: 25px; background-image: url(images/form_tick.png); background-repeat: no-repeat; background-position: 0px center;" id="complete_button" href="javascript: FinishPage();">OK</a></div>');
                }
                else
                {
                    //Something weird happened
                    $('#title_status').html('<img style="vertical-align: middle; padding-right: 10px;" src="images/exclamation.png"> Error Found');
                    $('#message').html(data + '<div style="text-align: center"><a style="font-size: 15px; box-shadow: 0px 1px 3px #000; color: #000000; text-decoration: none; text-shadow: 0px 1px 0px #FFF; background-color: #FFCC00; font-weight: bold; padding: 5px; border: 1px solid #EEA900; padding-left: 25px; background-image: url(images/form_tick.png); background-repeat: no-repeat; background-position: 0px center;" id="complete_button" href="javascript: Retry();">OK</a></div>');
                    $('.progress_bar_container').hide();
                }
            });
    }

    function ValidateForm() {
        var form_errors = false;
        $('.form_field_error_msg').hide();
        $('.form_field_error').removeClass('form_field_error');

        // ------- Validate Form Fields -------

        var form_fields = [
            "first_name",
            "last_name",
            "m_number",
            "street_address",
            "city",
            "state",
            "zip_code",
            "countries",
            "primary_instrument",
            "experience_years"
        ];
        form_fields.reverse(); //Flip handling order around

        $.each(form_fields, function (index, value) {
            if ($.trim($('#' + value).val()) == "") {
                form_errors = true;
                var field_jq_object = $('#' + value);
                field_jq_object.unbind('change').addClass('form_field_error').focus();
                $("#err_" + value).show();

                //Force a re-validation after they type something...
                field_jq_object.change(function () {
                    if ($.trim($(field_jq_object).val()) != "") {
                        field_jq_object.removeClass('form_field_error');
                        $("#err_" + value).hide();
                    }
                    else {
                        field_jq_object.addClass('form_field_error').focus();
                        $("#err_" + value).show();
                    }
                });
            }
        });


        // ------- Separate validation for phone number -------
        var area_code_val = $('#area_code').val();
        if ($.trim(area_code_val) == "" || area_code_val.length != 3 || parseInt(area_code_val) != area_code_val) {
            $('#err_phone').show();
            $('#area_code').addClass('form_field_error').focus();
            form_errors = true;

            //Force a re-validation after they type something...
            $('#area_code').change(function () {
                area_code_obj = $(this);
                if ($.trim(area_code_obj.val()) == "" || area_code_obj.val().length != 3 || parseInt(area_code_obj.val()) != area_code_obj.val()) {
                    area_code_obj.addClass('form_field_error').focus();
                    $("#err_phone").show();
                }
                else {
                    area_code_obj.removeClass('form_field_error');
                    $("#err_phone").hide();
                }
            });

        }

        var phone1_val = $('#phone1').val();
        if ($.trim(phone1_val) == "" || phone1_val.length != 3 || parseInt(phone1_val) != phone1_val) {
            $('#err_phone').show();
            $('#phone1').addClass('form_field_error').focus();
            form_errors = true;

            $('#phone1').change(function () {
                area_code_obj = $(this);
                if ($.trim(area_code_obj.val()) == "" || area_code_obj.val().length != 3 || parseInt(area_code_obj.val()) != area_code_obj.val()) {
                    area_code_obj.addClass('form_field_error').focus();
                    $("#err_phone").show();
                }
                else {
                    area_code_obj.removeClass('form_field_error');
                    $("#err_phone").hide();
                }
            });
        }

        var phone2_val = $('#phone2').val();
        if ($.trim(phone2_val) == "" || phone2_val.length != 4 || parseInt(phone2_val) != phone2_val) {
            $('#err_phone').show();
            $('#phone2').addClass('form_field_error').focus();
            form_errors = true;

            $('#phone2').change(function () {
                area_code_obj = $(this);
                if ($.trim(area_code_obj.val()) == "" || area_code_obj.val().length != 4 || parseInt(area_code_obj.val()) != area_code_obj.val()) {
                    area_code_obj.addClass('form_field_error').focus();
                    $("#err_phone").show();
                }
                else {
                    area_code_obj.removeClass('form_field_error');
                    $("#err_phone").hide();
                }
            });
        }

        if (!$('input:radio[name=skill_level_rating]:checked').val()) {
            $('#skill_wrapper').addClass('form_field_error').focus();
            $('#err_skill_level_rating').show();
            form_errors = true;

            $('input:radio[name=skill_level_rating]').change(function () {
                frm_obj = $('input:radio[name=skill_level_rating]');
                if (!frm_obj.val()) {
                    $('#skill_wrapper').addClass('form_field_error').focus();
                    $("#err_skill_level_rating").show();
                }
                else {
                    $('#skill_wrapper').removeClass('form_field_error');
                    $("#err_skill_level_rating").hide();
                }
            });
        }

        // ------- Extra validation for Email -------
        var frm_email_address = $('#email_address').val();
        regex = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z0-9_\-\.]{2,4})$/;
        if (!regex.test(frm_email_address)) {
            //Invalid email address
            $('#err_email_address2').show();
            $('#email_address').addClass('form_field_error').focus();
            form_errors = true;

            $('#email_address').change(function () {
                frm_obj = $(this);
                if (!regex.test(frm_obj.val())) {
                    frm_obj.addClass('form_field_error').focus();
                    $("#err_email_address2").show();
                }
                else {
                    frm_obj.removeClass('form_field_error');
                    $("#err_email_address2").hide();
                }
            });
        }


        // ------- Separate validation for description -------
        if ($.trim(tinyMCE.get('description').getContent()) == "") {
            $('#err_description').show();
            $('#description_wrapper').addClass('form_field_error');
            form_errors = true;
        }

        if (form_errors) {

        }
        else {
            //Unless we don't need to upload a video.

            //Upload the form data now
            $('body').prepend('<div class="form_submission_overlay">&nbsp;</div>');
            $('body').prepend('<div class="form_submission_box"><span id="title_status"><img src="images/loading.gif" style="vertical-align: middle; padding-right: 10px;"/> Processing your submission...<br/></span>' +
                '<div id="message" style="margin-top:10px;color:blue">&nbsp;</div>' +
                '<span id="progress" style="color:green">&nbsp;</span>' +
                '<div class="progress_bar_container"><div id="progress_bar" class="progress_bar">&nbsp;<span style="color: #000000">Waiting...</span></div></div>' +
                '</div>');


            setTimeout('SubmitFormEntries()', 3000);
        }
    }

    $(document).ready(function(){
        $('#submit_button').click(function () {
            ValidateForm();
            return false;
        });

        $('#uploading_video').click(function () {
            var isChecked = $('#uploading_video').is(':checked');

            if (isChecked)
                $('#videoUploadContainer').show('fast');
            else
                $('#videoUploadContainer').hide('fast');
        });
    });