// preload images here
$.preloadImages(
    "/img/main/homesroll.jpg",
    "/img/main/homesclick.jpg",
    "/img/main/rvroll.jpg",
    "/img/main/rvclick.jpg"
);

$(function() {

    // create tmp var for homesmain bg image
    var origBgImage = $("#homesmain").css('background-image');
    $("#homesmain").hover(
  
        function() {
            $(this).css('background-image', 'url(/img/main/homesroll.jpg)');
        },
        function() {
            $(this).css('background-image', origBgImage);
        }
  
    ).click(function(){
    
        $(this).unbind('mouseout').unbind('mouseover') // unbind hover events once user clicks & change bg and enable form
            .css('background-image', 'url(/img/main/homesclick.jpg)')
            .find('#homesfields').fadeIn();
    
    });
    
    // create tmp var for rvmain bg image
    var origRvBgImage = $("#rvmain").css('background-image');
    $("#rvmain").hover(
  
        function() {
            $(this).css('background-image', 'url(/img/main/rvroll.jpg)')
                   .find('#rvhover').show();
        },
        function() {
            $(this).css('background-image', origRvBgImage)
                   .find('#rvhover').hide();
        }
  
    );
    
    $("#rvclick").click(function() {
    
        $("#rvmain").unbind('mouseout').unbind('mouseover') // unbind hover events once user clicks & change bg and enable form
            .css('background-image', 'url(/img/main/rvclick.jpg)')
            .find('#rvhover').hide();
        
        $('#rvfields').fadeIn();
    
    });
    
    // rv form validation
    $("#rvfields form").submit(function(){
        type = $(this).find("#type-select").attr('value');
        if (type) return true;
        else {
            $("#type-select-label").append($("<span>You must select a type</span>").addClass("error"));
            return false;
        }
    });
    // home form validation
    $("#homesfields form").submit(function(){
        type = $(this).find("#location-select").attr('value');
        if (type) return true;
        else {
            $("#location-select-label").append($("<span>You must select a location</span>").addClass("error"));
            return false;
        }
    });
    
});