var APBox = new Class({
	getOptions: function(){
		return {
			elemWidth:160,
			className: false,
			morphDuration: 300,
			morphStyle: Fx.Transitions.Quad.easeInOut
		};
	},
	
	initialize: function(options){
		this.setOptions(this.getOptions(), options);
		
		this.openClosePos = {};
		this.contentObj = {};
		
		this.opened = false;
		
		this.index = 0;
		this.oldIndex = 0;
		
		this.content = $$('.'+this.options.className);
		this.container = $$('.tx-igstichwortflow-pi1')[0];
		this.underlay = $$('.kw_underlay')[0];
		
		this.underlay.setStyle('width',1);
		
		this.content.each(function(el,i){
			this.setStyle('width',this.getWidth()+el.getWidth()-1);
			var bla = this.getWidth();
		}, this.underlay);
		
		this.options.elemWidth = Math.round(this.container.getWidth()/4*3);
		
		if($$('.kw_forward')[0]){
			var nextButton = $$('.kw_forward')[0].addEvent('click',function(el){ 
				new Event(el).stop();
				this.next(); 
			}.bind(this));
		}
		
		if($$('.kw_back')[0]){
			var previousButton = $$('.kw_back')[0].addEvent('click',function(el){
				new Event(el).stop(); 
				this.previous(); 
			}.bind(this));
		}
	},
	
	next: function(){
		var newLeft = parseFloat(this.underlay.getStyle('left'))-this.options.elemWidth;
		if((newLeft+this.underlay.getWidth()) > (this.container.getWidth()-2)){
			this.moveUnderlay(newLeft);
		}
		else{
			var newLeft = this.container.getWidth() - this.underlay.getWidth() -2;
			this.moveUnderlay(newLeft);
		}
	},
	
	previous: function(){
		var newLeft = parseFloat(this.underlay.getStyle('left'))+this.options.elemWidth;
		if(newLeft > 0){
			var newLeft = 0;
		}
		this.moveUnderlay(newLeft);
	},

	
	moveUnderlay: function(newLeft){
				
		this.contentEffects = new Fx.Morph(this.underlay, {
			duration: this.options.morphDuration, transition: this.options.morphStyle			
		});
				
		this.contentEffects.start({
			left: newLeft
		});
	}
		
});

APBox.implement(new Options);
APBox.implement(new Events);


onloadHooks.push(function(){
	new APBox({
		className: 'kws'
	});
});
