// holds the active slideshowframe
var slideshow_active = 1;
// will be defined in template: startpage/show (when we know how many items we got)
//var slideshow_items = 4;
var timer;
var timer_interval = 3000;

jQuery(document).ready(function($) {

	jQuery('.slider_nav_button').click(function() {
		var this_name = jQuery(this).attr('id');
		var name_parts = this_name.split(/_/);

		// store ID of this element
		var this_id = parseInt(name_parts[2]);

		slideshow_show(this_id);
		return false;
	});

	start_timer();

	$(".imgSliderNav").hover(
		function () { stop_timer(); },
		function () { start_timer(); }
	);
	$(".slide_content").hover(
		function () { stop_timer(); },
		function () { start_timer(); }
	);
});

function start_timer(){
	timer = setTimeout("slideshow_rotate()", timer_interval);
}
function stop_timer(){
	clearTimeout(timer);
}

function slideshow_rotate() {
	var next = slideshow_active + 1;
	if( next > slideshow_items ) { next = 1; }
	slideshow_show(next);
	start_timer();
}

function slideshow_show(this_id){
	// fade out active
	jQuery('#slide_content_' + slideshow_active ).fadeOut('slow');

	// fade in new
	jQuery('#slide_content_' + this_id).fadeIn('slow', function() {
		jQuery('#slide_content_' + this_id).addClass('active');
	});

	slideshow_active = this_id;

	// change navigation
	// deactivate all
	jQuery(".imgSliderNav li").removeClass('active');
	jQuery(".activeCorner").hide();

	// set active
	jQuery(".spine_" + this_id).show();
	jQuery("#slider_nav_li_" + this_id).addClass('active');
}