danielebarchiesi@0
|
1
|
danielebarchiesi@0
|
2 /*
|
danielebarchiesi@0
|
3 * jQuery treeTable Plugin 2.3.0
|
danielebarchiesi@0
|
4 * http://ludo.cubicphuse.nl/jquery-plugins/treeTable/
|
danielebarchiesi@0
|
5 *
|
danielebarchiesi@0
|
6 * Copyright 2010, Ludo van den Boom
|
danielebarchiesi@0
|
7 * Dual licensed under the MIT or GPL Version 2 licenses.
|
danielebarchiesi@0
|
8 */
|
danielebarchiesi@0
|
9 (function($) {
|
danielebarchiesi@0
|
10 // Helps to make options available to all functions
|
danielebarchiesi@0
|
11 // TODO: This gives problems when there are both expandable and non-expandable
|
danielebarchiesi@0
|
12 // trees on a page. The options shouldn't be global to all these instances!
|
danielebarchiesi@0
|
13 var options;
|
danielebarchiesi@0
|
14 var defaultPaddingLeft;
|
danielebarchiesi@0
|
15
|
danielebarchiesi@0
|
16 $.fn.treeTable = function(opts) {
|
danielebarchiesi@0
|
17 options = $.extend({}, $.fn.treeTable.defaults, opts);
|
danielebarchiesi@0
|
18
|
danielebarchiesi@0
|
19 return this.each(function() {
|
danielebarchiesi@0
|
20 $(this).addClass("treeTable").find("tbody tr").each(function() {
|
danielebarchiesi@0
|
21 // Initialize root nodes only if possible
|
danielebarchiesi@0
|
22 if(!options.expandable || $(this)[0].className.search(options.childPrefix) == -1) {
|
danielebarchiesi@0
|
23 // To optimize performance of indentation, I retrieve the padding-left
|
danielebarchiesi@0
|
24 // value of the first root node. This way I only have to call +css+
|
danielebarchiesi@0
|
25 // once.
|
danielebarchiesi@0
|
26 if (isNaN(defaultPaddingLeft)) {
|
danielebarchiesi@0
|
27 defaultPaddingLeft = parseInt($($(this).children("td")[options.treeColumn]).css('padding-left'), 10);
|
danielebarchiesi@0
|
28 }
|
danielebarchiesi@0
|
29
|
danielebarchiesi@0
|
30 initialize($(this));
|
danielebarchiesi@0
|
31 } else if(options.initialState == "collapsed") {
|
danielebarchiesi@0
|
32 this.style.display = "none"; // Performance! $(this).hide() is slow...
|
danielebarchiesi@0
|
33 }
|
danielebarchiesi@0
|
34 });
|
danielebarchiesi@0
|
35 });
|
danielebarchiesi@0
|
36 };
|
danielebarchiesi@0
|
37
|
danielebarchiesi@0
|
38 $.fn.treeTable.defaults = {
|
danielebarchiesi@0
|
39 childPrefix: "child-of-",
|
danielebarchiesi@0
|
40 clickableNodeNames: false,
|
danielebarchiesi@0
|
41 expandable: true,
|
danielebarchiesi@0
|
42 indent: 19,
|
danielebarchiesi@0
|
43 initialState: "collapsed",
|
danielebarchiesi@0
|
44 treeColumn: 0
|
danielebarchiesi@0
|
45 };
|
danielebarchiesi@0
|
46
|
danielebarchiesi@0
|
47 // Recursively hide all node's children in a tree
|
danielebarchiesi@0
|
48 $.fn.collapse = function() {
|
danielebarchiesi@0
|
49 $(this).addClass("collapsed");
|
danielebarchiesi@0
|
50
|
danielebarchiesi@0
|
51 childrenOf($(this)).each(function() {
|
danielebarchiesi@0
|
52 if(!$(this).hasClass("collapsed")) {
|
danielebarchiesi@0
|
53 $(this).collapse();
|
danielebarchiesi@0
|
54 }
|
danielebarchiesi@0
|
55
|
danielebarchiesi@0
|
56 this.style.display = "none"; // Performance! $(this).hide() is slow...
|
danielebarchiesi@0
|
57 });
|
danielebarchiesi@0
|
58
|
danielebarchiesi@0
|
59 return this;
|
danielebarchiesi@0
|
60 };
|
danielebarchiesi@0
|
61
|
danielebarchiesi@0
|
62 // Recursively show all node's children in a tree
|
danielebarchiesi@0
|
63 $.fn.expand = function() {
|
danielebarchiesi@0
|
64 $(this).removeClass("collapsed").addClass("expanded");
|
danielebarchiesi@0
|
65
|
danielebarchiesi@0
|
66 childrenOf($(this)).each(function() {
|
danielebarchiesi@0
|
67 initialize($(this));
|
danielebarchiesi@0
|
68
|
danielebarchiesi@0
|
69 if($(this).is(".expanded.parent")) {
|
danielebarchiesi@0
|
70 $(this).expand();
|
danielebarchiesi@0
|
71 }
|
danielebarchiesi@0
|
72
|
danielebarchiesi@0
|
73 // this.style.display = "table-row"; // Unfortunately this is not possible with IE :-(
|
danielebarchiesi@0
|
74 $(this).show();
|
danielebarchiesi@0
|
75 });
|
danielebarchiesi@0
|
76
|
danielebarchiesi@0
|
77 return this;
|
danielebarchiesi@0
|
78 };
|
danielebarchiesi@0
|
79
|
danielebarchiesi@0
|
80 // Reveal a node by expanding all ancestors
|
danielebarchiesi@0
|
81 $.fn.reveal = function() {
|
danielebarchiesi@0
|
82 $(ancestorsOf($(this)).reverse()).each(function() {
|
danielebarchiesi@0
|
83 initialize($(this));
|
danielebarchiesi@0
|
84 $(this).expand().show();
|
danielebarchiesi@0
|
85 });
|
danielebarchiesi@0
|
86
|
danielebarchiesi@0
|
87 return this;
|
danielebarchiesi@0
|
88 };
|
danielebarchiesi@0
|
89
|
danielebarchiesi@0
|
90 // Add an entire branch to +destination+
|
danielebarchiesi@0
|
91 $.fn.appendBranchTo = function(destination) {
|
danielebarchiesi@0
|
92 var node = $(this);
|
danielebarchiesi@0
|
93 var parent = parentOf(node);
|
danielebarchiesi@0
|
94
|
danielebarchiesi@0
|
95 var ancestorNames = $.map(ancestorsOf($(destination)), function(a) { return a.id; });
|
danielebarchiesi@0
|
96
|
danielebarchiesi@0
|
97 // Conditions:
|
danielebarchiesi@0
|
98 // 1: +node+ should not be inserted in a location in a branch if this would
|
danielebarchiesi@0
|
99 // result in +node+ being an ancestor of itself.
|
danielebarchiesi@0
|
100 // 2: +node+ should not have a parent OR the destination should not be the
|
danielebarchiesi@0
|
101 // same as +node+'s current parent (this last condition prevents +node+
|
danielebarchiesi@0
|
102 // from being moved to the same location where it already is).
|
danielebarchiesi@0
|
103 // 3: +node+ should not be inserted as a child of +node+ itself.
|
danielebarchiesi@0
|
104 if($.inArray(node[0].id, ancestorNames) == -1 && (!parent || (destination.id != parent[0].id)) && destination.id != node[0].id) {
|
danielebarchiesi@0
|
105 indent(node, ancestorsOf(node).length * options.indent * -1); // Remove indentation
|
danielebarchiesi@0
|
106
|
danielebarchiesi@0
|
107 if(parent) { node.removeClass(options.childPrefix + parent[0].id); }
|
danielebarchiesi@0
|
108
|
danielebarchiesi@0
|
109 node.addClass(options.childPrefix + destination.id);
|
danielebarchiesi@0
|
110 move(node, destination); // Recursively move nodes to new location
|
danielebarchiesi@0
|
111 indent(node, ancestorsOf(node).length * options.indent);
|
danielebarchiesi@0
|
112 }
|
danielebarchiesi@0
|
113
|
danielebarchiesi@0
|
114 return this;
|
danielebarchiesi@0
|
115 };
|
danielebarchiesi@0
|
116
|
danielebarchiesi@0
|
117 // Add reverse() function from JS Arrays
|
danielebarchiesi@0
|
118 $.fn.reverse = function() {
|
danielebarchiesi@0
|
119 return this.pushStack(this.get().reverse(), arguments);
|
danielebarchiesi@0
|
120 };
|
danielebarchiesi@0
|
121
|
danielebarchiesi@0
|
122 // Toggle an entire branch
|
danielebarchiesi@0
|
123 $.fn.toggleBranch = function() {
|
danielebarchiesi@0
|
124 if($(this).hasClass("collapsed")) {
|
danielebarchiesi@0
|
125 $(this).expand();
|
danielebarchiesi@0
|
126 } else {
|
danielebarchiesi@0
|
127 $(this).removeClass("expanded").collapse();
|
danielebarchiesi@0
|
128 }
|
danielebarchiesi@0
|
129
|
danielebarchiesi@0
|
130 return this;
|
danielebarchiesi@0
|
131 };
|
danielebarchiesi@0
|
132
|
danielebarchiesi@0
|
133 // === Private functions
|
danielebarchiesi@0
|
134
|
danielebarchiesi@0
|
135 function ancestorsOf(node) {
|
danielebarchiesi@0
|
136 var ancestors = [];
|
danielebarchiesi@0
|
137 while(node = parentOf(node)) {
|
danielebarchiesi@0
|
138 ancestors[ancestors.length] = node[0];
|
danielebarchiesi@0
|
139 }
|
danielebarchiesi@0
|
140 return ancestors;
|
danielebarchiesi@0
|
141 };
|
danielebarchiesi@0
|
142
|
danielebarchiesi@0
|
143 function childrenOf(node) {
|
danielebarchiesi@0
|
144 return $(node).siblings("tr." + options.childPrefix + node[0].id);
|
danielebarchiesi@0
|
145 };
|
danielebarchiesi@0
|
146
|
danielebarchiesi@0
|
147 function getPaddingLeft(node) {
|
danielebarchiesi@0
|
148 var paddingLeft = parseInt(node[0].style.paddingLeft, 10);
|
danielebarchiesi@0
|
149 return (isNaN(paddingLeft)) ? defaultPaddingLeft : paddingLeft;
|
danielebarchiesi@0
|
150 }
|
danielebarchiesi@0
|
151
|
danielebarchiesi@0
|
152 function indent(node, value) {
|
danielebarchiesi@0
|
153 var cell = $(node.children("td")[options.treeColumn]);
|
danielebarchiesi@0
|
154 cell[0].style.paddingLeft = getPaddingLeft(cell) + value + "px";
|
danielebarchiesi@0
|
155
|
danielebarchiesi@0
|
156 childrenOf(node).each(function() {
|
danielebarchiesi@0
|
157 indent($(this), value);
|
danielebarchiesi@0
|
158 });
|
danielebarchiesi@0
|
159 };
|
danielebarchiesi@0
|
160
|
danielebarchiesi@0
|
161 function initialize(node) {
|
danielebarchiesi@0
|
162 if(!node.hasClass("initialized")) {
|
danielebarchiesi@0
|
163 node.addClass("initialized");
|
danielebarchiesi@0
|
164
|
danielebarchiesi@0
|
165 var childNodes = childrenOf(node);
|
danielebarchiesi@0
|
166
|
danielebarchiesi@0
|
167 if(!node.hasClass("parent") && childNodes.length > 0) {
|
danielebarchiesi@0
|
168 node.addClass("parent");
|
danielebarchiesi@0
|
169 }
|
danielebarchiesi@0
|
170
|
danielebarchiesi@0
|
171 if(node.hasClass("parent")) {
|
danielebarchiesi@0
|
172 var cell = $(node.children("td")[options.treeColumn]);
|
danielebarchiesi@0
|
173 var padding = getPaddingLeft(cell) + options.indent;
|
danielebarchiesi@0
|
174
|
danielebarchiesi@0
|
175 childNodes.each(function() {
|
danielebarchiesi@0
|
176 $(this).children("td")[options.treeColumn].style.paddingLeft = padding + "px";
|
danielebarchiesi@0
|
177 });
|
danielebarchiesi@0
|
178
|
danielebarchiesi@0
|
179 if(options.expandable) {
|
danielebarchiesi@0
|
180 cell.prepend('<span style="margin-left: -' + options.indent + 'px; padding-left: ' + options.indent + 'px" class="expander"></span>');
|
danielebarchiesi@0
|
181 $(cell[0].firstChild).click(function() { node.toggleBranch(); });
|
danielebarchiesi@0
|
182
|
danielebarchiesi@0
|
183 if(options.clickableNodeNames) {
|
danielebarchiesi@0
|
184 cell[0].style.cursor = "pointer";
|
danielebarchiesi@0
|
185 $(cell).click(function(e) {
|
danielebarchiesi@0
|
186 // Don't double-toggle if the click is on the existing expander icon
|
danielebarchiesi@0
|
187 if (e.target.className != 'expander') {
|
danielebarchiesi@0
|
188 node.toggleBranch();
|
danielebarchiesi@0
|
189 }
|
danielebarchiesi@0
|
190 });
|
danielebarchiesi@0
|
191 }
|
danielebarchiesi@0
|
192
|
danielebarchiesi@0
|
193 // Check for a class set explicitly by the user, otherwise set the default class
|
danielebarchiesi@0
|
194 if(!(node.hasClass("expanded") || node.hasClass("collapsed"))) {
|
danielebarchiesi@0
|
195 node.addClass(options.initialState);
|
danielebarchiesi@0
|
196 }
|
danielebarchiesi@0
|
197
|
danielebarchiesi@0
|
198 if(node.hasClass("expanded")) {
|
danielebarchiesi@0
|
199 node.expand();
|
danielebarchiesi@0
|
200 }
|
danielebarchiesi@0
|
201 }
|
danielebarchiesi@0
|
202 }
|
danielebarchiesi@0
|
203 }
|
danielebarchiesi@0
|
204 };
|
danielebarchiesi@0
|
205
|
danielebarchiesi@0
|
206 function move(node, destination) {
|
danielebarchiesi@0
|
207 node.insertAfter(destination);
|
danielebarchiesi@0
|
208 childrenOf(node).reverse().each(function() { move($(this), node[0]); });
|
danielebarchiesi@0
|
209 };
|
danielebarchiesi@0
|
210
|
danielebarchiesi@0
|
211 function parentOf(node) {
|
danielebarchiesi@0
|
212 var classNames = node[0].className.split(' ');
|
danielebarchiesi@0
|
213
|
danielebarchiesi@0
|
214 for(key in classNames) {
|
danielebarchiesi@0
|
215 if(classNames[key].match(options.childPrefix)) {
|
danielebarchiesi@0
|
216 return $(node).siblings("#" + classNames[key].substring(options.childPrefix.length));
|
danielebarchiesi@0
|
217 }
|
danielebarchiesi@0
|
218 }
|
danielebarchiesi@0
|
219 };
|
danielebarchiesi@0
|
220 })(jQuery);
|