new Namespace("at.thermenland.portalslider.teaserslider");
at.thermenland.portalslider.teaserslider = Class.create({

	initialize : function (element) {
		this.slider = element;
		
		this.slidebox = this.slider.getElementsBySelector('.ps_slidebox')[0];
			
		this.itemWidth = 216;
		this.actualPos = 0;

		this.entries = this.slider.getElementsBySelector('.teaser');
		
		this.prev = this.slider.getElementsBySelector('.left')[0];
		this.prev.observe('click', this.left);
		this.prev.myClass = this;
		this.next = this.slider.getElementsBySelector('.right')[0];
		this.next.observe('click', this.right);
		this.next.myClass = this;
		
		for( i=0; i<this.entries.length; i++ ) {
			this.entries[i].myClass = this;
			this.entries[i].observe('mouseover', this.overTeaser);				
			this.entries[i].observe('mouseout', this.outTeaser);
		}
		
		//this.slide(1);
	},
	
	overTeaser : function () {
		this.addClassName('thover');
	},
	
	outTeaser : function () {
		this.removeClassName("thover");
	},
	
	left : function () {
		if(this.myClass.actualPos > 0) {
			this.myClass.slide(this.myClass.actualPos-1);
		}
	},
	
	right : function () {
		if(this.myClass.actualPos < this.myClass.entries.length - 3) {
			this.myClass.slide(this.myClass.actualPos+1);
		}
	},
	
	slide : function (targetPos) {		
		var currentPos = this.actualPos * (this.itemWidth * -1);
		var newSliderPos = targetPos * (this.itemWidth * -1);
		
		ex0 = new Animator({ transition: Animator.makeEaseOut(4),duration: 1000});
		ex0.addSubject(new NumericalStyleSubject(this.slidebox, 'left', String( currentPos ) + 'px', String( newSliderPos ) + 'px' ) );
		ex0.play();
		
		this.actualPos = targetPos;
	}

});