window.addEvent('domready', function() { 
	var carousel = $('carousel'); // The inner wrapper
if (carousel){
	var items = $$('#carousel li'); // The different elements, this is an array
	var anzahlitems = 0;
	var activepointer = 0; // Set the inital active element
	var morphduration = 1000;
	var morphtransition = Fx.Transitions.Sine.easeOut;
	var thisPageIndex = 0;
	// Die Ausgangsklassen der Items setzten
	items.each(function(item, index){
    /*if (item.hasClass('selectedskin')){
	thisPageIndex = anzahlitems;
	}*/
	if (index <= activepointer-3){item.set('class','position0');}
	if (index == activepointer-2){item.set('class','position1');}
	if (index == activepointer-1){item.set('class','position2');}
	if (index == activepointer)  {item.set('class','position3');}
	if (index == activepointer+1){item.set('class','position4');}
	if (index == activepointer+2){item.set('class','position5');}
	if (index >= activepointer+3){item.set('class','position6');}
	anzahlitems++;
	item.getElement('img').removeProperties('width','height');
	});
	// The function to browse forward
	function previous_item(){
	if (activepointer > 0){
		if (items[activepointer-3]){
			var myEffect1 = new Fx.Morph(items[activepointer-3], {duration: morphduration, transition: morphtransition});
	 		myEffect1.start('.position1');
		}
		if (items[activepointer-2]){
			var myEffect2 = new Fx.Morph(items[activepointer-2], {duration: morphduration, transition: morphtransition});
	 		myEffect2.start('.position2');
		}
		if (items[activepointer-1]){
			var myEffect3 = new Fx.Morph(items[activepointer-1], {duration: morphduration, transition: morphtransition});
	 		myEffect3.start('.position3');
		}
		if (items[activepointer]){
			var myEffect4 = new Fx.Morph(items[activepointer], {duration: morphduration, transition: morphtransition});
	 		myEffect4.start('.position4');
		}
		if (items[activepointer+1]){
		    var myEffect5 = new Fx.Morph(items[activepointer+1], {duration: morphduration, transition: morphtransition});
	 		myEffect5.start('.position5');
		}
		if (items[activepointer+2]){
			var myEffect5 = new Fx.Morph(items[activepointer+2], {duration: morphduration, transition: morphtransition});
	 		myEffect5.start('.position6');
		}   
		activepointer --;
		
	}
	}
	// The function to browse backward
	function next_item(pos){
	if (items[activepointer+1]){
		if (items[activepointer-2]){	
			var myEffect1 = new Fx.Morph(items[activepointer-2], {duration: morphduration, transition: morphtransition});
	 		myEffect1.start('.position0');
		}
		if (items[activepointer-1]){	
			var myEffect2 = new Fx.Morph(items[activepointer-1], {duration: morphduration, transition: morphtransition});
	 		myEffect2.start('.position1');
		}
		if (items[activepointer]){	
			var myEffect3 = new Fx.Morph(items[activepointer], {duration: morphduration, transition: morphtransition});
	 		myEffect3.start('.position2');
		}
		if (items[activepointer+1]){	
			var myEffect4 = new Fx.Morph(items[activepointer+1], {duration: morphduration, transition: morphtransition});
	 		myEffect4.start('.position3');
		}
		if (items[activepointer+2]){	
		var myEffect5 = new Fx.Morph(items[activepointer+2], {duration: morphduration, transition: morphtransition});
	 		myEffect5.start('.position4');	
		}
		if (items[activepointer+3]){	
			var myEffect5 = new Fx.Morph(items[activepointer+3], {duration: morphduration, transition: morphtransition});
	 		myEffect5.start('.position5');
		 }  
		activepointer ++;
		
	}
	}
	// Set up the 'next' and 'previous' buttons
	$('next').addEvent('click', function(){
		next_item();
	});
	
	$('previous').addEvent('click', function(){
		previous_item();
	});
	/*
	for(var i = 0;i < thisPageIndex;i++) {
	next_item();
	}
	*/
	
}	
	
});

