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         
48         var a = {
49                 tag: 'a',
50                 href : this.href || '#',
51                 cls: '',
52                 html : '',
53                 cn : []
54         };
55         var cfg = {
56             tag: 'li',
57             cls: '',
58             cn: [ a ]
59         }
60         var span = {
61             tag: 'span',
62             html : this.html || ''
63         }
64         
65         
66         if (this.active) {
67             cfg.cls += ' active';
68         }
69         
70         // fixme - this should handle glyphicon or ico
71         if (this.glyphicon || this.icon) {
72             var c = this.glyphicon  ? ('glyphicon glyphicon-'+this.glyphicon)  : this.icon;
73             a.cn.push( { tag : 'i', cls : c });
74         }
75         
76          
77         
78         if (this.badge !== '') {
79             cfg.cn[0].html += ' <span class="badge">' + this.badge + '</span>';
80         }
81         
82         if (this.menu) {
83             cfg.cn[0].cls += ' dropdown-toggle treeview';
84             cfg.cn[0].html += '<span class="glyphicon glyphicon-chevron-down"></span>';
85         }
86         
87         
88         
89         return cfg;
90          
91            
92     }
93    
94      
95  
96 });
97  
98
99