$(document).ready(function() {
    
    $('#loader').hide();
    
    ///////////////////////////////////////////////  Background image loader and animation
    var img = new Image();
    //var x = Math.floor(Math.random()*2); 
    var x = 0;   
    var random_img = [];
    
    random_img[0] = 'images/prayer_bkg.jpg';
    //random_img[1] = 'images/prayer_bkg_2.jpg';
    
    setTimeout(function(){
        $(img).load(function () {  
            $(this).hide();
            $('#content_bkg_img').append(this);
            $(this).fadeIn(3000);
        }).attr('src', random_img[x]); 
    }, 1000); 
    
    
    ///////////////////////////////////////////////  Textarea Autoresize plugin
    $('div.prayer > textarea').autoResize({
        animateDuration : 300,
        extraSpace : 28,
        limit: 180
    });      
    
    ///////////////////////////////////////////////  focus / blur input field preset text manipulation
    var value;
    
    var preset_text = {};
    preset_text.name = 'Type your name here.';
    preset_text.email = 'Type your email address here.';
    preset_text.city = 'City';
    preset_text.state = 'State';
    preset_text.country = 'Country';
    preset_text.prayer = 'Type your prayer request here.';
    preset_text.empty = '';
    
    $('input[type=text], textarea').focus(function() {
        value = $(this).val();
        for (var prop in preset_text) {
            if (value == preset_text[prop]) {
                $(this).val('');
                break;
            }
        }
        $(this).css('color', '#383838');
    })
    
    
    $('input[type=text], textarea').blur(function() {
        var thisProp = $(this).attr('name');

        if ($(this).val() == null || $(this).val() == "") {
            $(this).val(preset_text[thisProp]);
        }
                
        $(this).css('color', '#929292');
    })
    
    ///////////////////////////////////////////////  Designed By Rollover   
    $(window).load(function() {
        $.swapImage(".designed_by");
    });     
    
    ///////////////////////////////////////////////  Jquery Form Validator 
    
    jQuery.validator.addMethod("presetName", function(value, element) { 
      return this.optional(element) || value != preset_text.name; 
    }, "Please enter your name");
    
    jQuery.validator.addMethod("presetCity", function(value, element) { 
      return this.optional(element) || value != preset_text.city; 
    }, "Please enter your city");
    
    jQuery.validator.addMethod("presetState", function(value, element) { 
      return this.optional(element) || value != preset_text.state; 
    }, "Please enter your state");
    
    jQuery.validator.addMethod("presetCountry", function(value, element) { 
      return this.optional(element) || value != preset_text.country; 
    }, "Please enter your country");
    
    jQuery.validator.addMethod("presetPrayer", function(value, element) { 
      return this.optional(element) || value != preset_text.prayer; 
    }, "Please enter a prayer");                
    
    
    $("#PrayerRequestForm").validate({

        rules: {
            name: {
                required: true,
                presetName: true
            },
            email: {
                required: true,
                email: true
            },
            city: {
                required: true,
                presetCity: true
            },
            state: {
                required: true,
                presetState: true,
                minlength: 2
            },
            country: {
                required: true,
                presetCountry: true
            },
            prayer: {
                required: true,
                presetPrayer: true
            }                                               
            
        },   
        
        highlight: function(element, errorClass) {
            if (element['name'] == 'prayer') {
                $(element).parent().addClass(element['name']+'_'+errorClass);
                $('.prayer_top').addClass('prayer_top_'+errorClass);
                $('.prayer_bottom').addClass('prayer_bottom_'+errorClass);
            } else {
                $(element).parent().addClass(element['name']+'_'+errorClass);
            }            
        },
        
        unhighlight: function(element, errorClass) {
            if (element['name'] == 'prayer') {
                $(element).parent().removeClass(element['name']+'_'+errorClass);
                $('.prayer_top').removeClass('prayer_top_'+errorClass);
                $('.prayer_bottom').removeClass('prayer_bottom_'+errorClass);
            } else {
                $(element).parent().removeClass(element['name']+'_'+errorClass);
            }             
        },  
        
        errorLabelContainer: "#label_container",
        
        invalidHandler: function(form, validator) {
            var errors = validator.numberOfInvalids();
            if (errors) {
                var message = 'Please fix the errors highlighted in yellow above';
                $("#error_container").html(message);
                $("#error_container").show();
            } else {
                $("#error_container").hide();
            }
        },        

        focusInvalid: false,
        
        onfocusout: false,
        
        onkeyup: false,
        
        onclick: false,
        
        submitHandler: function(form) {
            formSubmit();
            
            // stay on page
            return false;
        }                                     
        
    });     
    
    
    ///////////////////////////////////////////////  Ajax Submittal of Prayer Request 
    
    function formSubmit() {
        
        //$('input[type=submit]').attr('disabled', 'disabled');
        $('#error_container').hide();
        $('#loader').show();
        
        $.ajax({
            type: "POST",
            url: "prayer_request_thanks.php",
            data: { 
                process: 1, 
                name: $('input[name=name]').val(), 
                email: $('input[name=email]').val(), 
                city: $('input[name=city]').val(), 
                state: $('input[name=state]').val(), 
                country: $('input[name=country]').val(), 
                prayer: $('textarea[name=prayer]').val()
            },
            success: function(data, textStatus){
                
                if (data == 1) {
                    $('#loader').html('<span class="green">Thank you for your prayer request.</span>');
                } else {
                    $('#loader').html('<span class="yellow">There was an error processing your request, please try again later.</span>');
                    setTimeout(function(){
                        
                        $('#loader').fadeOut(1000, function() { $('#loader').html('<span><img src="images/ajax-loader.gif" height="31" width="31" alt="ajax-loader" border="0" />'); } );
                        $('input[type=submit]').removeAttr('disabled');
                       
                    }, 5000); 
                }
            }
        });

    }
    
});