git.roojs.org Git - roojs1/blob - docs/symbols/src/Roo_bootstrap_TabGroup.js.html

   1 <html><head><title>../roojs1/Roo/bootstrap/TabGroup.js</title><link rel="stylesheet" type="text/css" href="../../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
   2  * - LGPL
   3  *
   4  * column
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.TabGroup
  10  * @extends Roo.bootstrap.Column
  11  * Bootstrap Column class
  12  * @cfg {String} navId the navigation id (for use with navbars) - will be auto generated if it does not exist..
  13  * @cfg {Boolean} carousel true to make the group behave like a carousel
  14  * @cfg {Boolean} bullets show bullets for the panels
  15  * @cfg {Boolean} autoslide (true|false) auto slide .. default false
  16  * @cfg {Boolean} slideOnTouch (true|false) slide on touch .. default false
  17  * @cfg {Number} timer auto slide timer .. default 0 millisecond
  18  *
  19  * @constructor
  20  * Create a new TabGroup
  21  * @param {Object} config The config object
  22  */
  23
  24 </span><span class="jsdoc-var">Roo.bootstrap.TabGroup </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
  25     </span><span class="jsdoc-var">Roo.bootstrap.TabGroup.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  26     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.navId</span><span class="jsdoc-syntax">) {
  27         </span><span class="jsdoc-var">this.navId </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
  28     }
  29     </span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">= [];
  30     </span><span class="jsdoc-var">Roo.bootstrap.TabGroup.register</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  31
  32 };
  33
  34 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.TabGroup</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Column</span><span class="jsdoc-syntax">,  {
  35
  36     </span><span class="jsdoc-var">carousel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  37     </span><span class="jsdoc-var">transition </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  38     </span><span class="jsdoc-var">bullets </span><span class="jsdoc-syntax">: 0,
  39     </span><span class="jsdoc-var">timer </span><span class="jsdoc-syntax">: 0,
  40     </span><span class="jsdoc-var">autoslide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  41     </span><span class="jsdoc-var">slideFn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  42     </span><span class="jsdoc-var">slideOnTouch </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  43
  44     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
  45     {
  46         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({}, </span><span class="jsdoc-var">Roo.bootstrap.TabGroup.superclass.getAutoCreate.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">));
  47
  48         </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' tab-content'</span><span class="jsdoc-syntax">;
  49
  50         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'get auto create...............'</span><span class="jsdoc-syntax">);
  51
  52         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.carousel</span><span class="jsdoc-syntax">) {
  53             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' carousel slide'</span><span class="jsdoc-syntax">;
  54
  55             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [{
  56                </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'carousel-inner'
  57             </span><span class="jsdoc-syntax">}];
  58
  59             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bullets  </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">Roo.isTouch</span><span class="jsdoc-syntax">){
  60
  61                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bullets </span><span class="jsdoc-syntax">= {
  62                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'carousel-bullets'</span><span class="jsdoc-syntax">,
  63                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: []
  64                 };
  65
  66                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bullets_cls</span><span class="jsdoc-syntax">){
  67                     </span><span class="jsdoc-var">bullets.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bullets.cls </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">' ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.bullets_cls</span><span class="jsdoc-syntax">;
  68                 }
  69                  </span><span class="jsdoc-comment">/*
  70                 for (var i = 0; i &lt; this.bullets; i++){
  71                     bullets.cn.push({
  72                         cls : 'bullet bullet-' + i
  73                     });
  74                 }
  75                 */
  76                 </span><span class="jsdoc-var">bullets.cn.push</span><span class="jsdoc-syntax">({
  77                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'clear'
  78                 </span><span class="jsdoc-syntax">});
  79
  80                 </span><span class="jsdoc-var">cfg.cn</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.cn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bullets</span><span class="jsdoc-syntax">;
  81             }
  82         }
  83
  84         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
  85     },
  86
  87     </span><span class="jsdoc-var">initEvents</span><span class="jsdoc-syntax">:  </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
  88     {
  89         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'-------- init events on tab group ---------'</span><span class="jsdoc-syntax">);
  90
  91
  92
  93         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  94
  95         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.slideOnTouch</span><span class="jsdoc-syntax">){
  96             </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;touchstart&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTouchStart</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
  97         }
  98
  99         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoslide</span><span class="jsdoc-syntax">){
 100             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 101
 102             </span><span class="jsdoc-var">this.slideFn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">window.setInterval</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 103                 </span><span class="jsdoc-var">_this.showPanelNext</span><span class="jsdoc-syntax">();
 104             }, </span><span class="jsdoc-var">this.timer</span><span class="jsdoc-syntax">);
 105         }
 106
 107     },
 108
 109     </span><span class="jsdoc-var">onTouchStart </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">)
 110     {
 111         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.slideOnTouch </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">Roo.isTouch </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">())</span><span class="jsdoc-var">.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'roo-button-text'</span><span class="jsdoc-syntax">)){
 112             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 113         }
 114
 115         </span><span class="jsdoc-var">this.showPanelNext</span><span class="jsdoc-syntax">();
 116     },
 117
 118     </span><span class="jsdoc-var">getChildContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 119     {
 120         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.carousel </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.carousel-inner'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">() : </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
 121     },
 122
 123     </span><span class="jsdoc-comment">/**
 124     * register a Navigation item
 125     * @param {Roo.bootstrap.NavItem} the navitem to add
 126     */
 127     </span><span class="jsdoc-var">register </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">)
 128     {
 129         </span><span class="jsdoc-var">this.tabs.push</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">);
 130         </span><span class="jsdoc-var">item.navId </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.navId</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// not really needed..
 131         </span><span class="jsdoc-var">this.addBullet</span><span class="jsdoc-syntax">();
 132
 133     },
 134
 135     </span><span class="jsdoc-var">getActivePanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 136     {
 137         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 138         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">) {
 139             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.active</span><span class="jsdoc-syntax">) {
 140                 </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">;
 141                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 142             }
 143             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 144         });
 145         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">;
 146
 147     },
 148     </span><span class="jsdoc-var">getPanelByName </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">)
 149     {
 150         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 151         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">) {
 152             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.tabId </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">) {
 153                 </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">;
 154                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 155             }
 156             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 157         });
 158         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">;
 159     },
 160     </span><span class="jsdoc-var">indexOfPanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">)
 161     {
 162         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 163         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">) {
 164             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.tabId </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">p.tabId</span><span class="jsdoc-syntax">) {
 165                 </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">;
 166                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 167             }
 168             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 169         });
 170         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">;
 171     },
 172     </span><span class="jsdoc-comment">/**
 173      * show a specific panel
 174      * @param {Roo.bootstrap.TabPanel|number|string} panel to change to (use the tabId to specify a specific one)
 175      * @return {boolean} false if panel was not shown (invalid entry or beforedeactivate fails.)
 176      */
 177     </span><span class="jsdoc-var">showPanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pan</span><span class="jsdoc-syntax">)
 178     {
 179         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.transition</span><span class="jsdoc-syntax">){
 180             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;waiting for the transitionend&quot;</span><span class="jsdoc-syntax">);
 181             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 182         }
 183
 184         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pan</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'number'</span><span class="jsdoc-syntax">) {
 185             </span><span class="jsdoc-var">pan </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">pan</span><span class="jsdoc-syntax">];
 186         }
 187         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pan</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">) {
 188             </span><span class="jsdoc-var">pan </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getPanelByName</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pan</span><span class="jsdoc-syntax">);
 189         }
 190         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pan.tabId </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">this.getActivePanel</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.tabId</span><span class="jsdoc-syntax">) {
 191             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 192         }
 193         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cur </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getActivePanel</span><span class="jsdoc-syntax">();
 194
 195         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">cur.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'beforedeactivate'</span><span class="jsdoc-syntax">)) {
 196             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 197         }
 198
 199         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.bullets </span><span class="jsdoc-syntax">&gt; 0 &amp;&amp; !</span><span class="jsdoc-var">Roo.isTouch</span><span class="jsdoc-syntax">){
 200             </span><span class="jsdoc-var">this.setActiveBullet</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.indexOfPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pan</span><span class="jsdoc-syntax">));
 201         }
 202
 203         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.carousel </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.dom.style.transition</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
 204
 205             </span><span class="jsdoc-var">this.transition </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 206             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dir </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.indexOfPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pan</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">this.indexOfPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cur</span><span class="jsdoc-syntax">)  ? </span><span class="jsdoc-string">'next' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'prev'</span><span class="jsdoc-syntax">;
 207             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">lr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dir </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'next' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'left' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'right'</span><span class="jsdoc-syntax">;
 208             </span><span class="jsdoc-var">pan.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dir</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// or prev
 209             </span><span class="jsdoc-var">pan.el.dom.offsetWidth</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// find the offset with - causing a reflow?
 210             </span><span class="jsdoc-var">cur.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">lr</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// or right
 211             </span><span class="jsdoc-var">pan.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">lr</span><span class="jsdoc-syntax">);
 212
 213             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 214             </span><span class="jsdoc-var">cur.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'transitionend'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 215                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;trans end?&quot;</span><span class="jsdoc-syntax">);
 216
 217                 </span><span class="jsdoc-var">pan.el.removeClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">lr</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">dir</span><span class="jsdoc-syntax">]);
 218                 </span><span class="jsdoc-var">pan.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 219
 220                 </span><span class="jsdoc-var">cur.el.removeClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">lr</span><span class="jsdoc-syntax">]);
 221                 </span><span class="jsdoc-var">cur.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 222
 223                 </span><span class="jsdoc-var">_this.transition </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 224
 225             }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, { </span><span class="jsdoc-var">single</span><span class="jsdoc-syntax">:  </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">} );
 226
 227             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 228         }
 229
 230         </span><span class="jsdoc-var">cur.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 231         </span><span class="jsdoc-var">pan.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 232
 233         </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 234
 235     },
 236     </span><span class="jsdoc-var">showPanelNext </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 237     {
 238         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.indexOfPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getActivePanel</span><span class="jsdoc-syntax">());
 239
 240         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&gt;= </span><span class="jsdoc-var">this.tabs.length </span><span class="jsdoc-syntax">- 1 &amp;&amp; !</span><span class="jsdoc-var">this.autoslide</span><span class="jsdoc-syntax">) {
 241             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 242         }
 243
 244         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&gt;= </span><span class="jsdoc-var">this.tabs.length </span><span class="jsdoc-syntax">- 1 &amp;&amp; </span><span class="jsdoc-var">this.autoslide</span><span class="jsdoc-syntax">) {
 245             </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= -1;
 246         }
 247
 248         </span><span class="jsdoc-var">this.showPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">+1]);
 249     },
 250
 251     </span><span class="jsdoc-var">showPanelPrev </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 252     {
 253         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.indexOfPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getActivePanel</span><span class="jsdoc-syntax">());
 254
 255         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i  </span><span class="jsdoc-syntax">&lt; 1 &amp;&amp; !</span><span class="jsdoc-var">this.autoslide</span><span class="jsdoc-syntax">) {
 256             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 257         }
 258
 259         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; 1 &amp;&amp; </span><span class="jsdoc-var">this.autoslide</span><span class="jsdoc-syntax">) {
 260             </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tabs.length</span><span class="jsdoc-syntax">;
 261         }
 262
 263         </span><span class="jsdoc-var">this.showPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">-1]);
 264     },
 265
 266
 267     </span><span class="jsdoc-var">addBullet</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 268     {
 269         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.bullets </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">Roo.isTouch</span><span class="jsdoc-syntax">){
 270             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 271         }
 272         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ctr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.carousel-bullets'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 273         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.carousel-bullets .bullet'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.getCount</span><span class="jsdoc-syntax">() ;
 274         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bullet </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ctr.createChild</span><span class="jsdoc-syntax">({
 275             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'bullet bullet-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">i
 276         </span><span class="jsdoc-syntax">},</span><span class="jsdoc-var">ctr.dom.lastChild</span><span class="jsdoc-syntax">);
 277
 278
 279         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">_this </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 280
 281         </span><span class="jsdoc-var">bullet.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, (</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ii</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">){
 282
 283             </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
 284
 285             </span><span class="jsdoc-var">this.showPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ii</span><span class="jsdoc-syntax">);
 286
 287             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoslide </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.slideFn</span><span class="jsdoc-syntax">){
 288                 </span><span class="jsdoc-var">clearInterval</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.slideFn</span><span class="jsdoc-syntax">);
 289                 </span><span class="jsdoc-var">this.slideFn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">window.setInterval</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 290                     </span><span class="jsdoc-var">_this.showPanelNext</span><span class="jsdoc-syntax">();
 291                 }, </span><span class="jsdoc-var">this.timer</span><span class="jsdoc-syntax">);
 292             }
 293
 294         })</span><span class="jsdoc-var">.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, [</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">bullet</span><span class="jsdoc-syntax">], </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
 295
 296
 297     },
 298
 299     </span><span class="jsdoc-var">setActiveBullet </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">)
 300     {
 301         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isTouch</span><span class="jsdoc-syntax">){
 302             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 303         }
 304
 305         </span><span class="jsdoc-var">Roo.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.bullet'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.elements</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
 306             </span><span class="jsdoc-var">el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'selected'</span><span class="jsdoc-syntax">);
 307         });
 308
 309         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bullet </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.bullet-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 310
 311         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">bullet</span><span class="jsdoc-syntax">){
 312             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 313         }
 314
 315         </span><span class="jsdoc-var">bullet.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'selected'</span><span class="jsdoc-syntax">);
 316     }
 317
 318
 319
 320 });
 321
 322
 323
 324
 325
 326 </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.TabGroup</span><span class="jsdoc-syntax">, {
 327
 328     </span><span class="jsdoc-var">groups</span><span class="jsdoc-syntax">: {},
 329      </span><span class="jsdoc-comment">/**
 330     * register a Navigation Group
 331     * @param {Roo.bootstrap.NavGroup} the navgroup to add
 332     */
 333     </span><span class="jsdoc-var">register </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">navgrp</span><span class="jsdoc-syntax">)
 334     {
 335         </span><span class="jsdoc-var">this.groups</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">navgrp.navId</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">navgrp</span><span class="jsdoc-syntax">;
 336
 337     },
 338     </span><span class="jsdoc-comment">/**
 339     * fetch a Navigation Group based on the navigation ID
 340     * if one does not exist , it will get created.
 341     * @param {string} the navgroup to add
 342     * @returns {Roo.bootstrap.NavGroup} the navgroup
 343     */
 344     </span><span class="jsdoc-var">get</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">navId</span><span class="jsdoc-syntax">) {
 345         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.groups</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">navId</span><span class="jsdoc-syntax">]) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
 346             </span><span class="jsdoc-var">this.register</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.TabGroup</span><span class="jsdoc-syntax">({ </span><span class="jsdoc-var">navId </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">navId </span><span class="jsdoc-syntax">}));
 347         }
 348         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.groups</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">navId</span><span class="jsdoc-syntax">] ;
 349     }
 350
 351
 352
 353 });
 354
 355  </span></code></body></html>