﻿var ckSchleider = new Class({
		Implements: [Options, Events],
		options: {
						sContainer		:	'sContainer',
						sContentBox		:	'.sContentBox',
						sContents		:	'.sContents',
						sLinks			:	'.sLinks',
						sNavigation		:	'sNavigation',
						sNavNext		:	false,
						sNavBack		:	false,
						transition		:	Fx.Transitions.Quint.easeOut,
						starter			: 	false
		},
		initialize: 	function(options){
						this.setOptions(options);
						this.int_counter = 1;
						this.pos_x = 0;
						this.sContainerWidth = $(this.options.sContainer).getStyle('width').toInt();
						
						//Äußerer Container auf Breite einrichten
						$(this.options.sContainer).setStyle('width', this.sContainerWidth+'px');
						$(this.options.sContainer).setStyle('overflow', 'hidden');
						
						$(this.options.sContainer).getElement(this.options.sContentBox).setStyle('width', 15000);
						$$(this.options.sContents).setStyle('float', 'left');
						//Position vom inneren Container ermitteln
						this.sContainerPosX = $(this.options.sContainer).getElement(this.options.sContentBox).getStyle('left').toInt();
						
						//Menüpunkte einlesen und einblenden, wenn mehr als ein Element vorhanden ist.
						this.sLinksArray = $(this.options.sNavigation).getElements(this.options.sLinks);
						//Inhaltsboxen ermitteln - wichtig für Next+Back-Buttons
						this.Inhaltsboxen = $(this.options.sContainer).getElement(this.options.sContentBox).getElements(this.options.sContents);
						
						if(!this.sLinksArray.length)
						{
							this.sLinksArray = this.Inhaltsboxen;
						}
						if(this.sLinksArray.length > 1) 
						{
							$(this.options.sNavigation).setStyle('display', 'block');
							this.initButtons();
						}

						//Übergangseffekt erzeugen
						this.SchleiderFX = new Fx.Tween($(this.options.sContainer).getElement(this.options.sContentBox), { 										duration: 'long', 
										wait: false,
										transition: this.options.transition
						});
						//Falls eine bestimme Inhaltsbox zuerst angezeigt werden soll
						if(this.options.starter)
						{
							this.int_counter = this.options.starter;
							this.SchleiderStart(this.sLinksArray[this.options.starter-1]);
						}
		},
		sLinksArray: 	[],
		
		initButtons: 	function() {
						this.sLinksArray.each(function(el, i) {
							el.addEvent('click', function(event) {
								this.int_counter = i+1;
								this.SchleiderStart(el);
							}.bind(this)
						)}, this);
						
						if(this.options.sNavNext)
						{						
								$(this.options.sNavigation).getElement(this.options.sNavNext).addEvent('click', function() {	
									this.int_counter = this.Inhaltsboxen.length > this.int_counter ? this.int_counter : 0;
									this.int_counter++;
									this.SchleiderStart(this.sLinksArray[this.int_counter-1]);
								}.bind(this)); 
						}
						
						if(this.options.sNavNext)
						{						
								$(this.options.sNavigation).getElement(this.options.sNavBack).addEvent('click', function() {	
									this.int_counter = (this.int_counter -1)== 0 ? this.Inhaltsboxen.length+1 : this.int_counter;
									this.int_counter--;
									this.SchleiderStart(this.sLinksArray[this.int_counter-1]);
								}.bind(this));
						}						
		},
		
		SchleiderStart: function(el) {
						var new_pos_x = (this.int_counter *(-this.sContainerWidth))+this.sContainerWidth;
						this.SchleiderFX.start('left', this.pos_x, new_pos_x);
						if(this.pos_x != new_pos_x) {
							this.sLinksArray.each(function(listelement) { 
								listelement.removeClass('active');
							});
							el.addClass('active');
						}
						this.pos_x = new_pos_x;
		}
});
