/* ------------------------------------------------------------
 * PROJECT        : 
 * FILENAME       : jq.buildTreeNav.js
 * ------------------------------------------------------------
 * LAST UPDATED   : 05 Nov 2009
 * ------------------------------------------------------------
 * AUTHOR(S)      : Kevin Scholl (ksscholl@magellanhealth.com/)
 * ------------------------------------------------------------ */

/*

SUMMARY

This plugin transforms a set of nested, unordered lists into an tree system, with expandable and collapsable nodes.

OPTIONAL SETTINGS

overallWidth
A string specifying the overall width of the navigation module. Default value is "auto", which will fill the containing element.

controlAll
Boolean value specifying whether to include global control links to expand and collapse all nodes. Default value is true.

controlAlign
A string specifying the horizontal alignment of the control elements. Default value is "left".

initialState
A string specifying whether the tree nodes should be "collapsed" (the default) or "expanded" when the page initially loads.

USAGE

$("el").buildTreeNav();
$("el").buildTreeNav({ options });

where el is an unordered list.

EXAMPLE

$(document).ready(function() {
	$("#navLists").buildTreeNav({
    overallWidth : "400px",
    controlAlign : "right"
		});
	});

MINIMUM BROWSER SUPPORT

Apple Safari 3, Google Chrome 1, Microsoft Internet Explorer 6, Mozilla Firefox 3, Opera 9

Note: There is a slight display anomaly in IE6, due to a bug in that browser's CSS implementation, that can be seen if folder nodes are opened and closed in a particular order. Functionality is not, however, impaired in any way.

*/

jQuery.fn.buildTreeNav = function(settings) {
	settings = jQuery.extend({
		overallWidth : "auto",
		controlAll   :  true,
		controlAlign : "left",
		initialState : "collapsed"
		}, settings);
	this.each(function() {
		var thisID = $(this).attr("id");
		// set the initial states of the nav tree
		$(this)
		  .addClass("tvn")
		  .css("width",settings.overallWidth)
		  .find("li:not(:has(ul))").css("background-image","url(/images/icon_page.png)").end()
			.find("li:has(ul)")      .append("<div class=\"treeNavControl\">").end()
		
		// expand or collapse individual nav node
			.find("li > div.treeNavControl").click(function() {
				var treeNavControlBg 
					= $(this).parent().find(" > ul").is(":visible") == true 
					? "url(/images/icon_folder_closed.png)" 
					: "url(/images/icon_folder_open.png)";
				$(this).parent().find(" > ul").slideToggle();
				$(this).css("background-image",treeNavControlBg);
				});
		
		// set initial state of tree, collapse or expanded
		if (settings.initialState == "collapsed") {
		  $(this).find("ul").css("display","none");
			}
		else
			$(this)
			  .find("div.treeNavControl").css("background-image","url(/images/icon_folder_open.png)").end()
				.find("ul").css("display","block");

		// build expand/collapse all control
		if (settings.controlAll == true) {
			$(this)
			  .before("<div class=\"treeNavControlAll\"></div>\n")
				.prev("div.treeNavControlAll")
				  .css("width",settings.overallWidth == "auto" ? settings.overallWidth : parseInt(settings.overallWidth) + 22 + "px")
				  .append("\n<p style=\"text-align: " + settings.controlAlign + "\"> &nbsp;|&nbsp; </p>\n")
				  .find("p")
						.prepend("<a href=\"#\">Expand All</a>").find("a:contains('Expand')").click(function() {
							$("ul#" + thisID)
								.find("div.treeNavControl")
									.css("background-image","url(/images/icon_folder_open.png)")
									.end()
								.find("ul")
									.css("display","block")
									.end();
							return false;
							}).end() // end Expand All link
						.append("<a href=\"#\">Collapse All</a>").find("a:contains('Collapse')").click(function() {
							$("ul#" + thisID)
								.find("ul")
									.css("display","none")
									.end()
								.find("div.treeNavControl")
									.css("background-image","url(/images/icon_folder_closed.png)")
									.end();
							return false;
							}).end() // end Collapse All link
						.end(); // end paragraph
			}

    });
	};