var tabs = function(){

  return{
	info : null,
	target : null,
	name : null,
	height : null,
	width : null,
	
	setLabel : function(index, label){
		var tab = document.getElementById(this.name+'tab'+index).innerHTML = label;		
	},

	create : function(obj){

		this.target = document.getElementById(obj.target);
		this.info = obj.info;
		this.name = obj.name;
		this.height = obj.height;
		this.width = obj.width;
		
		this.target.style.height = this.height;
		
		for(var i=0;i<this.info.length;i++){
			var tab = document.createElement("div");
			tab.setAttribute('id',this.name+'tab'+i);
			tab.className = 'taboff';
			var html = this.info[i].label;
			if(this.info[i].icon != null) 
			  html += " <div style=';margin:auto;padding-left:5px;display:inline;'>"
			  		+	"<img  style='vertical-align:middle' src='"+this.info[i].icon+"' /></div>"
			tab.innerHTML = html;
			
			var self = this;
			tab.onclick = function(){
				for (var t = 0; t < self.info.length; t++) {
					var tab = document.getElementById(self.name+'tab'+t);
					var content = document.getElementById(self.info[t].content);
					if(tab==this){
						tab.className = "tabon";
						content.style.display = 'block';
						if(self.info[t].foc != "") document.getElementById(self.info[t].foc).focus();
					}else{
						content.style.display = 'none';
						tab.className = "taboff";						
					}
				}	
					
			};
			
			tab.style.height = "22px";
			this.target.appendChild(tab);
			
			var cont = document.getElementById(this.info[i].content);
			cont.style.left = 0;
			cont.style.display = 'none';
			cont.style.top = (tab.offsetHeight - 1) + 'px';
		}
		
		document.getElementById(this.name+'tab0').className = "tabon";
		document.getElementById(this.info[0].content).style.display='block';

	}	

  };
}