diff --git a/src/js/bootstrap-treeview.js b/src/js/bootstrap-treeview.js index 7a82a2eeb..e792da525 100644 --- a/src/js/bootstrap-treeview.js +++ b/src/js/bootstrap-treeview.js @@ -63,6 +63,8 @@ onNodeChecked: undefined, onNodeCollapsed: undefined, onNodeDisabled: undefined, + onNodeHidden: undefined, + onNodeVisible: undefined, onNodeEnabled: undefined, onNodeExpanded: undefined, onNodeSelected: undefined, @@ -136,7 +138,10 @@ // Disable / enable methods disableAll: $.proxy(this.disableAll, this), disableNode: $.proxy(this.disableNode, this), + hideNode: $.proxy(this.hideNode, this), enableAll: $.proxy(this.enableAll, this), + hideAll: $.proxy(this.hideAll, this), + showAll: $.proxy(this.showAll, this), enableNode: $.proxy(this.enableNode, this), toggleNodeDisabled: $.proxy(this.toggleNodeDisabled, this), @@ -219,6 +224,14 @@ this.$element.on('nodeDisabled', this.options.onNodeDisabled); } + if (typeof (this.options.onNodeHidden) === 'function') { + this.$element.on('nodeHidden', this.options.onNodeHidden); + } + + if (typeof (this.options.onNodeVisible) === 'function'){ + this.$element.on('nodeVisible', this.options.onNodeVisible); + } + if (typeof (this.options.onNodeEnabled) === 'function') { this.$element.on('nodeEnabled', this.options.onNodeEnabled); } @@ -266,6 +279,8 @@ // nodeId : unique, incremental identifier node.nodeId = _this.nodes.length; + // value : set value to node + node.value = node.value // parentId : transversing up the tree node.parentId = parent.nodeId; @@ -287,6 +302,11 @@ node.state.disabled = false; } + // Set hidden to false by default + if (!node.state.hasOwnProperty('hidden')){ + node.state.hidden = false; + } + // set expanded state; if not provided based on levels if (!node.state.hasOwnProperty('expanded')) { if (!node.state.disabled && @@ -482,6 +502,32 @@ } }; + Tree.prototype.setHiddenState = function (node, state, options) { + + if (state === node.state.hidden) return; + + if (state) { + + // Hide node + node.state.hidden = true; + + // Disable all other states + this.setExpandedState(node, false, options); + + if (!options.silent) { + this.$element.trigger('nodeHidden', $.extend(true, {}, node)); + } + } + else { + + // Show Node + node.state.hidden = false; + if (!options.silent) { + this.$element.trigger('nodeVisible', $.extend(true, {}, node)); + } + } + }; + Tree.prototype.render = function () { if (!this.initialized) { @@ -515,9 +561,11 @@ .addClass('node-' + _this.elementId) .addClass(node.state.checked ? 'node-checked' : '') .addClass(node.state.disabled ? 'node-disabled': '') + .addClass(node.state.hidden ? 'node-hidden': '') .addClass(node.state.selected ? 'node-selected' : '') .addClass(node.searchResult ? 'search-result' : '') .attr('data-nodeid', node.nodeId) + .attr('data-value', node.value) .attr('style', _this.buildStyleOverride(node)); // Add indent/spacer to mimic tree structure @@ -625,6 +673,7 @@ var color = node.color; var backColor = node.backColor; + var nodeVisibility = 'block'; if (this.options.highlightSelected && node.state.selected) { if (this.options.selectedColor) { @@ -644,8 +693,14 @@ } } + if (node.state.hidden) { + nodeVisibility = 'none'; + }else{ + nodeVisibility = 'block'; + } + return 'color:' + color + - ';background-color:' + backColor + ';'; + ';background-color:' + backColor + ';display:' + nodeVisibility + ';'; }; // Add inline style into head @@ -787,6 +842,15 @@ return this.findNodes('true', 'g', 'state.disabled'); }; + Tree.prototype.getHidden = function () { + return this.findNodes('true', 'g', 'state.hidden'); + }; + + Tree.prototype.getVisible = function () { + return this.findNodes('false', 'g', 'state.hidden'); + }; + + /** Returns an array of enabled nodes. @returns {Array} nodes - Enabled nodes @@ -795,7 +859,6 @@ return this.findNodes('false', 'g', 'state.disabled'); }; - /** Set a node state to selected @param {Object|Number} identifiers - A valid node, node id or array of node identifiers @@ -1019,6 +1082,25 @@ this.render(); }; + Tree.prototype.hideAll = function (options) { + var identifiers = this.findNodes('false', 'g', 'state.hidden'); + this.forEachIdentifier(identifiers, options, $.proxy(function (node, options) { + this.setHiddenState(node, true, options); + }, this)); + + this.render(); + }; + + + Tree.prototype.showAll = function (options) { + var identifiers = this.findNodes('true', 'g', 'state.hidden'); + this.forEachIdentifier(identifiers, options, $.proxy(function (node, options) { + this.setHiddenState(node, false, options); + }, this)); + + this.render(); + }; + /** Disable a given tree node @param {Object|Number} identifiers - A valid node, node id or array of node identifiers @@ -1032,6 +1114,14 @@ this.render(); }; + Tree.prototype.hideNode = function (identifiers, options) { + this.forEachIdentifier(identifiers, options, $.proxy(function (node, options) { + this.setHiddenState(node, true, options); + }, this)); + + this.render(); + }; + /** Enable all tree nodes @param {optional Object} options @@ -1085,7 +1175,7 @@ $.each(identifiers, $.proxy(function (index, identifier) { callback(this.identifyNode(identifier), options); - }, this)); + }, this)); }; /* @@ -1156,7 +1246,7 @@ }); if (options.render) { - this.render(); + this.render(); } this.$element.trigger('searchCleared', $.extend(true, {}, results)); @@ -1247,3 +1337,4 @@ }; })(jQuery, window, document); +