Roo/bootstrap/NavSidebarItem.js
[roojs1] / Roo / bootstrap / NavSidebarItem.js
1 /*
2  * - LGPL
3  *
4  * sidebar item
5  *
6  *  li
7  *    <span> icon </span>
8  *    <span> text </span>
9  *    <span>badge </span>
10  */
11
12 /**
13  * @class Roo.bootstrap.NavSidebarItem
14  * @extends Roo.bootstrap.Component
15  * Bootstrap Navbar.NavSidebarItem class
16  * @constructor
17  * Create a new Navbar Button
18  * @param {Object} config The config object
19  */
20 Roo.bootstrap.NavSidebarItem = function(config){
21     Roo.bootstrap.NavSidebarItem.superclass.constructor.call(this, config);
22     this.addEvents({
23         // raw events
24         /**
25          * @event click
26          * The raw click event for the entire grid.
27          * @param {Roo.EventObject} e
28          */
29         "click" : true,
30          /**
31             * @event changed
32             * Fires when the active item active state changes
33             * @param {Roo.bootstrap.Navbar.Item} this
34             * @param {boolean} state the new state
35              
36          */
37         'changed': true
38     });
39    
40 };
41
42 Roo.extend(Roo.bootstrap.NavSidebarItem, Roo.bootstrap.NavItem,  {
43     
44     
45     getAutoCreate : function(){
46         
47         var cfg = {
48             tag: 'li',
49             cls: '',
50             cn: [
51                 {
52                 tag: 'a',
53                 href : '#'
54                 cls: '',
55                 html : ''
56                 }
57             ]
58         }
59         
60         if (this.html) {
61             cfg.cn[0].html = this.html;
62         }
63         
64         if (this.active) {
65             this.cls += ' active';
66         }
67         
68         
69         
70         if (this.href) {
71             cfg.cn[0].tag = 'a',
72             cfg.cn[0].href = this.href;
73         }
74         
75         if (this.badge !== '') {
76             cfg.cn[0].html += ' <span class="badge">' + this.badge + '</span>';
77         }
78         
79         if (this.menu) {
80             cfg.cn[0].cls += ' dropdown-toggle treeview';
81             cfg.cn[0].html += '<span class="glyphicon glyphicon-chevron-down"></span>';
82         }
83         
84         // fixme - this should handle glyphicon or ico
85         if (this.glyphicon || this.icon) {
86             var c = this.glyphicon  ? ('glyphicon glyphicon-'+this.glyphicon)  : this.icon;
87             cfg.cn[0].html = '<i class="' +c+'"></i><span>' + cfg.cn[0].html  + '</span>'
88         }
89         
90         
91         return cfg;
92          
93            
94     }
95    
96      
97  
98 });
99  
100
101