/**
 * @author orange
 */
var Tabs = Class.create();

Tabs.prototype={
	autoPage:0,
	mouseOver:false,
	startSlide:true,
	fade:false,
	vertical:false,
	duration:1,
	outStop:false,
	outStopper:false,
	
	element: 0,
	initialize: function(element, options){
		
		
		
		this.currentPos=0;
		this.options = this._set_options(options);
		this.element = element;
				
		this.headers = element.select(".tab-handle");
		this.bodies = element.select(".tab");
		
		// paraméterek --
		this.outStop = this.element.getAttribute("data-stop-after-click") ? true : false;
		this.duration = this.element.getAttribute("data-duration") ? this.element.getAttribute("data-duration") : 0.5;
		this.vertical = this.element.getAttribute("data-vertical") ? true : false;
		this.autoPage = this.element.getAttribute("data-autopage");
		this.fade = this.element.getAttribute("data-fade") ? true : false;
		this.defaultPage = this.element.getAttribute("data-defaultpage") ? this.element.getAttribute("data-defaultpage") : 0;
		//--  paraméterek 
		
		
		if(this.buttonNext=element.select(".tabs-next")[0]){
			Event.observe(this.buttonNext,"click",this.next.bindAsEventListener(this));
		}
		if(this.buttonPrev=element.select(".tabs-prev")[0]){
			Event.observe(this.buttonPrev,"click",this.prev.bindAsEventListener(this));
		}
		
		
		if(this.autoPage > 0)
		{
			if(this.overStop=element.select(".tabs-content")[0]){
				Event.observe(this.overStop,"mouseenter",this.stop.bindAsEventListener(this));
			}
			if(this.overStop=element.select(".tabs-content")[0]){
				Event.observe(this.overStop,"mousemove",this.stop.bindAsEventListener(this));
			}
			if(this.overStart=element.select(".tabs-content")[0]){
				Event.observe(this.overStart,"mouseleave",this.start.bindAsEventListener(this));
			}
			if(this.overStop=element.select(".tabs-nav")[0]){
				Event.observe(this.overStop,"mouseenter",this.stop.bindAsEventListener(this));
			}
		}
		

		this.content=element.select(".tabs-content")[0];
		
		this.container=element.select(".tabs-container")[0];

		if(this.headers && this.headers.length && this.bodies.length != this.headers.length){
			throw Error('Number of headers/bodies does not match!');
		}
		
		
		if(this.vertical)
		{
			this.container.style.height=this.posToPx(this.bodies.length)+"px";
		}
		else
		{
			this.container.style.width=this.posToPx(this.bodies.length)+"px";
		}
		
		
		for(var i = 0; i < this.headers.length; i++){
			Event.observe(this.headers[i], this.options.event_trigger, this.show.bind(this, i))
			this.headers[i].style.cursor = "pointer";
			this.bodies[i].style.display = "block";
		}
		this.show(this.defaultPage);
		

	},
	stop:function(){
		if(this.timer){
				window.clearTimeout(this.timer);
		}
	},
	start:function(){
		
		console.log(this.outStopper)
		
		if(this.outStopper) return false;
		
		setTimeout(function(){ 
			
			this.timer=setTimeout(this.next.bind(this), this.autoPage*1000)
		
		}.bind(this), 1000);
	},
	posToPx:function(pos){
		var sum=0
		for(i=0; i<pos; i++){
			sum+= this.vertical ? this.bodies[i].getHeight() : this.bodies[i].getWidth();
		}
		return sum;
	},
	next:function(){
		
		if(this.outStop && this.autoPage > 0) this.outStopper = true;
	
		
		index=this.currentPos+1;
		if ((index >= this.bodies.length) || (index < 0)){
			index=0;
		}
		
		this.show(index);
	},
	prev:function(){
	
		if(this.outStop && this.autoPage > 0) this.outStopper = true;
	
		index=this.currentPos-1;
		if ((index >= this.length) || (index < 0)){
			index=this.length-1;
		}
		this.show(index);
	},
	beforeChange:function(){
		
		var height;
								
		if(height=this.bodies[this.currentPos].getAttribute("data-tab-height")){
			if(height=="auto"){
				
				
				
				if(min = this.bodies[this.currentPos].getAttribute("data-tab-height-min"))
				{
					if(min > this.bodies[this.currentPos].getHeight())
					{
						height=min+"px";
					}
					else
					{
						height=this.bodies[this.currentPos].getHeight()+"px";
					}
				}
				else
				{
			
					height = this.bodies[this.currentPos].getHeight()+"px";
				}
				
				
				
			}
			
			new Effect.Morph(this.content, {
			  		style: "height:"+height, // CSS Properties
			 		duration: 0.5 // Core Effect properties
			});

			
		}
		
	},
	afterChange:function(){
		
	},
	show: function(index){
	
		if(!index && index != "0" || index < 0) index = this.bodies.length-1;
	
		if ((index >= this.length) || (index < 0)){
			throw Error('Index out of range');
		}
		this.headers[this.currentPos].removeClassName("selected");
		oldPx=this.posToPx(this.currentPos);
		
		this.currentPos=index;
	
		this.headers[this.currentPos].addClassName("selected");
		newPx=this.posToPx(this.currentPos);
		var diff=oldPx-newPx;
		this.startSlide = false;
		this.beforeChange();
		//ha fade-es
		if(this.fade && !this.startSlide){		
			this.effect1 = Effect.Fade(this.container, {from:1,to:0.1, afterFinish:function(){
				this.effect2 = new Effect.Move(this.container, {afterFinish:function(){
					Effect.Appear(this.container, { duration: 0.4, afterFinish:this.afterChange.bind(this) });
				
				}.bind(this), x: diff,transition: Effect.Transitions.linear, duration: 0, queue: { position: 'end', scope: 'scope' }});

			}.bind(this), duration: 0.4});
		
		}
		else{
			//Ha függőleges
			if(this.vertical){
				var fx = {y : diff,transition: Effect.Transitions.linear ,duration: this.duration, queue: { position: 'end', scope: 'scope' }, afterFinish:this.afterChange.bind(this)};
			}
			//Ha vízszintes
			else{
				var fx = {x : diff,transition: Effect.Transitions.linear ,duration: this.duration, queue: { position: 'end', scope: 'scope' }, afterFinish:this.afterChange.bind(this)}
			}
			this.effect = new Effect.Move(this.container, fx);
		}
		
		this.startSlide = false;
	
		
		
		if(this.autoPage > 0){
			if(this.timer){
				clearTimeout(this.timer);
			}
			this.timer=setTimeout(this.next.bind(this), this.autoPage*1000);
		}
		
		
	},
	_default_options:
	{
		duration: 0.3,
		event_trigger: 'click'
	},

	_set_options: function(options){
		if(typeof options != "undefined"){
			var result = [];
			for(option in this._default_options){
				if(typeof options[option] == "undefined"){
					result[option] = this._default_options[option];
				}
				else{
					result[option] = options[option];
				}
			}

			return result;
		}
		else{
			return this._default_options;
		}
	}
}
document.observe('dom:loaded', function () {
	elements=$$(".tabs");
	elements.each(function (element){
		new Tabs(element);
	});
});