var activeSlide;

$(document).ready(function() {
	
	// Funktion um rotierbilder rotierbar zu machen
	// Rotier mal
	$.fn.addCamRotation = function(f){

		// Alle Cycles zerstören
		$('div.product_detail div.ssRotateCams div.ssRotate').cycle('destroy');

		// Cycle für die aktuelle Cam definieren, bzw nur für das aktuell
		// sichbare div.
		$('div.product_detail div.ssRotateCams div.ssRotate:visible').cycle({ 
		    fx:    'fade', 
		    sync:   1,
			timeout:0,
			speed: 500,
			prev:   'a.ssRotateLeft', 
		    next:   'a.ssRotateRight',
			before: function(){
				activeSlide = $(this).find('a').attr('id');
			}
		});
		if (typeof f == "function") f.call(this);
	}

	// Erste Cam beim Laden der Seite rotieren lassen
	$('div.product_detail div.ssRotateCams .ssRotate').first().show().addCamRotation();

	// Event definieren bei klick auf eine Cam in der Sidebar
	$('ul.boxDoubleList li').live('click', function(){

		// Alle Cams Verstecken
		$('div.product_detail div.ssRotateCams .ssRotate').hide();

		// Angeklickte cam aus der Sidebar holen
		id = $(this).attr('class');

		// Angeklickte cam sichtbar machen und rotieren lassen
		$('div.product_detail div.ssRotateCams').find('#'+id).show().addCamRotation();
	})

	// Fancybox beim Klick auf die CAM
	$("a.cam").fancybox({
		'titleShow'		: false,
		'transitionIn'	: 'elastic',
		'transitionOut'	: 'elastic'
	});

	// Event für den Zoom definieren
	$("a.ssZoom").live('click',function(){
		$('#'+activeSlide).trigger('click');
	})

});