/**
 * @author Marcel Fiedrich | pillegumfi[at]googlemail.com
 */

window.addEvent('domready',function(){

	var contentBox = $('mwdContentBox');
	
	if (contentBox != null) {
		var contentFader = new function(){
			var contentHeadlines = $$('h2.contentHeadline');
			contentHeadlines = contentHeadlines.length;
			
			var imageFade = false;
			
			var elementHeight;
			var nextButton;
			var nextButtonText = 'Weiter';
			var nextElement;
			var prevButton;
			var prevButtonText = 'Zurück';
			var prevElement;
			
			if(langParam == 'en') {
				nextButtonText = 'Continue';
				prevButtonText = 'Back';
			}
			if(langParam == 'fr') {
				nextButtonText = 'Continuer';
				prevButtonText = 'Retour';
			}
			if(langParam == 'it') {
				nextButtonText = 'Continuare';
				prevButtonText = 'Indietro';
			}
			
			var eyeImageElements = $$('div.imageCatcher');
			var eyeImageElsLength = eyeImageElements.length - 1;
			
			if(eyeImageElements.length > 1) {
				eyeImageElements.each(function(image, index) {
					imageFade = true;
					image.setProperty('id', 'imageElement' + index);
					if(index != 0) {
						image.setStyles({
							'opacity': 0
						});
					}
				});
			}
			
			var contentElements = $$('div.contentElement');
			var contentElsLength = contentElements.length - 1;
			//alert(contentElsLength);
			if (contentElements.length > 1) {
				contentElements.each(function(element, index){
					
					var actImage;
					var nextImage;
					var prevImage;
					
					element.setProperty('class', 'contentElement absolutePos');
					element.setProperty('id', 'contentElement' + index);
					if (contentHeadlines == 2) 
						element.setStyle('top', '66px');
					if (contentHeadlines == 3) 
						element.setStyle('top', '94px');
					
					nextButton = new Element('p', {
						'class': 'contentNextButton',
						'html': '<span>' + nextButtonText + '</span>'
					});
					
					prevButton = new Element('p', {
						'class': 'contentPrevButton',
						'html': '<span>' + prevButtonText + '</span>'
					});
					
					// Den teil für das Fading der Bilder erstellen
					if(imageFade) {
						actImage = contentBox.getElementById('imageElement' + index);
						var imageFadeOut = new Fx.Morph(actImage, {
							duration: 500,
							transition: Fx.Transitions.Quad.easeInOut,
							wait: true
						});
						if (index != contentElsLength) {
							nextImage = index + 1;
							nextImage = contentBox.getElementById('imageElement' + nextImage);
							var imageFadeNext = new Fx.Morph(nextImage, {
								duration: 500,
								transition: Fx.Transitions.Quad.easeInOut,
								wait: true
							});
						}	
						if (index != 0) {
							prevImage = index - 1;
							prevImage = contentBox.getElementById('imageElement' + prevImage);
							var imageFadePrev = new Fx.Morph(prevImage, {
								duration: 500,
								transition: Fx.Transitions.Quad.easeInOut,
								wait: true
							});
						}
					}
					
					if (index != 0) {
						element.setStyles({
							'opacity': 0,
							'left': 364
						});
						element.grab(prevButton);
						prevElement = element.getPrevious('div');
					}
					
					if (index != contentElsLength) {
						element.grab(nextButton);
						nextElement = element.getNext('div');
					}
					
					var fadeOut = new Fx.Morph(element, {
						duration: 500,
						transition: Fx.Transitions.Quad.easeInOut,
						wait: true
					});
					
					var fadeNextIn = new Fx.Morph(nextElement, {
						duration: 500,
						transition: Fx.Transitions.Quad.easeInOut,
						wait: true
					});
					
					var fadePrevIn = new Fx.Morph(prevElement, {
						duration: 500,
						transition: Fx.Transitions.Quad.easeInOut,
						wait: true
					});
					
					nextButton.addEvent('click', function(){
						fadeOut.start({
							'opacity': [0],
							'left': [0, -364]
						});
						
						fadeNextIn.start({
							'opacity': [0, 1],
							'left': [364, 0]
						});
						
						if(imageFade) {
							imageFadeOut.start({
								'opacity': [0]
							});
							
							imageFadeNext.start({
								'opacity': [0, 1]
							});
						}
						
					});
					
					prevButton.addEvent('click', function(){
						fadeOut.start({
							'opacity': [0],
							'left': [0, 364]
						});
						
						fadePrevIn.start({
							'opacity': [0, 1],
							'left': [-364, 0]
						});
						
						if(imageFade) {
							imageFadeOut.start({
								'opacity': [0]
							});
							
							imageFadePrev.start({
								'opacity': [0, 1]
							});
						}
						
					});
					
				});
			}
			
			var latestNewsElement = $$('div.latestNewsElement');
			latestNewsElement.each(function(element, index) {
				element.setStyles({
					'position': 'absolute',
					'top':'auto',
					'bottom':'41px'
				});
			});
			
		};
	}
});