/* 

	List Expander 
	written by Alen Grakalic, provided by Css Globe (cssglobe.com)
	
	Modified by Chris Dobbie 11/11/2008 to expand and highlight the list item corresponding to the current page, 
	which should be marked with a <li class="here" ... > type of entry in the HTML list.
	
*/

this.listexpander = function(){
	
	// edit 
	
	var expandTo = 1; // level up to which you want your lists to be initially expanded. 1 is minimum
	var expandText = "Expand All"; // text for expand all button
	var collapseText = "Collapse All"; // text for collapse all button		
	var listClass = "listexpander" // class name that you want to assign to list(s). If you wish to change it make sure to update the css file as well  
	
	// end edit (do not edit below this line)
	
	// Initialises all the expandable lists on the page
	this.start = function()
	{
		var ul = document.getElementsByTagName("ul");
		for (var i=0;i<ul.length;i++){
			if(ul[i].className == listClass){
				create(ul[i]);
				buttons(ul[i])
			};
		};
	};

	// Goes through the whole list and calls listItem() on each and every element to set it up
	this.create = function(list) 
	{	
		var items = list.getElementsByTagName("li");
		for(var i=0;i<items.length;i++)
		{
			listItem(items[i]);
		};
	};	

	// Setup each list item (li) one by one
	this.listItem = function(li)
	{
    	var liClassName = li.className;
		// Special treatment if the li has a class name starting with "here"
		if(liClassName.substr(0,4) == "here") // the "here" style is applied to the list item corresponding to the current page
	    {
		    // open up the parent ul list so we are shown, for all parent levels up to the top
		    var obj = li.parentNode;
    		while(obj.className != listClass)
    		{
		        if (obj.tagName == "UL")
		        {
			        obj.style.display = "block"; // show the whole UL for this section
		        }
		        else if(obj.tagName == "LI")
		        {
			        obj.className = "expanded"; // the parent LI's must show as expanded - but they're not "here"
		        }
		        obj = obj.parentNode;
	        };
        };
    	
    	// Setup the elements that have sub-lists
		if(li.getElementsByTagName("ul").length > 0)
		{
			var ul = li.getElementsByTagName("ul")[0]; // ul is the sub-list
			// Special treatment if the li has a class name starting with "here"
			if(liClassName.substr(0,4) == "here") // the "here" style is applied to the list item corresponding to the current page
		    {
		        // Show the sub-list - because we're here. Note that the sub-sub lists below this will be closed again when the listItem() function calls on them.
    		    ul.style.display = "block";
    			li.className     = "here-expanded"
		   }
		   else 
		   {
    		    // Expand or contract the sub-list according to the expandTo setting at the top of this file
    			ul.style.display = (depth(ul) <= expandTo) ? "block" : "none";  // this shows or hides the sub-list
    			li.className     = (depth(ul) <= expandTo) ? "expanded" : "collapsed"; // this css style shows the + / - icon on the list item at the top of the sub-list
	      }
			li.over = true;	
			ul.onmouseover = function(){li.over = false;} 
			ul.onmouseout = function(){li.over = true;} 
			li.onclick = function()
			{
				if(this.over)
				{
    				var thisClassName = this.className;
					ul.style.display = (ul.style.display == "none") ? "block" : "none";
					if(thisClassName.substr(0,4) == "here")
					    this.className = (ul.style.display == "none") ? "here-collapsed" : "here-expanded";
					else
					    this.className = (ul.style.display == "none") ? "collapsed" : "expanded";
				};
			};
		}
	};	
	
	// Set up the Expand All / Colapse All buttons at the top
	this.buttons = function(list){
		var parent = list.parentNode;
		var p = document.createElement("p");
		p.className = listClass;
		var a = document.createElement("a");
		a.innerHTML = expandText;
		a.onclick = function(){expand(list)};
		p.appendChild(a);
		var a = document.createElement("a");
		a.innerHTML = collapseText;
		a.onclick = function(){collapse(list)};
		p.appendChild(a);
		parent.insertBefore(p,list);
	};
	
	this.expand = function(list){
		li = list.getElementsByTagName("li");
		for(var i=0;i<li.length;i++){
			if(li[i].getElementsByTagName("ul").length > 0){
				var ul = li[i].getElementsByTagName("ul")[0];
				ul.style.display = "block";
				if(li[i].className.substr(0,4) == "here")
	    			li[i].className = "here-expanded";
	    		else
    				li[i].className = "expanded";
			};
		};
	};
	
	this.collapse = function(list){
		li = list.getElementsByTagName("li");
		for(var i=0;i<li.length;i++){
			if(li[i].getElementsByTagName("ul").length > 0){
				var ul = li[i].getElementsByTagName("ul")[0];
				ul.style.display = "none";
				if(li[i].className.substr(0,4) == "here")
    				li[i].className = "here-collapsed";
    			else
				    li[i].className = "collapsed";
			};
		};
	};
	
	this.depth = function(obj){
		var level = 1;
		while(obj.parentNode.className != listClass){
			if (obj.tagName == "UL") level++;
			obj = obj.parentNode;
		};
		return level;
	};	
	
	start();
	
};

window.onload = listexpander;

