From 44a9b74d06d734948d0ef7c1a02128cb46d0c524 Mon Sep 17 00:00:00 2001
From: Neil Bowers <neil@bowers.com>
Date: Thu, 19 Jan 2012 15:48:19 +0000
Subject: [PATCH] Added mechanism for starting off sub-trees collapsed

---
 example/jquery.jOrgChart.js | 11 ++++++++---
 jquery.jOrgChart.js         |  5 +++++
 readme.markdown             | 18 ++++++++++++++++++
 3 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/example/jquery.jOrgChart.js b/example/jquery.jOrgChart.js
index 1b97c02..f1df0cb 100644
--- a/example/jquery.jOrgChart.js
+++ b/example/jquery.jOrgChart.js
@@ -17,7 +17,7 @@
 
   $.fn.jOrgChart = function(options) {
     var opts = $.extend({}, $.fn.jOrgChart.defaults, options);
-	var $appendTo = $(opts.chartElement);
+    var $appendTo = $(opts.chartElement);
 
 	// build the tree
     $this = $(this);
@@ -184,8 +184,8 @@
         // Draw the horizontal lines
         var $linesRow = $("<tr/>");
         $childNodes.each(function() {
-          var $left = $("<td/>").addClass("line left top");
-          var $right = $("<td/>").addClass("line right top");
+          var $left = $("<td>&nbsp;</td>").addClass("line left top");
+          var $right = $("<td>&nbsp;</td>").addClass("line right top");
           $linesRow.append($left).append($right);
         });
 
@@ -205,10 +205,15 @@
            buildNode($(this), $td, level+1, opts);
            $childNodesRow.append($td);
         });
+
       }
       $tbody.append($childNodesRow);
     }
 
+    if ($node.hasClass('collapsed')) {
+        $nodeRow.nextAll('tr').css('display', 'none');
+    }
+
     $table.append($tbody);
     $appendTo.append($table);
   };
diff --git a/jquery.jOrgChart.js b/jquery.jOrgChart.js
index 736c30b..f1df0cb 100644
--- a/jquery.jOrgChart.js
+++ b/jquery.jOrgChart.js
@@ -205,10 +205,15 @@
            buildNode($(this), $td, level+1, opts);
            $childNodesRow.append($td);
         });
+
       }
       $tbody.append($childNodesRow);
     }
 
+    if ($node.hasClass('collapsed')) {
+        $nodeRow.nextAll('tr').css('display', 'none');
+    }
+
     $table.append($tbody);
     $appendTo.append($table);
   };
diff --git a/readme.markdown b/readme.markdown
index fa9a6c4..015dec6 100644
--- a/readme.markdown
+++ b/readme.markdown
@@ -14,6 +14,7 @@ Features include:
 * Showing/hiding a particular branch of the tree by clicking on the respective node.
 * Nodes can contain any amount of HTML except `<li>` and `<ul>`.
 * Easy to style.
+* You can specify that sub-trees should start collapsed, which is useful for very large trees
 
 ![jQuery OrgChart](http://i.imgur.com/2OpyG.png "jQuery OrgChart")
 
@@ -68,6 +69,23 @@ You'll need to construct a nest unordered list that represents your node nesting
 	</li>
 	</ul>
 
+If you want a sub-tree to start off hiden, just add `class="collapsed"` to a list item (`<li>`). That list item will appear, but everything below it won't. For example:
+
+	<ul id="org" style="display:none">
+      <li>Food:
+        <ul>
+          <li>Beer</li>
+          <li class=collapsed>Vegetables
+            <ul>
+              <li>Carrot</li>
+              <li>Pea</li>
+            </ul>
+          </li>
+          <li>Chocolate</li>
+        </ul>
+      </li>
+    </ul>
+
 *Note that you can include any amount of HTML markup in your `<li>` **except** for other `<ul>` or `<li>` elements.*