<!-- Category Toolbar -->
<div class="btn-group btn-group-justified" data-toggle="buttons">
<label class="btn btn-default active">
- <input type="radio" name="category" id="tic-package-category-presets" autocomplete="off" checked>Presets
+ <input type="radio" name="category" data-category="presets" id="tic-package-category-presets" autocomplete="off" checked>Presets
</label>
<label class="btn btn-default">
- <input type="radio" name="category" id="tic-package-category-domains" autocomplete="off">Domains
+ <input type="radio" name="category" data-category="domains" id="tic-package-category-domains" autocomplete="off">Domains
</label>
<label class="btn btn-default">
- <input type="radio" name="category" id="tic-package-category-epicfeature" autocomplete="off">Epic Feature
+ <input type="radio" name="category" data-category="epicfeatures" id="tic-package-category-epicfeature" autocomplete="off">Epic Feature
</label>
<label class="btn btn-default">
- <input type="radio" name="category" id="tic-package-category-all" autocomplete="off">All
+ <input type="radio" name="category" data-category="all" id="tic-package-category-all" autocomplete="off">All
</label>
</div>
}
})
+ // 1. hide all node
_.forEach(packages, function (node) {
node.$el.addClass('node-disabled'); // hide
});
+ // 2. show matched node and check category
+ var category = $("input:radio[name='category']:checked").attr('data-category');
if (!_.isEmpty(matchNodes)) {
_.forEach(matchNodes, function (node) {
- node.$el.removeClass('node-disabled'); // show
+ if (category === 'all' || category === node.category) {
+ node.$el.removeClass('node-disabled'); // show
+ }
});
} else {
// empty input text
if (_.isEmpty(_.trim(_.take(patternList)))) {
_.forEach(packages, function (node) {
- node.$el.removeClass('node-disabled'); // show
+ if (category === 'all' || category === node.category) {
+ node.$el.removeClass('node-disabled'); // show
+ }
});
}
}
+ // 3. hide filter node
_.forEach(filterNodes, function (node) {
node.$el.addClass('node-disabled'); // hide
});
$tree.treeview('clearSearch');
}
+ function _filterCategory() {
+ _filter([]);
+ _collapseAll();
+ }
+ $("input:radio[name='category']").on('change',_filterCategory);
+
function _filterInput() {
var filterText = $('#tic-package-toolbar-input').val();
_filter([filterText]);