git.roojs.org Git - roojs1/blob - 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.NavItem
  15  * Bootstrap Navbar.NavSidebarItem class
  16  * {String} badgeWeight (default|primary|success|info|warning|danger)the extra classes for the badge
  17  * {bool} open is the menu open
  18  * @constructor
  19  * Create a new Navbar Button
  20  * @param {Object} config The config object
  21  */
  22 Roo.bootstrap.NavSidebarItem = function(config){
  23     Roo.bootstrap.NavSidebarItem.superclass.constructor.call(this, config);
  24     this.addEvents({
  25         // raw events
  26         /**
  27          * @event click
  28          * The raw click event for the entire grid.
  29          * @param {Roo.EventObject} e
  30          */
  31         "click" : true,
  32          /**
  33             * @event changed
  34             * Fires when the active item active state changes
  35             * @param {Roo.bootstrap.NavSidebarItem} this
  36             * @param {boolean} state the new state
  37
  38          */
  39         'changed': true
  40     });
  41
  42 };
  43
  44 Roo.extend(Roo.bootstrap.NavSidebarItem, Roo.bootstrap.NavItem,  {
  45
  46     badgeWeight : 'default',
  47
  48     open: false,
  49
  50     getAutoCreate : function(){
  51
  52
  53         var a = {
  54                 tag: 'a',
  55                 href : this.href || '#',
  56                 cls: '',
  57                 html : '',
  58                 cn : []
  59         };
  60         var cfg = {
  61             tag: 'li',
  62             cls: '',
  63             cn: [ a ]
  64         };
  65         var span = {
  66             tag: 'span',
  67             html : this.html || ''
  68         };
  69
  70
  71         if (this.active) {
  72             cfg.cls += ' active';
  73         }
  74
  75         if (this.disabled) {
  76             cfg.cls += ' disabled';
  77         }
  78         if (this.open) {
  79             cfg.cls += ' open x-open';
  80         }
  81         // left icon..
  82         if (this.glyphicon || this.icon) {
  83             var c = this.glyphicon  ? ('glyphicon glyphicon-'+this.glyphicon)  : this.icon;
  84             a.cn.push({ tag : 'i', cls : c }) ;
  85         }
  86         // html..
  87         a.cn.push(span);
  88         // then badge..
  89         if (this.badge !== '') {
  90
  91             a.cn.push({ tag: 'span',  cls : 'badge pull-right badge-' + this.badgeWeight, html: this.badge });
  92         }
  93         // fi
  94         if (this.menu) {
  95             a.cn.push({ tag : 'i', cls : 'glyphicon glyphicon-chevron-down pull-right'});
  96             a.cls += 'dropdown-toggle treeview' ;
  97         }
  98
  99         return cfg;
 100
 101
 102     },
 103
 104     initEvents : function()
 105     {
 106         Roo.log('NavSidebarItem initEvents??');
 107
 108         Roo.log(typeof(this.menu));
 109
 110         Roo.log(this.menu);
 111
 112         if(this.menu instanceof Roo.bootstrap.Menu){
 113             Roo.log('test');
 114         }
 115
 116         if (typeof (this.menu) != 'undefined' && !this.menu instanceof Roo.bootstrap.Menu) {
 117             this.menu.parentType = this.xtype;
 118             this.menu.triggerEl = this.el;
 119             this.menu = this.addxtype(Roo.apply({}, this.menu));
 120         }
 121
 122         this.el.on('click', this.onClick, this);
 123
 124         if(this.badge !== ''){
 125
 126             this.badgeEl = this.el.select('.badge', true).first().setVisibilityMode(Roo.Element.DISPLAY);
 127         }
 128
 129     },
 130
 131     onClick : function(e)
 132     {
 133         if(this.disabled){
 134             e.preventDefault();
 135             return;
 136         }
 137
 138         if(this.preventDefault){
 139             e.preventDefault();
 140         }
 141
 142         this.fireEvent('click', this);
 143     },
 144
 145     disable : function()
 146     {
 147         this.setDisabled(true);
 148     },
 149
 150     enable : function()
 151     {
 152         this.setDisabled(false);
 153     },
 154
 155     setDisabled : function(state)
 156     {
 157         if(this.disabled == state){
 158             return;
 159         }
 160
 161         this.disabled = state;
 162
 163         if (state) {
 164             this.el.addClass('disabled');
 165             return;
 166         }
 167
 168         this.el.removeClass('disabled');
 169
 170         return;
 171     },
 172
 173     setActive : function(state)
 174     {
 175         if(this.active == state){
 176             return;
 177         }
 178
 179         this.active = state;
 180
 181         if (state) {
 182             this.el.addClass('active');
 183             return;
 184         }
 185
 186         this.el.removeClass('active');
 187
 188         return;
 189     },
 190
 191     isActive: function ()
 192     {
 193         return this.active;
 194     },
 195
 196     setBadge : function(str)
 197     {
 198         if(!this.badgeEl){
 199             return;
 200         }
 201
 202         this.badgeEl.dom.innerHTML = str;
 203     }
 204
 205
 206
 207
 208 });
 209
 210
 211