Blame view

assets/js/ace/elements.treeview.js 1.55 KB
5a739853   patrick.he   commit
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
  /**
   <b>Treeview</b>. A wrapper for FuelUX treeview element.
   It's just a wrapper so you still need to include FuelUX treeview script first.
  */
  (function($ , undefined) {
  
  	$.fn.aceTree = $.fn.ace_tree = function(options) {
  		var $options = {
  			'open-icon' : ace.vars['icon'] + 'fa fa-folder-open',
  			'close-icon' : ace.vars['icon'] + 'fa fa-folder',
  			'selectable' : true,
  			'selected-icon' : ace.vars['icon'] + 'fa fa-check',
  			'unselected-icon' : ace.vars['icon'] + 'fa fa-times',
  			'loadingHTML': 'Loading...'
  		}
  	
  		$options = $.extend({}, $options, options)
  		this.each(function() {
  			var $this = $(this);
  			$this.addClass('tree').attr('role', 'tree');
  			$this.html(
  			'<li class="tree-branch hide" data-template="treebranch" role="treeitem" aria-expanded="false">\
  				<div class="tree-branch-header">\
  					<span class="tree-branch-name">\
  						<i class="icon-folder '+$options['close-icon']+'"></i>\
  						<span class="tree-label"></span>\
  					</span>\
  				</div>\
  				<ul class="tree-branch-children" role="group"></ul>\
  				<div class="tree-loader" role="alert">'+$options['loadingHTML']+'</div>\
  			</div>\
  			<li class="tree-item hide" data-template="treeitem" role="treeitem">\
  				<span class="tree-item-name">\
  				  '+($options['unselected-icon'] == null ? '' : '<i class="icon-item '+$options['unselected-icon']+'"></i>')+'\
  				  <span class="tree-label"></span>\
  				</span>\
  			</li>');
  			
  			$this.addClass($options['selectable'] == true ? 'tree-selectable' : 'tree-unselectable');
  			
  			$this.tree($options);
  		});
  
  		return this;
  	}
  
  })(window.jQuery);