var contentSlide = new Class({

				   options:	{
					   widthEl: 630,
					   heightEl: 300,
					   elements: 'innercontent',
					   innerElements: '.contentslide',
					   tabContainer: 'tabs',
					   previousEl: 'back',
					   nextEl: 'next',
					   actualEl: 0,
					   allElementIDs: null,
					   allElements: null,
					   typeOEffect: Fx.Transitions.linear,
					   effectDuration: 400,
					   count: 0,
					   p: null
				   },

				   initialize:	function(options){
						this.setOptions(options);
						if(options['widthEl']) this.widthEl = options['widthEl'];
						if(options['heightEl']) this.heightEl = options['heightEl'];
						if(options['elements']) this.elements = options['elements'];
						if(options['previousEl']) this.previousEl = options['previousEl'];
						if(options['innerElements']) this.innerElements = options['innerElements'];
						if(options['nextEl']) this.nextEl = options['nextEl'];
						if(options['tabContainer']) this.tabContainer = options['tabContainer'];
						if(options['effectDuration']){ this.effectDuration = options['effectDuration'] } else{ this.effectDuration = 500 }
						if(options['actualEl']){ this.actualEl = options['actualEl'] } else{ this.options.actualEl = 0; }
						if(options['typeOEffect']) this.typeOEffect = options['typeOEffect'];
				   		$(this.options.nextEl).addEvent('click',this.gotoNext.bindWithEvent(this));
						$(this.options.previousEl).addEvent('click',this.gotoPrevious.bindWithEvent(this));
						this.p = new Fx.Morph($(this.elements),{ duration: this.effectDuration, wait:true, fps:60, link:'chain',transition:this.typeOEffect });

						if(this.innerElements != null){
							this.count = $$(this.innerElements).length;
							this.allElementIDs = $$(this.innerElements);
							this.createDirectButtons(this.count);
						}

						if(this.actualEl != 0){
							this.setActualElement(this.actualEl);
						}


					 },

					 gotoNext: function(el){



						if(this.actualEl < this.count){

							var newLeft = (this.actualEl) * this.widthEl;
							var startLeft = (this.actualEl-1) * this.widthEl;
							this.p.start({ 'left':[-startLeft,-newLeft] });
							this.actualEl += 1;
						}

						el = new Event(el).stop();
					 },

					 gotoPrevious: function(){

						  if(this.actualEl > 1){

							var newLeft = $(this.elements).getStyle('left').toInt();
							var startLeft = newLeft + this.widthEl;
							this.p.start({ 'left':[newLeft,startLeft] });
							this.actualEl -= 1;
						  }

						  return false;
					 },

					 gotoTab:function(el,i,actualEl){
					    if(i == this.actualEl){
							return false;
						}

						if(i > this.actualEl){

							tmp = i - this.actualEl;
							var act = $(this.elements).getStyle('left').toInt();
							var final = this.widthEl * tmp;

							this.p.start({ 'left':[act,act-final] });
							this.actualEl = i;


						}else{
							var act = $(this.elements).getStyle('left').toInt();
							tmp = (i-1) * this.widthEl;

							this.p.start({ 'left':[act,-tmp] });
							//$('debug').set('html',this.actualEl + " ACT: " + act + " TMP: " + tmp );
							this.actualEl = i;

						}

						this.actualEl = i;
						return false;

					 },

					 createDirectButtons: function(amount){
						 for(i=0;i<amount;i++){
							 var id = i + 1;
							 var text = '<img src="images/Button'+id+'.jpg" />';//$(this.allElementIDs[i]).get('id');
							 var el = new Element('a');
							 el.setAttribute('id','a'+ id);
							 el.set('href','#');
							 el.set('html', text);
							 el.set('rel',i+1);
							 el.addEvent('click',this.gotoTab.bindWithEvent((this),[i+1]));
							 el.injectInside($(this.tabContainer));
						 }
					 },

					 setActualElement: function(i){
						 var act = $(this.elements).getStyle('left').toInt();
							tmp = (i-1) * this.widthEl;
							$(this.elements).setStyle('left',-tmp);
							//$('debug').set('html',this.actualEl + " ACT: " + act + " TMP: " + tmp );
							this.actualEl = i;
							return false;
					 }
})
contentSlide.implement(new Options);
contentSlide.implement(new Events);