function handleFilterChange() {
	var filterValue = $('#course_filter').val();
	
	// remove 'Filter Listing: ' from previously selected option
	var optionText = $('#course_filter option.filter').html();
	$('#course_filter option.filter').html( optionText.split( ': ' )[1] );
	
	// swap the filter class (highlights the selected item)
	$('#course_filter option.filter').removeClass('filter');
	$('#course_filter option:selected').addClass('filter');
	
	// prepend 'Filter Listing: ' to option text
	/*optionText = 'Filter Listing: ' + $('#course_filter option.filter').html();
	$('#course_filter option.filter').html( optionText );
	*/
	if( filterValue != 'filter_all' ) {
		// hide everything, then show filtered rows that should be visible
		$( '.product_header' ).each( function() { $(this).hide() } );
		$( '.filtered_row, .filter_header' ).each( function() { $(this).hide() } );
		$( '.' + filterValue ).each( function() { $(this).show() } );
	} 
	else {
		// hide the filter headers, show the product headers, show courses
		$( '.filter_header' ).each( function() { $(this).hide() } );
		$( '.product_header' ).each( function() { $(this).show() } );
		$( '.filtered_row' ).each( function() { $(this).show() } );
	}
	
	updateAlternatingRows();
}

function updateAlternatingRows() {
	// update the "alt" class to highlight alternating rows
	$( 'tr:has(td.course_title):visible:odd').addClass('alt');
	$( 'tr:has(td.course_title):visible:even').removeClass('alt');
}

/*
 * 	Shows the desc_cell of the give course number 
 *	(course argument is the oaha:course attribute)
 */
function showCourseDetails( course ) {
	// Get the course details icon
	var courseDetailsIcon = null;
	
	$('tr').each( function( index, el ) {
		if( $(el).attr( 'oaha:course' ) == course ) {
			courseDetailsIcon = $(el).find( '.course_details img' ).first();
			return false; // break the each() loop
		}
	});
	
	// Set the details icon to be the faded version
	$(courseDetailsIcon).attr('src', 'images/pages/course_listing/course_details_open.png' );

	$( '#course_listing .desc_cell' ).each( function(index, el) {
		if( $(this).attr( 'oaha:course' ) == course ) {
			$(this).show();
			
			// Attach icon to hide details button so icon src can be
			// adjusted when hide details is clicked (see handleHideDetailsClick)
			$(this).find( '.hide_desc' ).first().data( 'details_icon', courseDetailsIcon );						
		}
	});
}

/*
 * Hides the desc_cell of the given course number
 * (see showCourseDetails)
 */
function hideCourseDetails( course ) {
	// Get the course details icon
	var courseDetailsIcon = null;
	
	$('tr').each( function( index, el ) {
		if( $(el).attr( 'oaha:course' ) == course ) {
			courseDetailsIcon = $(el).find( '.course_details img' ).first();
			return false; // break the each() loop
		}
	});
	
	// Set the details icon to be the faded version
	$(courseDetailsIcon).attr('src', 'images/pages/course_listing/course_details.png' );

	$( '#course_listing .desc_cell' ).each( function(index, el) {
		if( $(this).attr( 'oaha:course' ) == course ) {
			$(this).hide();
		}
	});
}

/*
 * Click event handler for course details icon
 */ 
function handleCourseDetailsClick() {
	var course = $(this).parents( 'tr' ).first().attr( 'oaha:course' );
	showCourseDetails( course );
}

/*
 * Click event handler for CME/CE credits icon
 */
function CMEDetails(pdf) {

	//alert("Hi, URL is:\n\n/?fuseaction=main.CMEMessage&PDF=" + pdf);
    var options = {
            href : '/?fuseaction=main.CMEMessage&PDF=' + pdf,
            opacity: '0.7',
            overlayClose: false,
            escKey: false,
		    scrolling: false,
            onComplete: onChooseLocaleLoad
        };
	jQuery.colorbox(options);
}

/* 
 * Click event handler for course title
 */
function handleCourseTitleClick() {
	var course = $(this).parents( 'tr' ).first().attr( 'oaha:course' );
	if( isCourseVisible( course ) )
		hideCourseDetails( course );
	else
		showCourseDetails( course );
}

/*
 * Click handler for hide details link
 */
function handleHideDetailsClick() {
	var course = $(this).parents( 'td' ).first().attr( 'oaha:course' );
	hideCourseDetails( course );
}

/*
 * Returns true if course details for the given course argument
 * are visible. Returns false otherwise.
 */
function isCourseVisible( course ) {
	var isVisible = false;
	
	$( 'td.desc_cell:visible' ).each( function( index, el ) {
		if( $(el).attr( 'oaha:course' ) == course ) {
			isVisible = true;							
			return false; // break out of the loop
		}
	});
	
	return isVisible;
}

/*
 * Click event handler for watch demo buttons
 */
function handleWatchDemoClick() {
	var course = $(this).parents( 'tr' ).first().attr( 'oaha:course' );
	showCourseDetails( course );
	showDemo( course );
}

/* 
 * Click event handler for clicking on the demo image
 */
function handleDemoClick() {
	var course = $(this).parents( '.desc_cell' ).first().attr( 'oaha:course' );
	showDemo( course );
}

function showDemo( course ) {
	$('.desc_cell').each( function( index, el ) {
		if( $(el).attr( 'oaha:course' ) ) {
			if( $(el).find( '.video object' ).size() == 0 && $(el).find( '.video' ).size() > 0 )
				swfobject.embedSWF( $(el).find( '.video' ).first().attr( 'oaha:demo'), 
									$(el).find( '.video' ).get(0).id, 
									"332", "292", "6.0.40" );
		}
	} );
}

<!--- Wire up events to fire respective functions --->
$(document).bind( "ready", function() {
	$('#course_filter').bind( "change", handleFilterChange );
	$('#course_listing .course_details a.link_button').bind( "click", handleCourseDetailsClick );
	$('#course_listing .course_title').bind( "click", handleCourseTitleClick );
	$('#course_listing .desc_bottom a.link_button').bind( "click", handleHideDetailsClick );
	$('.video').bind( 'click', handleDemoClick );
	$('.watch_demo a.link_button').bind( 'click', handleWatchDemoClick );
	
	// if there is a 'demo' URL parameter, then show the demo for that course
	var course = $.getUrlVars()['demo'];
	if( course ) {
		showCourseDetails( course );
		showDemo( course );
		$.scrollTo( $('a[name="' + course + '"]'), 800 );
	}
	
	<!--- parse the optional 'f' parameter; default is 'filter_all' --->
	var filter = $.getUrlVars()['f'] || 'filter_all';
	$('#course_filter').val( filter ); // counteracts form auto-fill on some browsers
	if( filter != 'filter_all' )
		$('#course_filter').trigger( 'change' );
	else
		updateAlternatingRows();
		
	/* documentation at bottom of main code src: http://plugins.jquery.com/project/bt */
	$('.showcostinfo').bt( $('#costInfo').html(),  
								  {trigger: 'click', 
									closeWhenOthersOpen: true,
									padding: 10,
									width: 200,
									spikeLength: 0,
									cornerRadius: 7,
									fill: '#ffffff',
									strokeWidth: 1,
									strokeStyle: '#8b8a8a',
									positions: ['bottom'],
									cssStyles: {color: '#000'} } );
});