// ===========================================================================
//  TDIALOG.JS
//  --------------------------------------------------------------------------
//  Purpose:      Controlling a tabbed dialog based on HTML
//  Author:       George Lewe
//                based on code by Jonathan Hedley (http://jon.hedley.net/)
//  Copyright:    (c) 2004-2005 by Lewe.com
//                All rights reserved.
// ===========================================================================

var panes = new Array();

// ---------------------------------------------------------------------------
// The setupPanes() method hides the inactive panes, and also measures them all
// and sets the container to the dimensions of the biggest pane, to ensure that
// there is enough room for each pane, and that the page doesn’t reflow as the
// user clicks panes. This should be placed in the body onload attribute, so
// that the browser has laid out the page and knows the width of each pane.
function setupPanes(containerId, defaultTabId) {
	// go through the DOM, find each tab-container
	// set up the panes array with named panes
	// find the max height, set tab-panes to that height
	panes[containerId] = new Array();
	var maxHeight = 0; var maxWidth = 0;
	var container = document.getElementById(containerId);
	var paneContainer = container.getElementsByTagName("div")[0];
	var paneList = paneContainer.childNodes;
	for (var i=0; i < paneList.length; i++ ) {
		var pane = paneList[i];
		if (pane.nodeType != 1)	continue;
		if (pane.offsetHeight > maxHeight) maxHeight = pane.offsetHeight;
		if (pane.offsetWidth  > maxWidth ) maxWidth  = pane.offsetWidth;
		panes[containerId][pane.id] = pane;
		pane.style.display = "none";
	}
    maxWidth=maxWidth-10;
	paneContainer.style.height = maxHeight + "px";
	paneContainer.style.width  = maxWidth + "px";
	document.getElementById(defaultTabId).onclick();
}


// ---------------------------------------------------------------------------
// The showPane() method displays the pane that the user has selected, and 
// hides the others.
function showPane(paneId, activeTab) {
	// make tab active class
	// hide other panes (siblings)
	// make pane visible
	for (var con in panes) {
		activeTab.blur();
		activeTab.className = "tab-active";
		if (panes[con][paneId] != null) { // tab and pane are members of this container
			var pane = document.getElementById(paneId);
			pane.style.display = "block";
			var container = document.getElementById(con);
			var tabs = container.getElementsByTagName("ul")[0];
			var tabList = tabs.getElementsByTagName("a")
			for (var i=0; i<tabList.length; i++ ) {
				var tab = tabList[i];
				if (tab != activeTab) tab.className = "tab-disabled";
			}
			for (var i in panes[con]) {
				var pane = panes[con][i];
				if (pane == undefined) continue;
				if (pane.id == paneId) continue;
				pane.style.display = "none"
			}
		}
	}
	return false;    
}