// handles menu hover images
var MenuImageHandler = Class.create({
  
    // find all menu images and adds events
    initialize: function(){
        
        // find all menu images
        $$('img.menuImage').each(function(item){
        
            // observe mouse events
            item.observe('mouseover', this.hover.bindAsEventListener(this))
                .observe('mouseout', this.leave.bindAsEventListener(this));
        }, this);
    },

    // run when the mouse moves over a menu image
    hover: function(event){
        
        // get image src
        imageSrc = Event.element(event).src;
        
        // add the on keyword
        imageSrc = imageSrc.replace('.png','_on.png');
        
        // update src
        Event.element(event).src = imageSrc;
    },
    
    // runs when the mouse leaves a menu image
    leave: function(event){
        
        // get image src
        imageSrc = Event.element(event).src;
        
        // remove on keyword
        imageSrc = imageSrc.replace('_on.png','.png');
        
        // update src
        Event.element(event).src = imageSrc;
    }
});

// search focus handler
// clears search field if it contains 'Search...'
function searchFocusHandler(){
    
    // check and clear
    if( $('searchquery').value == 'Search...' )
        $('searchquery').value = '';
}

// search blur handler
// runs when use leaves the search box and sets back to 'Search...' if it's empty
function searchBlurHandler(){
    
    // check and set
    if( $('searchquery').value == '' )
        $('searchquery').value = 'Search...';
}

// add a dom:loaded handler
document.observe('dom:loaded', function(){
    
    // create image handler
    new MenuImageHandler();
    
    // handle search query field here as well
    if( $('searchquery') ){
        
        // observe
        $('searchquery').observe('focus', searchFocusHandler)
                        .observe('blur', searchBlurHandler);
    }
});