/*	
 *	DFI Tab Box Script
 *	Feb 16, 2010
 *	Richard Gilchrist
 *
 *	Usage:
 *	----------------------
 *	<link rel="stylesheet" type="text/css" href="/<style_directory>/dfitab.css" />
 *	<script type="text/javascript" src="/<script_directory>/dfitab.js"></script>
 *	<div id="outer_div_ID">
 *		<div id="div1_ID" title="Tab1" class="dfitab_Div">
 *			This is where Div1 content goes
 *		</div>
 *		<div id="div2_ID" title="Tab2" class="dfitab_Div">
 *			This is where Div2 content goes
 *		</div>
 *		<div id="div3_ID" title="Tab3" class="dfitab_Div">
 *			This is where Div3 content goes
 *		</div>
 *	</div>
 *	<script type="text/javascript">
 *		dfitab.init({
 *			maincontainer: "outer_div_ID", // ID of the div where the tab group will be built
 *			behavior: "click" //  when to switch tab -"click" or "mouseover"
 *		})
 *	</script>
 *	----------------------
 */
 var dfitab_instances = new Array()
 var dfitab_defaultCssUrl='/css/dfitab.css'
	
 
 function tabObj(settings) {
		
		this.buildtabs=function(){
			this.outerdiv.className='dfitab'
			var tabStr=''
			tabStr='<div class="dfitab_container"><ul>'
			for(i=0;i<this.divs.length;i++){
				tabStr+='<li id="dfitab_'+i+'-'+this.instanceID+'" class="dfitab_'+(i>0?'in':'')+'active"><span on'+this.behavior+'="dfitab.switchTab('+i+','+this.instanceID+')">'+this.divs[i].tabName+'</span></li>'
				this.divs[i].tabID='dfitab_'+i
			}
			tabStr+='</ul></div>'+this.originalHTML
			this.outerdiv.innerHTML=tabStr
		},
		
		this.init=function(settings){
			this.instanceID = settings.instanceID
			this.outerdiv=document.getElementById(settings.maincontainer)
			this.behavior=settings.behavior
			this.originalHTML=this.outerdiv.innerHTML
			this.divs=new Array()
			var divObjs=this.outerdiv.getElementsByTagName('div')
			for(i=0;i<divObjs.length;i++){
				if(divObjs[i].className=='dfitab_Div'){
					var newDiv=new Object()
					newDiv.divID=divObjs[i].attributes.getNamedItem('id').value
					newDiv.tabName=divObjs[i].attributes.getNamedItem('title').value
					this.divs.push(newDiv)
				}
			}
			this.buildtabs()
			for(i=0;i<this.divs.length;i++){
				document.getElementById(this.divs[i].divID).className='dfitab_'+(i>0?'in':'')+'active_div'
			}
		},
		
		this.init(settings)
	}
 
 var dfitab={	 
	
	setCSS:function(cssUrl){
		if(cssUrl===undefined) cssUrl = dfitab_defaultCssUrl
		var headtg = document.getElementsByTagName('head')[0]
		if (!headtg) {
			return
		}
		var linktg = document.createElement('link')
		linktg.type = 'text/css'
		linktg.rel = 'stylesheet'
		linktg.href = cssUrl
		headtg.appendChild(linktg)
	},
	
	switchTab:function(num, instance){
		for(i=0;i<dfitab_instances[instance].divs.length;i++){
			document.getElementById(dfitab_instances[instance].divs[i].divID).className='dfitab_'+(i!=num?'in':'')+'active_div'
			document.getElementById(dfitab_instances[instance].divs[i].tabID + '-' + instance).className='dfitab_'+(i!=num?'in':'')+'active'
		}
	},
	
	switchTabById:function(myDivId){
		//alert("switchTabById: looking for " + myDivId);
		for(i=0;i<dfitab_instances.length;i++){
			//alert("switchTabById: looking in instance " + i + " (" + dfitab_instances[i].divs.length + " divs)");
			for(j=0;j<dfitab_instances[i].divs.length;j++){
				//alert("switchTabById: looking in instance " + i + ", div " + j + "\nchecking if " + dfitab_instances[i].divs[j].divID + "==" + myDivId);
				if(dfitab_instances[i].divs[j].divID == myDivId) {
					//alert("match found. switchTab(" + j + "," + i +")");
					dfitab.switchTab(j,i);
					return true;
				}
			}
		}
	},
	
	instancereport:function(){
		
		returnme="Instance Array Report"
		for(j=0;j<dfitab_instances.length;j++) {
			mytab = dfitab_instances[j]		
			returnme += "\n--------------------------------------------------------------"
			returnme += "\ninstance: " + j	
			returnme += "\nouter div: " + mytab.outerdiv
			returnme += "\nbehavior: " + mytab.behavior
			returnme += "\n"
			returnme += "\ndiv count: " + mytab.divs.length
			returnme += "\n-------------------------------"
			for(i=0;i<mytab.divs.length;i++){
				returnme += "\ndiv index: " + i
				returnme += "\ndivID: " + mytab.divs[i].divID
				returnme += "\ntabID: " + mytab.divs[i].tabID
				returnme += "\ntabName: " + mytab.divs[i].tabName
				returnme += "\n"
			}
		}
		alert(returnme)
	},
	
	diagnostic:function(settings){
		
		mytab = dfitab_instances[settings.instanceID]
		
		returnme = "Diagnostic report"
		returnme += "\n--------------------------------------------------------------"
		returnme += "\ninstance: " + settings.instanceID
		returnme += "\nouter div: " + mytab.outerdiv
		returnme += "\nbehavior: " + mytab.behavior
		returnme += "\n"
		returnme += "\ndiv count: " + mytab.divs.length
		returnme += "\n--------------------------------------------------------------"
		
		for(i=0;i<mytab.divs.length;i++){
			returnme += "\ndiv index: " + i
			returnme += "\ndivID: " + mytab.divs[i].divID
			returnme += "\ntabID: " + mytab.divs[i].tabID
			returnme += "\ntabName: " + mytab.divs[i].tabName
			returnme += "\n"
		}
		alert(returnme)
		dfitab.instancereport()
	},
	
	init:function(settings) {
		this.setCSS(settings.css);
		settings.instanceID = dfitab_instances.length
		dfitab_instances.push(new tabObj(settings))
		if(settings.diagnosticOutput)
			dfitab.diagnostic(settings)
		var switchToTab = location.hash;
		if(switchToTab != null && switchToTab.length > 0) {
			if(switchToTab.substr(0,8) != "#dfitab:") return true;
			dfitab.switchTabById(switchToTab.substr(8));
		}
	}
 }