// = c17v1.js =
/*
javascript functions for dhtml tabs
c17v1.js
$Revision: 1.4 $
(c) 1992-2009 Cisco Systems, Inc. All rights reserved. 
Terms and Conditions: http://cisco.com/en/US/swassets/sw293/sitewide_important_notices.html
*/

// ** {{{object creation }}} **
// Helper function for namespace.
cdc.util.ensureNamespace('cdc.clb.c17v1');

// ** {{{ Global variable declaration }}} **
cdc.clb.c17v1.dhtml_tabs_current_active=""; // global saves which one was active
cdc.clb.c17v1.otherUrlParams=""; // global to save other info in #

//metrics setup
if (contenttype == "undefined") var contenttype="";
if (contentgroup == "undefined") var contentgroup="";
if (typeof(vs_pageview) == "undefined") var vs_pageview = function(){};
var vlc=0; // need to prevent logging of mousedowns

// ** {{{ cdc.clb.c17v1.initTabs }}} **
// Triggers when the page loads.

cdc.clb.c17v1.initTabs=function(){
	// find our tabsets on the page
	jQuery('.c17v1').each( function(){
		var tabRow = document.createElement("tr");
		var subtabDiv = document.createElement("div");
		subtabDiv.id = "subtabs";

		var firstTab = "";
		var foundActive = false;
		var hadTabs = false; 
		var hadSubTabs = false;

		// decides which tab to show as the active one, if specified in URL
		if (! cdc.clb.c17v1.dhtml_tabs_current_active ) {
			var myHash = window.location.hash;
			var myre;
			if (myHash.indexOf("~")!= -1) {
				myre = /#~[^~^,]+$/;  // tab is the only widget state encoded in url
				cdc.clb.c17v1.dhtml_tabs_current_active =  myre.exec(myHash);
				if (!cdc.clb.c17v1.dhtml_tabs_current_active) {
					myre = /#~[^~^,]+,/; // tab is the first widget state encoded in url
					cdc.clb.c17v1.dhtml_tabs_current_active= myre.exec(myHash);
					if (!cdc.clb.c17v1.dhtml_tabs_current_active) {
						myre = /,~[^~^,]+/; // tab is not the first widget state encoded in url
						cdc.clb.c17v1.dhtml_tabs_current_active= myre.exec(myHash);
					}
				} 
				cdc.clb.c17v1.otherUrlParams = ","+myHash.replace(cdc.clb.c17v1.dhtml_tabs_current_active,"").replace("#","");
				myre = /[^#^~^,]+/;
				cdc.clb.c17v1.dhtml_tabs_current_active = String(myre.exec(cdc.clb.c17v1.dhtml_tabs_current_active));
			} else {
				cdc.clb.c17v1.dhtml_tabs_current_active = window.location.hash;
			}
		}

		// setup each tab
		jQuery(".tab").each( function() {
			hadTabs = true;
			if ( firstTab == "") firstTab=this.id;
			// Put the tab in a table cell - 
			var cell = document.createElement("td");
			var corner = document.createElement("span");
			corner.className = "tabcorner";
			corner.appendChild(document.createElement("span"));
			cell.appendChild(corner);
			cell.id = this.id;

			// save cell id of active tab so related content & subtabs can be marked as active
			// first tab is default active one
			if ( !cdc.clb.c17v1.dhtml_tabs_current_active || cdc.clb.c17v1.dhtml_tabs_current_active.indexOf(cell.id) > -1 ) { 
				cdc.clb.c17v1.dhtml_tabs_current_active = cell.id; 
				cell.className = "tab-active";
				vs_pageview(cell.id,contentgroup,"tab",contenttype); // trigger pageview call on active tab
				foundActive = true;
			} else {
				cell.className = "tab";
			}

			// Finds the link 
			var myLink = this.getElementsByTagName("a")[0];
			
			// params for the metrics
			myLink.name = "&lpos=" + cell.id + "_Tab_";
			
			// put the js call on link for tab switching
			function addTabSwitcher(){
				var tabId = cell.id;
				return function (){
					vs_pageview(tabId,contentgroup,"tab",contenttype);
					cdc.clb.c17v1.showMe(tabId);
					return false;
				}
			}
			myLink.onclick = addTabSwitcher();
			cell.appendChild(myLink);

			// add the new tab to the table row
			tabRow.appendChild(cell);

			// hide the original
			this.style.display = "none";
			this.innerHTML = "";
		    this.setAttribute('id','');

		}) // end if it's a tab
		
		// if it's the active one when the page loads trigger a pageview call

		// setup subtabs
		jQuery(".subtab" ).each(function() {
			hadSubTabs = true;
			// create a div for that particular subtab 
			var mySubtab = document.createElement("div");
			mySubtab.innerHTML = this.innerHTML;
			mySubtab.className = "subtab";
			mySubtab.id = this.id;
			if ( mySubtab.id != "sub-"+cdc.clb.c17v1.dhtml_tabs_current_active ) {
				mySubtab.style.display = "none";	
			}
			subtabDiv.appendChild(mySubtab);
	
			// hide the original
			this.id ="";
			this.style.display="none";
			this.innerHTML="";
		}); // end if it's a subtab

		// if the div is a content div do this
		jQuery(".infotab").each(function() {
			// hide the inactive ones, 
			if ( this.id != "info-"+cdc.clb.c17v1.dhtml_tabs_current_active) {
				this.style.display="none";
			}
		}); //end if it is an infotab (tab content)

		// might want to only append these things if there is content? or collapse somehow if not?
		if (hadTabs) {
			var tableNode = document.createElement("table");
			tableNode.appendChild(document.createElement("tBody"));
			tableNode.tBodies[0].appendChild(tabRow);
	
			var tabDiv = document.createElement("div");
			tabDiv.className = "tabset";
			tabDiv.appendChild(tableNode);
		}
		if (hadSubTabs) {
			this.insertBefore(subtabDiv,this.childNodes[0]);
		}
		this.insertBefore(tabDiv,this.childNodes[0]);

		// handle case of anchor link not in any tabs so it initializes to first tab still
		if ( ! foundActive  ) {
			cdc.clb.c17v1.dhtml_tabs_current_active = firstTab;
			document.getElementById(firstTab).className="tab-active";
			document.getElementById("info-"+firstTab).style.display="block";
		}
	}); // end processing tabset
} // end init function declaration;

cdc.clb.c17v1.initTabs();

// ** {{{ cdc.clb.c17v1.showMe }}} **
// triggers when user clicks on any of the tabs. 

cdc.clb.c17v1.showMe=function(tabToShow){

 	var newActive = tabToShow; 
	var oldActive = cdc.clb.c17v1.dhtml_tabs_current_active; // our global var
	cdc.clb.c17v1.dhtml_tabs_current_active = newActive; // save the new value

	oldID = "sub-"+oldActive;
	oldOne = document.getElementById(oldID);
	if (oldOne) oldOne.style.display = "none";
	newID = "sub-"+newActive;
	newOne = document.getElementById(newID);
	if (newOne) newOne.style.display = "block";

	oldID = "info-"+oldActive;
	oldOne = document.getElementById(oldID);
	if (oldOne) oldOne.style.display = "none";
	newID = "info-"+newActive;
	newOne = document.getElementById(newID);
	if (newOne) newOne.style.display = "block";

	var oldOne = document.getElementById(oldActive);
	if (oldOne) oldOne.className = "tab";
	var newOne = document.getElementById(newActive);
	if (newOne) newOne.className = "tab-active";

	window.location.hash = "#~"+tabToShow+cdc.clb.c17v1.otherUrlParams;
}