﻿self.CssTab = function (buttonHolderDivID, controlerUl, activeClass, inactiveClass){
	
	this.classA = activeClass;
	this.classIA = inactiveClass;
	
	this.hDivID = buttonHolderDivID;
	this.displayDivID = controlerUl;
	this.buttons = new Array();
	this.tabs = new Array();
	this.curtentBtnIndex = 0;
	this.initialize();
}

CssTab.prototype.initialize = function(){
	
	this.createDisplayUlItems();
	
	var docFragment = document.getElementById(this.hDivID);
	if(docFragment==null)return;
	
	this.buttons.length = 0;
	var indexCounted=0;
	for(var i=0; i< docFragment.childNodes.length; i++){
		if(docFragment.childNodes[i].nodeName=="LI"){
			this.buttons.push(docFragment.childNodes[i])
			docFragment.childNodes[i].cssTab=this;
			docFragment.childNodes[i].onclick = this.cssTabClick;
			docFragment.childNodes[i].redniBroj = indexCounted;
			indexCounted++;
		}
	}
	
}

CssTab.prototype.createDisplayUlItems = function(){
	var docFragment = document.getElementById(this.displayDivID);
	if(docFragment==null)return;
	
	this.tabs.length = 0;
	for(var i=0; i< docFragment.childNodes.length; i++){
		if(docFragment.childNodes[i].nodeName=="LI"){
			this.tabs.push(docFragment.childNodes[i]);
			//docFragment.childNodes[i].onclick = this.cssTabClick;
		}
	}
}

CssTab.prototype.showTab = function(index){
	if(this.tabs.length>index){
		for(var i=0; i < this.tabs.length; i++){
			this.tabs[i].style.display=i==index?"block":"none";
		}
	}
	for(var i=0; i < this.buttons.length; i++){
		this.buttons[i].className=i!=index?this.classA:this.classIA;
	}
}



CssTab.prototype.cssTabClick = function(){
	this.cssTab.showTab(this.redniBroj);
	return false;
}

