// When the page loads, apply some functions to the template:
$(document).ready(function() {
    
    // Initialization variables:
    var headerSearchTextDefault = 'Enter product name / keywords';
    
    // Add the function to the search button:
    $('#header-search-button').mouseover(function() { $(this).css('backgroundPosition', '0 -25px'); });
    $('#header-search-button').mouseout(function() { $(this).css('backgroundPosition', '0 0'); });
    
    // Add the keywords and style to the header search:
    $('#keywords').val(headerSearchTextDefault);
    $('#keywords').addClass('inactive');
    $('#keywords').focus(function() { 
        if($(this).val() == headerSearchTextDefault || $(this).val() == '')
        {
            $(this).val('');
            $(this).removeClass('inactive');
        }
    });
    $('#keywords').blur(function() {
        if($(this).val() == '' || $(this).val() == headerSearchTextDefault)
        {
            $(this).val(headerSearchTextDefault);
            $(this).addClass('inactive');
        }
    });
    
    // Check what they try and submit with the form:
    $('#header-search').submit(function() {
        if($('#keywords').val() == headerSearchTextDefault || $('#keywords').val() == '')
        {
            alert('Please enter a valid search term.');
            // Return false to prevent it from submitting:
            return false;
        }
        else
            return true;
    });
})