/*
	Collabsible Lists
	Mark Simon, Comparity Training
	http://resources.comparity.net
	Feel Free to use
	
	This script creates collapsible lists.
	To use:

	1.	Copy the collapsible.js and collapsible.css files somewhere
	
	2.	Head Section:

		<script type="text/javascript" src="includes/collabsible.js"></script>

		<script type="text/javascript">
			window.onload=function() {
				new collapsible('collapsiple');
			}
		</script>

	3. 	Create the following hierarchical list:

		<ul id="collapsible">
			<li>Categroy 1
				<ul><li>Item 1</li>
					<li>Item 2</li>
					<li>Item 3</li>
					<li>Item 4</li>
					<li>Item 5</li>
				</ul>
			</li>
			<li>Categroy 2
				<ul><li>Item 1</li>
					<li>Item 2</li>
					<li>Item 3</li>
					<li>Item 4</li>
					<li>Item 5</li>
				</ul>
			</li>
			<li>Categroy 3
				<ul><li>Item 1</li>
					<li>Item 2</li>
					<li>Item 3</li>
					<li>Item 4</li>
					<li>Item 5</li>
				</ul>
			</li>
		</ul>

	The class name of your list above defaults to "collapsible".
	However,

	(a)	You can change it as long as it matches the
		var className below.

	(b)	You can combine it with other classes you want
		to use on your anchors by separating them
		with spaces:

		<a class="somethingelse light" ...>

	Disclaimer:

	This script probably works and it does what it does.
	What it doesn’t do it doesn’t do. E & OE

	The following styles make it look more effective:

	#collapsible li.open *			Style for open items and contents
	#collapsible li.open, li.closed	Style for all items
	#collapsible li.open			Style for open item
	#collapsible li.closed			Style for closed item
	#collapsible li.closed:before	Works in most browswers, but not IE up to 7
									content: '+';
	#collapsible li.open:before		Works in most browswers, but not IE up to 7
									content: '-';

	#collapsible li {
		list-style-type: square;
	}

	#collapsible li.open * {

	}

	#collapsible li.open, li.closed {

	}

	#collapsible li.open {
		list-style-type: circle;
	}

	#collapsible li.closed {
		font-weight: bold;
		list-style-type: disc;
	}

	#collapsible li.closed:before {

	}

	#collapsible li.open:before {

	}
*/

function collapsible(collapsible) {
	if(!collapsible) collapsible='collapsible';
	var menu=document.getElementById(collapsible);
	var li=menu.getElementsByTagName('li');
	for(var i=0;i<li.length;i++) {
		if(li[i].getElementsByTagName('ul').length) {
			li[i].className='closed';
			li[i].onclick=twist;
			li[i].title='Click to Expand or Collapse';
		}
		else li[i].onclick=ignoreClick;
	}
	style='#'+collapsible+' li.closed ul { display: none; }';
	addCSS(style);

	function twist(e) {
		if(!e) var e=window.event;
		if(this.className.search(/\bclosed\b/)>-1)
			this.className=this.className.replace(/\bclosed\b/,'open');
		else if(this.className.search(/\bopen\b/)>-1)
			this.className=this.className.replace(/\bopen\b/,'closed');
		ignoreClick(e);
	}
	function ignoreClick(e) {
		if(!e) var e=window.event;
		if(e.stopPropogation) e.stopPropogation();
		else e.cancelBubble=true;
	}
	function addCSS(cssCode) {
		//	http://yuiblog.com/blog/2007/06/07/style/
		var styleElement=document.createElement('style');
		styleElement.type='text/css';
		if(styleElement.styleSheet) styleElement.styleSheet.cssText=cssCode;
		else styleElement.appendChild(document.createTextNode(cssCode));
		document.getElementsByTagName('head')[0].appendChild(styleElement);
	}
}