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

   1 /*
   2  * - LGPL
   3  *
   4  * TabBox
   5  *
   6  */
   7 Roo.bootstrap.dash = Roo.bootstrap.dash || {};
   8
   9 /**
  10  * @class Roo.bootstrap.dash.TabBox
  11  * @extends Roo.bootstrap.Component
  12  * Bootstrap TabBox class
  13  *
  14  * @constructor
  15  * Create a new TabBox
  16  * @param {Object} config The config object
  17  */
  18
  19
  20 Roo.bootstrap.dash.TabBox = function(config){
  21     Roo.bootstrap.dash.TabBox.superclass.constructor.call(this, config);
  22
  23     this.addEvents({
  24         // img events
  25         /**
  26          * @event click
  27          * The img click event for the img.
  28          * @param {Roo.EventObject} e
  29          */
  30         "click" : true
  31     });
  32 };
  33
  34 Roo.extend(Roo.bootstrap.dash.TabBox, Roo.bootstrap.Component,  {
  35
  36     getAutoCreate : function(){
  37
  38         var cfg = {
  39             tag: 'div',
  40             cls: 'nav-tabs-custom',
  41             cn: [
  42                 {
  43                     tag: 'ul',
  44                     cls: 'nav nav-tabs pull-right',
  45                     cn: [{
  46                         tag: 'li',
  47                         cls: 'active',
  48                         html: null,
  49                         cn : [{
  50                             tag: 'a',
  51                             href: '#',
  52                             // data-toggle: 'tab',
  53                             html: this.tab1_text ? this.tab1_text : 'tab1'
  54                         }]
  55                 },
  56                 {
  57                     tag: 'li',
  58                     cls: '',
  59                     html: null,
  60                     cn : [{
  61                         tag: 'a',
  62                         href: '#',
  63                         // data-toggle: 'tab',
  64                         html: this.tab2_text ? this.tab2_text : 'tab2'
  65                     }]
  66                 },
  67                 {
  68                     tag: 'li',
  69                     cls: 'pull-left header',
  70                     html: this.title ? this.title : 'Title',
  71                     cn : [{
  72                         tag: 'i',
  73                         cls: 'fa fa-inbox'
  74                     }]
  75                 }]
  76             }]
  77         }
  78
  79         return  cfg;
  80     },
  81
  82     initEvents: function() {
  83
  84         // if(!this.href){
  85         //     this.el.on('click', this.onClick, this);
  86         // }
  87         var _this = this;
  88         Roo.each(_this.el.select('li',true).elements, function(el){
  89             Roo.log(el);
  90             el.on('click', _this.onClick, el);
  91         })
  92     },
  93
  94     onClick : function(e)
  95     {
  96         Roo.log('img onclick');
  97
  98         this.findParent('ul',false, true).select('li.active').removeClass('active');
  99         this.addClass('active');
 100         Roo.log(this);
 101             //this.el.select('li.active',true).first().removeClass('active');
 102
 103            // Roo.get(e.target).findParent('li',false, true).addClass('active');
 104
 105         //this.fireEvent('toggle', this, e);
 106
 107     }
 108
 109 });
 110
 111