var TabMenu = Class.create(
{
	initialize: function(prefix){
		
		this.contentWidth = 0;
		this.active = 0;
		this.prefix = prefix;
		var li = $(prefix).immediateDescendants("li");
		var liLength = li.length;
		var header = new Array();
		var content = new Array();
		
		//Henter ut det som ligger i div elementene som er inne i li elementet og tømmer det.
		for(var i=0; i<liLength; i++){
			header[i] = $(li[i]).getElementsByTagName("div")[0].innerHTML;
			content[i] = $(li[i]).getElementsByTagName("div")[1].innerHTML;
			$(li[i]).innerHTML = "";
		}
		
		//Lager linkene som skal være inne i li elementene
		this.createTabs(li,liLength,header);
		
		//Lager div elementene som skal ligge under ul
		this.createHolder(li,liLength,content);
		
		$(this.prefix+"tabLink"+this.active).addClassName('active');
		
	},
	
	createTabs: function(li,liLength,header){
		
		for(var i=0; i<liLength; i++){
			
			//Lager en ny link
			var a = new Element('a', { id: this.prefix+'tabLink'+i, className: 'tabLink', href: "#", title: ""});
			a.innerHTML = header[i];
			a.addClassName('tabLink');
			$(li[i]).appendChild(a);
			
			//Lager en onClick på alle linkene som er i taben
			Event.observe($(a),'click', this.onTabClick.bindAsEventListener(this,{self:this,i:i}), false);
			
			// Custom event som kan kjøres av andre script
			Event.observe($(a),'nu:click', this.onTabClick.bindAsEventListener(this,{self:this,i:i}), false);
			
			if(i == (liLength-1)){
				$(li[i]).addClassName('last');
			}
			if(i == 0){
				$(li[i]).addClassName('first');
			}
		}
	},
	
	createHolder: function(li,liLength,content){
		
		var divHolder = new Element('div', { id: this.prefix+'divHolder',  className: 'divHolder'});
		new Insertion.After($(this.prefix),divHolder);
		divHolder.addClassName('divHolder');
		var divContent = new Element('div', { id: this.prefix+'divContent', className: 'divContent'});
		new Insertion.Bottom($(this.prefix+"divHolder"),divContent);
		divContent .addClassName('divContent ');
		this.contentWidth = $(this.prefix+"divHolder").getWidth();
		
		var newContent = new Array();
		for(var i=0; i<liLength; i++){
			
			//Lager et nytt div element
			var div = new Element('div', { id: this.prefix+'tabContent'+i,  className: 'tabContent' });
			div.innerHTML = content[i];
			div.addClassName('tabContent');
			//Putter div elementet på bunnen av ul elementet
			new Insertion.Bottom($(this.prefix+"divContent"),div);
		}
		
		$(this.prefix+"divContent").setStyle({ width: (this.contentWidth*liLength)+'px'});
	},
	
	onTabClick: function(event,arg){
		var oldActive = $(this.prefix+"tabLink"+this.active);
		$(oldActive).removeClassName('active');	
		$(oldActive).up().removeClassName('active');
		this.active = arg.i;
		var newActive = $(this.prefix+"tabLink"+this.active);
		$(newActive).addClassName('active');
		$(newActive).up().addClassName('active');
		
		if ($(newActive).up('#order_forms') != undefined)
		{
			var nextTab   = $(newActive).up().next();
			var oldNewTab = $(oldActive).up().next();
			
			if (oldNewTab != undefined)
			{
				$(oldNewTab).removeClassName('next');
			}
			if (nextTab != undefined)
			{
				$(nextTab).addClassName('next');
			}
			
		}
		
		//Kjører move funksjonen
		arg.self.move(arg.i);
		
		//Retunerer false på når du klikker på linken
		Event.stop(event);
	},
	
	move: function(i){
		new Effect.Move(this.prefix+'divContent', {x:-(i*this.contentWidth), y:0, mode: 'absolute'});
	}
	
});

Event.observe(window, 'load', function() {
	
	var ulID = "allTabs";
	
	if($(ulID)){
		var tabby = new TabMenu(ulID);
	}
	
	if($('formTabs')){
		var tabby = new TabMenu('formTabs');
	}
});