/*
	Panels
	Mark Simon, Comparity Training
	http://resources.comparity.net
	Feel Free to use

	This script creates displays and manages tabbed panels.
	To use:

	1.	Copy the panels.js and panels.css files somewhere

	2.	Head Section:

		<script type="text/javascript" src="includes/panels.js"></script>

		<script type="text/javascript">
			window.onload=function() {
				new panels('panels');
			}
		</script>

	3. 	Create the following hierarchical structure:

		<div id="panels">
			<div title="...">
				...
			</div>
			<div title="...">
				...
			</div>
			<div title="...">
				...
			</div>
			<div title="...">
				...
			</div>
			<div title="...">
				...
			</div>
		</div>

		That is:

		(a)	You have a div called "panels"
		(b)	The div contains a set of divs.
			Each div may contain other divs, which will not appear as tabs.
		(c)	Each div has a title="..." attribute.

	The id of your list above defaults to "panels".

	Disclaimer:

	This script probably works and it does what it does.
	What it doesn’t do it doesn’t do. E & OE

*/

//window.onload=function() {
//	new panelWidget('panel');
//}

function panelWidget(panel,selected) {
	var panels=new Array();
	var tabs=new Array();
	var i,l;
	//	Get Selected Panel
//		var href=document.location.href.split('/').pop().split('#').pop();	//	get fragment
//		if(href) alert(href);
//		var qs=document.location.href.split('?').pop().split('=');
//		if(qs['panel']) alert(qs=qpanel['panel']);


	//	Get div containing panels
	var div=document.getElementById(panel);
	//	Get collection of divs: each one will be a panel
	var node=div.firstChild;
	do if(node.nodeName.toLowerCase()=='div') panels.push(node);
	while(node=node.nextSibling);
	if(!panels.length) return;

	//	Create unordered list for panel tabs
	var ul=document.createElement('ul');
	ul.style.display='block';
	div.appendChild(ul);

	var li,title;
	for(i=0,l=panels.length;i<l;i++) {
		panels[i].style.display='none';
		li=document.createElement('li');

		title=panels[i].title.split(/: */);						//	split on :
		li.appendChild(document.createTextNode(title.shift()));	//	text=first
		li.title=title.join(': ');								//	title=rest

		li.onclick=show(i);
		li.style.display='inline';
		tabs.push(li);											//	Can I live without this array?
		ul.appendChild(li);
	}

	showPanel(getCookies('panel')||0);
	div.insertBefore(ul,div.firstChild);
	return;

	function showPanel(p) {
			for (var i in panels) panels[i].style['display']='none';
			for (i in tabs) tabs[i].className='tab';
			panels[p].style['display']='block';
			tabs[p].className='tab selected';
			//setCookie('panel',p);
			document.cookie='panel='+p;
	}

	function show(p) {
		return function() {
			showPanel(p);
		};
	}

	function getCookies(name) {
		var item, items, i, c;
		c=new Array();
		items=document.cookie.split("; ");
		for (i in items) {
			item=items[i].split("=");
			c[item[0]]=item[1];
		}
		if(name) return c[name];
		else return c;
	}
}


/*
		var href=local[i].href.split('/').pop().split('#').pop();	//	get fragment
		if(href) {
			//	Copy anchor text
			var text=local[i].firstChild.nodeValue;
			//	Get Container & Replace contents with text
			local[i]=local[i].parentNode;
			while(local[i].hasChildNodes()) local[i].removeChild(local[i].firstChild);
			local[i].appendChild(document.createTextNode(text));
			local[i].onclick=(function(href) {
				return function() {
					doShowPanel(href);
				}
			})(href);
		}


*/
