ProjectSlider = function(config){
	
	var effect = new Fx.Tween($('slider'),{link:'cancel', duration:500});
	
	// slider breite setzen
	var sliderBreite = 0;
	var margin = $('slider').getElement('ul li').getStyle('margin-right').toInt();

	$$('#slider ul li').each(function(item){
		sliderBreite = sliderBreite + item.getSize().x + margin;	

	});
	sliderBreite = sliderBreite *1.05


	$('slider').setStyle('width',sliderBreite);
	
	


	// positionen
	var positionen = new Array();
	var i = 0;
	$('slider').getElements('ul li').each(function(item){
		i++;
		positionen.push(item.getCoordinates($('slider')).left);
	});
	

	
	
	// var sliderBreite = $('slider').getSize().x;
	
	var getProjectListWidth = function(){
		return $('slider').getSize().x;
				
	}
	
	var projectListWidth = getProjectListWidth();
	
	
	
	
	var getProjectPositionCenter = function(project_index){

		
		var liste = $('slider').getElements('ul li');
		
		// relative position rausfinden
		var pos = positionen[project_index];


		var projektBreite = $('projekt_'+(project_index+1)).getSize().x;
		
		

		
		var alt2Pos = ($('projectList').getSize().x/2) - pos - (projektBreite / 2);
		

		var marginToTrigger = alt2Pos;

		
		$$('#slider ul li').setStyle('color','#ccc');
		$('projekt_'+(project_index+1)).setStyle('color','#fff');
		
	
	
		// rolf
		// event maus loslassen auf knob
		// $('knob').onmouseup=function(){
		// 	$('sliderContentbild').setProperty('src','r3cms/user_upload/'+$('projekt_'+(project_index+1)).getProperty('rel'));			
		// }
		


		
		
		effect.start('margin-left',marginToTrigger);
		
		// $('slider').setStyle('margin-left',newPos);

		
	}
	
	var updateProjectSlider = function(step){

		var posCenter = getProjectPositionCenter(step);

		
	}
	
	
	
	
	// variablen
	
	
	var sliderContainer = $('scroller');
	var sliderKnob = $('knob');
	
	
	var projectCount = $('slider').getElements('ul li').length-1;
	
	var onChange = config.onChange || function(){};
	
	
	var slider = new Slider(sliderContainer, sliderKnob, {
		steps:projectCount,
		onChange: function(step){
			updateProjectSlider(step);
			onChange(step);
		}.bind(this)
		
	});
	
	$$('#slider ul li').each(function(item){
		item.addEvent('click',function(){
			/*
				TODO suboptimal da der Slider "slider" heißen muss
			*/
			slider.set(this.getProperty('class')-1);
		});
	});
	
	

	
	
	return slider;
	
}


window.addEvent('domready',function(){
	$('content').setStyle('background-image','url("http://www.acn-werbeagentur.de/_public/img/ajax-loader.gif")');
	$('content').setStyle('background-position','center center');
	$('content').setStyle('background-repeat','no-repeat');
	
	
	
});




// umgestellt auf onload, weil es probleme mit dem slider gab, wenn der content noch nicht geladen war
window.addEvent('load',function(){
	// alert('Start');
	// content wieder einblenden
	$('sliderContent').setStyle('visibility','visible');
	$('projectList').setStyle('visibility','visible');
	$('scroller').setStyle('visibility','visible');
	$('content').setStyle('background','none');

	
	// console.log('alles wieder da');
	// return;
	
	var active = false;


	
	// effekte
	var effekte = new Object();
	var bilder = new Object();
	
	var i = 0;
	$$('#sliderContent img').each(function(item){
		item.setStyle('opacity',0);
		item.setStyle('display','none');
		effekte[i] = new Fx.Tween(item,{link:'cancel', duration:250, onComplete:function(bild){
			if(this.to[0].value == 0){
				bild.setStyle('display','none');				
			}else{
				bild.setStyle('margin',0);
				bild.setProperty('src',bild.getProperty('rel'));
				
			}

		}});
		bilder[i] = item;
		i++;
	});
	
	active = 0;
	toFade = false;
	

	effekte[0].set('opacity',1);
	bilder[0].setStyle('display','block');
	
		
	var slider = new ProjectSlider({
		onChange:function(step){
			
		
			if(active!=step){
				effekte[active].set('opacity',0);
				bilder[active].setStyle('display','none');
				bilder[step].setStyle('display','block');
				effekte[step].start('opacity',1);
				active = step;  
				
			// console.log(bilder[active].get('class'));
			if (bilder[active].get('class')!='') {
				$('audio_container').setStyle('display', 'block');
				var baseurl_mp3 = "http://www.acn-werbeagentur.de/r3cms/user_upload/";
				AudioPlayer.embed("audioplayer", {soundFile: baseurl_mp3+bilder[active].get('class')});
			}else{
				$('audio_container').setStyle('display', 'none');
			}

				
			}
			// 
			// $(eval('sound_'+step))
			// var baseurl = "http://www.acn-werbeagentur.de/_public/swf/";
			// console.log(step);
			// 
			
			
			// if ($('sound_'+step.rel)!='') {
			// 			
			// 			var obj = new Swiff(baseurl+'splayer.swf', {
			// 					width: 5,
			// 					height: 5,
			// 					container: $('mp3'),
			// 					vars: {
			// 			        	mp3filename: step.rel
			// 			    	}
			// 			});
			
			// };
		}
		});
	
	slider.set(0);
	
	
});