var changeTitle = {
    config: {
        $listItems: '#img-list li',
        $title: 'h3.title',
        textSelector: 'p:first',
        defaultTextSelector: '#option-1 > p:first',
		eventType: 'input[type=hidden][id$=UpdateContentOn]' // hidden field that indicates to change content on click or hover
    },

    
    init: function(config) {
        var $ = jQuery,
			eventType = $(changeTitle.config.eventType).val();
			
        if (config && typeof(config) == 'object')
            $.extend(changeTitle.config, config);
            
        // set up convenience fields
        changeTitle.defaultText = $(changeTitle.config.defaultTextSelector).text();
        changeTitle.$listItems = $(changeTitle.config.$listItems);
        changeTitle.$title = $(changeTitle.config.$title);
        
        if (changeTitle.$listItems.length == 0)
            return; // quit early if the rollover object isn't on page
        
		// function reference to pass to the event handlers below
		var updateText = function(){
			var titleText = $(changeTitle.config.textSelector, this).text();
			changeTitle.to(titleText);
		}
		
		if (eventType === 'click') {
			changeTitle.$listItems.click(updateText);
		} 
		else {
			changeTitle.$listItems.hover(
				updateText,
				function(){
					changeTitle.toDefault();
				}
			);
        }
    },
    
    to: function(text) {
        changeTitle.$title.text(text);
    },
    
    toDefault: function() {
        changeTitle.to(changeTitle.defaultText);
    }
}


jQuery(function($){
    $(document).ready(function() {
        changeTitle.init();
    });
});