| 提交 | 用户 | 时间 | ||
| 58d006 | 1 | /** |
| A | 2 | <b>Treeview</b>. A wrapper for FuelUX treeview element. |
| 3 | It's just a wrapper so you still need to include FuelUX treeview script first. | |
| 4 | */ | |
| 5 | (function($ , undefined) { | |
| 6 | ||
| 7 | $.fn.aceTree = $.fn.ace_tree = function(options) { | |
| 8 | var $defaults = { | |
| 9 | 'open-icon' : ace.vars['icon'] + 'fa fa-folder-open', | |
| 10 | 'close-icon' : ace.vars['icon'] + 'fa fa-folder', | |
| 11 | 'toggle-icon': ace.vars['icon'] + 'fa fa-play', | |
| 12 | 'selected-icon' : ace.vars['icon'] + 'fa fa-check', | |
| 13 | 'unselected-icon' : ace.vars['icon'] + 'fa fa-times', | |
| 14 | 'base-icon' : ace.vars['icon'] + 'fa', | |
| 15 | 'folder-open-icon' : 'fa fa-plus-square-o', | |
| 16 | 'folder-close-icon' : 'fa fa-plus-minus-o', | |
| 17 | 'loadingHTML': 'Loading...' | |
| 18 | } | |
| 19 | ||
| 20 | this.each(function() { | |
| 21 | ||
| 22 | var attrib_values = ace.helper.getAttrSettings(this, $defaults); | |
| 23 | var $options = $.extend({}, $defaults, options, attrib_values); | |
| 24 | ||
| 25 | var $this = $(this); | |
| 26 | $this.addClass('tree').attr('role', 'tree'); | |
| 27 | $this.html( | |
| 28 | '<li class="tree-branch hide" data-template="treebranch" role="treeitem" aria-expanded="false">\ | |
| 29 | '+($options['folderSelect'] ? '<i class="icon-caret '+$options['folder-open-icon']+'"></i> ' : '')+'\ | |
| 30 | <div class="tree-branch-header">\ | |
| 31 | <span class="tree-branch-name">\ | |
| 32 | <i class="icon-folder '+$options['close-icon']+'"></i>\ | |
| 33 | <span class="tree-label"></span>\ | |
| 34 | </span>\ | |
| 35 | </div>\ | |
| 36 | <ul class="tree-branch-children" role="group"></ul>\ | |
| 37 | <div class="tree-loader" role="alert">'+$options['loadingHTML']+'</div>\ | |
| 38 | </li>\ | |
| 39 | <li class="tree-item hide" data-template="treeitem" role="treeitem">\ | |
| 40 | <span class="tree-item-name">\ | |
| 41 | '+($options['unselected-icon'] == null ? '' : '<i class="icon-item '+$options['unselected-icon']+'"></i>')+'\ | |
| 42 | <span class="tree-label"></span>\ | |
| 43 | </span>\ | |
| 44 | </li>'); | |
| 45 | ||
| 46 | $this.addClass($options['selectable'] == true ? 'tree-selectable' : 'tree-unselectable'); | |
| 47 | ||
| 48 | $this.tree($options); | |
| 49 | }); | |
| 50 | ||
| 51 | return this; | |
| 52 | } | |
| 53 | ||
| 54 | })(window.jQuery); | |
