git.roojs.org Git - roojs1/blob - Roo/bootstrap/MenuItem.js

   1 /*
   2  * - LGPL
   3  *
   4  * menu item
   5  *
   6  */
   7
   8
   9 /**
  10  * @class Roo.bootstrap.MenuItem
  11  * @extends Roo.bootstrap.Component
  12  * Bootstrap MenuItem class
  13  * @cfg {String} html the menu label
  14  * @cfg {String} href the link
  15  * @cfg {Boolean} preventDefault do not trigger A href on clicks.
  16  * @cfg {Boolean} isContainer is it a container - just returns a drop down item..
  17  * @cfg {Boolean} active  used on sidebars to highlight active itesm
  18  * @cfg {String} fa favicon to show on left of menu item.
  19  *
  20  *
  21  * @constructor
  22  * Create a new MenuItem
  23  * @param {Object} config The config object
  24  */
  25
  26
  27 Roo.bootstrap.MenuItem = function(config){
  28     Roo.bootstrap.MenuItem.superclass.constructor.call(this, config);
  29     this.addEvents({
  30         // raw events
  31         /**
  32          * @event click
  33          * The raw click event for the entire grid.
  34          * @param {Roo.bootstrap.MenuItem} this
  35          * @param {Roo.EventObject} e
  36          */
  37         "click" : true
  38     });
  39 };
  40
  41 Roo.extend(Roo.bootstrap.MenuItem, Roo.bootstrap.Component,  {
  42
  43     href : false,
  44     html : false,
  45     preventDefault: true,
  46     isContainer : false,
  47     active : false,
  48     fa: false,
  49
  50     getAutoCreate : function(){
  51
  52         if(this.isContainer){
  53             return {
  54                 tag: 'li',
  55                 cls: 'dropdown-menu-item'
  56             };
  57         }
  58         var ctag = {
  59             tag: 'span',
  60             html: 'Link'
  61         };
  62
  63         var anc = {
  64             tag : 'a',
  65             href : '#',
  66             cn : [  ]
  67         };
  68
  69         if (this.fa !== false) {
  70             anc.cn.push({
  71                 tag : 'i',
  72                 cls : 'fa fa-' + this.fa
  73             });
  74         }
  75
  76         anc.cn.push(ctag);
  77
  78
  79         var cfg= {
  80             tag: 'li',
  81             cls: 'dropdown-menu-item',
  82             cn: [ anc ]
  83         };
  84         if (this.parent().type == 'treeview') {
  85             cfg.cls = 'treeview-menu';
  86         }
  87         if (this.active) {
  88             cfg.cls += ' active';
  89         }
  90
  91
  92
  93         anc.href = this.href || cfg.cn[0].href ;
  94         ctag.html = this.html || cfg.cn[0].html ;
  95         return cfg;
  96     },
  97
  98     initEvents: function() {
  99         if (this.parent().type == 'treeview') {
 100             this.el.select('a').on('click', this.onClick, this);
 101         }
 102
 103     },
 104     onClick : function(e)
 105     {
 106         Roo.log('item on click ');
 107         //if(this.preventDefault){
 108         //    e.preventDefault();
 109         //}
 110         //this.parent().hideMenuItems();
 111
 112         this.fireEvent('click', this, e);
 113     },
 114     getEl : function()
 115     {
 116         return this.el;
 117     }
 118 });
 119
 120
 121
 122