/*
e.g. $.ss('slide1') - replaces 'ss-content' with 'ss-slide1' div entries

Special IDs:
* content - The main page view to show
* overview - The slide to show first

Example:
<ul class="slideshow-toc"></ul>
<div class="slideshow">
	<div id="content">&nbsp;</div>
	<div id="overview" title="Overview">
		<h2>Overview</h2>
		<p>Blah blah blah</p>
	</div>
	<div id="overview" title="Overview">
		<h2>Slide 1</h2>
		<p>Blah blah blah</p>
	</div>
</div>
*/
jQuery.extend({
	ss: function(area) {
		$('#ss-content').fadeOut('slow', function() {
			$('#ss-content').html($('#' + area).html()).fadeIn('slow');
		});
	}
});

$(document).ready(function() {
	var html = '';
	$('.slideshow > *').each(function(i) {
		$(this).hide();
		html += "<li><a href=\"javascript:$.ss('" + $(this).attr('id') + "')\">" + $(this).attr('title') + "</a></li>";
	});
	$('.slideshow').prepend('<div id="ss-content">&nbsp;</div>');
	$('.slideshow-toc').html('<ul>' + html + '</ul>');
	$.ss('overview');
});