/*
 * CascadingSlider
 * Copyright (c) 2009 Peter Kröner, <http://www.peterkroener.de>, MIT License
 */

var CascadingSlider = new Class({

	Implements: [Options, Events],
	options: {
		slides: '.slide',
		layout: 'horiziontal',
		margin: 16,
		unit: 'px',
		active: 0
	},
	container: null,
	slides: null,
	slideNum: null,
	current: null,

	initialize: function(el, options){
		this.setOptions(options);
		this.container = document.id(el);
		this.slides = this.container.getElements(this.options.slides);
		this.setupSlides();
	},

	setupSlides: function(){
		var margin = 0;
		var property = (this.options.layout == 'horizontal') ? 'top':'left'; // TODO: Vertikales Layout ist ungetestet
		this.slideNum = this.slides.length;
		var that = this;
		for(var i = 0; i < this.slideNum; i++){
			this.slides[i].addEvent('click', function(){
				that.activateSlide(that.slides.indexOf(this));
			});
			this.slides[i].setStyle(property, margin + this.options.unit);
			this.slides[i].setStyle('z-index', i);
			margin = margin + this.options.margin;
		}
		this.activateSlide(this.options.active);
		this.current = this.options.active;
	},

	activateSlide: function(index){
		this.current = index;
		var base = this.slideNum;
		for(var i = 0; i < this.slideNum; i++){
			if(i == index){
				this.slides[i].setStyle('z-index', this.slideNum * 2);
				this.slides[i].addClass('active');
				this.slides[i].fireEvent('activate');
			}
			else{
				if(i < index){
					this.slides[i].setStyle('z-index', base++);
				}
				else{
					this.slides[i].setStyle('z-index', base--);
				}
				this.slides[i].removeClass('active');
			}
		}
	},

	activateNext: function(){
		if(this.current == this.slideNum - 1){
			this.current = 0;
		}
		else{
			++this.current;
		}
		this.activateSlide(this.current);
	},

	activatePrev: function(){
		if(this.current == 0){
			this.current = this.slideNum - 1;
		}
		else{
			--this.current;
		}
		this.activateSlide(this.current);
	}


});



/*
 * FancyCascadingSlider
 * Copyright (c) 2009 Peter Kröner, <http://www.peterkroener.de>, MIT License
 */

var FancyCascadingSlider = new Class({

	Extends: CascadingSlider,
	options: {
		peek: true
	},

	initialize: function(el, options){
		this.parent(el, options);
		this.setOptions(options);
		if(this.options.peek){
			this.enablePeek();
		}
	},

	enablePeek: function(){
		var that = this;
		var peekRollback = function(){
			that.slides.each(function(slide){
				slide.tween(property, slide.retrieve('pos'));
			});
		}
		var property = (this.options.layout == 'horizontal') ? 'top':'left'; // TODO: Vertikales Layout ist ungetestet
		that.slides.each(function(slide){
			var pos = slide.getStyle(property).toInt();
			slide.store('pos', pos);
			slide.addEvent('click', peekRollback);
		});
		that.slides.addEvents({
			'mouseover': function(){
				if(that.slides[that.current] != this){
					var index = that.slides.indexOf(this);
					if(index == 0 || (index == 1 && that.current == 0)){ // Rechts Platz machen
						if(index == 1 && that.current == 0){ // Sich selbst auch verschieben um die aktive Slide stehen lassen zu können?
							that.slides[index].tween(property, that.slides[index].retrieve('pos') + that.options.margin / 2);
							that.slides[index + 1].tween(property, that.slides[index + 1].retrieve('pos') + that.options.margin / 4);
						}
						else{ // Nur die anderen Slides verschieben
							that.slides[index + 1].tween(property, that.slides[index + 1].retrieve('pos') + that.options.margin / 2);
							that.slides[index + 2].tween(property, that.slides[index + 2].retrieve('pos') + that.options.margin / 4);
						}
					}
					else if(index == that.slideNum - 1 || (index == that.slideNum - 2 && that.current == that.slideNum - 1)){ // Links Platz machen
						if(index == that.slideNum - 2 && that.current == that.slideNum - 1){ // Sich selbst auch verschieben um die aktive Slide stehen lassen zu können?
							that.slides[index].tween(property, that.slides[index].retrieve('pos') - that.options.margin / 2);
							that.slides[index - 1].tween(property, that.slides[index - 1].retrieve('pos') - that.options.margin / 4);
						}
						else{ // Nur die anderen Slides verschieben
							that.slides[index - 1].tween(property, that.slides[index - 1].retrieve('pos') - that.options.margin / 2);
							that.slides[index - 2].tween(property, that.slides[index - 2].retrieve('pos') - that.options.margin / 4);
						}
					}
					else{ // Beidseitig Platz machen
						if(that.current > index){
							that.slides[index].tween(property, that.slides[index].retrieve('pos') - that.options.margin / 4);
							that.slides[index + 1].tween(property, that.slides[index + 1].retrieve('pos') + that.options.margin / 4);
						}
						else{
							that.slides[index].tween(property, that.slides[index].retrieve('pos') + that.options.margin / 4);
							that.slides[index - 1].tween(property, that.slides[index - 1].retrieve('pos') - that.options.margin / 4);
						}
					}
				}
			},
			'mouseout': function(){
				peekRollback();
			}
		});
	}

});



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

	var aniText = $('aniText');
	if(aniText){
		var slides = $$('#aniContainer .slide');
		// Slides anklickbar machen
		slides.each(function(slide){
			if(slide.getElements('a')[0]){
				var link = slide.getElements('a')[0].get('href');
				slide.addEvent('click', function(){
					if(!Browser.Engine.trident && this.hasClass('active')){
						window.location.href = 'http://beware-energy.com' + link;
					}
				});
			}
		});
		// Slide-Text kopieren
		slides.each(function(slide){
			var text = slide.get('html');
			slide.addEvent('activate', function(){
				aniText.set('html', text);
			});
			slide.set('html', '');
		});
		// Slider initialisieren
		var slider = new FancyCascadingSlider('aniContainer', {
			slides: '.slide',
			active: 1,
			margin: 132
		});
		// Kleine Schmummelei I: Slide 1 etwas nach links schieben
		slider.slides[0].setStyle('left', '-7px');
		slider.slides[0].store('pos', -7);
		// Steuerung
		var contols = $('aniControls');
		var nextLink = new Element('a', { href: '#', id: 'aniNextLink', html: '<span>»</span>', events: {
			'click': function(e){
				e.stop();
				slider.activateNext();
			}
		}}).inject(contols, 'bottom');
		var prevLink = new Element('a', { href: '#', id: 'aniPrevLink', html: '<span>«</span>', events: {
			'click': function(e){
				e.stop();
				slider.activatePrev();
			}
		}}).inject(contols, 'top');
	}

});