docs/default.css
[roojs1] / 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 {Number} bullets show the panel pointer.. default 0
15  * @cfg {Boolena} autoslide (true|false) auto slide .. default false
16  * @cfg {Number} timer auto slide timer .. default 0 millisecond
17  * 
18  * @constructor
19  * Create a new TabGroup
20  * @param {Object} config The config object
21  */
22
23 </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">){
24     </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">);
25     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.navId</span><span class="jsdoc-syntax">) {
26         </span><span class="jsdoc-var">this.navId </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
27     }
28     </span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">= [];
29     </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">);
30     
31 };
32
33 </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">,  {
34     
35     </span><span class="jsdoc-var">carousel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
36     </span><span class="jsdoc-var">transition </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
37     </span><span class="jsdoc-var">bullets </span><span class="jsdoc-syntax">: 0,
38     </span><span class="jsdoc-var">timer </span><span class="jsdoc-syntax">: 0,
39     </span><span class="jsdoc-var">autoslide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
40     </span><span class="jsdoc-var">slideFn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
41     
42     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
43     {
44         </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">));
45         
46         </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' tab-content'</span><span class="jsdoc-syntax">;
47         
48         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.carousel</span><span class="jsdoc-syntax">) {
49             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' carousel slide'</span><span class="jsdoc-syntax">;
50             
51             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [{
52                </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'carousel-inner'
53             </span><span class="jsdoc-syntax">}];
54         
55             </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){
56                 
57                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bullets </span><span class="jsdoc-syntax">= {
58                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'carousel-bullets'</span><span class="jsdoc-syntax">,
59                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: []
60                 };
61                 
62                 </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.bullets</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
63                     </span><span class="jsdoc-var">bullets.cn.push</span><span class="jsdoc-syntax">({
64                         </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
65                     </span><span class="jsdoc-syntax">});
66                 }
67                 
68                 </span><span class="jsdoc-var">bullets.cn.push</span><span class="jsdoc-syntax">({
69                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'clear'
70                 </span><span class="jsdoc-syntax">});
71                 
72                 </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">;
73             }
74         }
75         
76         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
77     },
78     
79     </span><span class="jsdoc-var">initEvents</span><span class="jsdoc-syntax">:  </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
80     {
81         </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">);
82         
83         </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">;
84         
85         </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){
86             
87             </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= 0; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.bullets</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
88                 </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">();
89                 
90                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">bullet</span><span class="jsdoc-syntax">){
91                     </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
92                 }
93                 
94                 </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">){
95                     
96                     </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
97                     
98                     </span><span class="jsdoc-var">_this.showPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ii</span><span class="jsdoc-syntax">);
99                     
100                 })</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">));
101                 
102             }
103         }
104         
105         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoslide</span><span class="jsdoc-syntax">){
106             </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">() {
107                 </span><span class="jsdoc-var">_this.showPanelNext</span><span class="jsdoc-syntax">();
108             }, </span><span class="jsdoc-var">this.timer</span><span class="jsdoc-syntax">);
109         }
110     },
111     
112     </span><span class="jsdoc-var">getChildContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
113     {
114         </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">;
115     },
116     
117     </span><span class="jsdoc-comment">/**
118     * register a Navigation item
119     * @param {Roo.bootstrap.NavItem} the navitem to add
120     */
121     </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">)
122     {
123         </span><span class="jsdoc-var">this.tabs.push</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">item</span><span class="jsdoc-syntax">);
124         </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..
125     
126     </span><span class="jsdoc-syntax">},
127     
128     </span><span class="jsdoc-var">getActivePanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
129     {
130         </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">;
131         </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">) {
132             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t.active</span><span class="jsdoc-syntax">) {
133                 </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">;
134                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
135             }
136             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
137         });
138         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">;
139         
140     },
141     </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">)
142     {
143         </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">;
144         </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">) {
145             </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">) {
146                 </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">;
147                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
148             }
149             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
150         });
151         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">;
152     },
153     </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">)
154     {
155         </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">;
156         </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">) {
157             </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">) {
158                 </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">;
159                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
160             }
161             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
162         });
163         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">;
164     },
165     </span><span class="jsdoc-comment">/**
166      * show a specific panel
167      * @param {Roo.bootstrap.TabPanel|number|string} panel to change to (use the tabId to specify a specific one)
168      * @return {boolean} false if panel was not shown (invalid entry or beforedeactivate fails.)
169      */
170     </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">)
171     {
172         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.transition</span><span class="jsdoc-syntax">){
173             </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">);
174             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
175         }
176         
177         </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">) {
178             </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">];
179         }
180         </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">) {
181             </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">);
182         }
183         </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">) {
184             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
185         }
186         </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">();
187         
188         </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">)) {
189             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
190         }
191         
192         </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){
193             </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">));
194         }
195         
196         </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">) {
197             
198             </span><span class="jsdoc-var">this.transition </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
199             </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">;
200             </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">;
201             </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
202             </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?
203             </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
204             </span><span class="jsdoc-var">pan.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">lr</span><span class="jsdoc-syntax">);
205             
206             </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">;
207             </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">() {
208                 </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">);
209                 
210                 </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">]);
211                 </span><span class="jsdoc-var">pan.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
212                 
213                 </span><span class="jsdoc-var">cur.el.removeClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">lr</span><span class="jsdoc-syntax">]);
214                 </span><span class="jsdoc-var">cur.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
215                 
216                 </span><span class="jsdoc-var">_this.transition </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
217                 
218             }, </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">} );
219             
220             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
221         }
222         
223         </span><span class="jsdoc-var">cur.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
224         </span><span class="jsdoc-var">pan.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
225         
226         </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
227         
228     },
229     </span><span class="jsdoc-var">showPanelNext </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
230     {
231         </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">());
232         
233         </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">) {
234             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
235         }
236         
237         </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">) {
238             </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= -1;
239         }
240         
241         </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]);
242     },
243     
244     </span><span class="jsdoc-var">showPanelPrev </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
245     {
246         </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">());
247         
248         </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">) {
249             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
250         }
251         
252         </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">) {
253             </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tabs.length</span><span class="jsdoc-syntax">;
254         }
255         
256         </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]);
257     },
258     
259     </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">)
260     {
261         </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">){
262             </span><span class="jsdoc-var">el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'selected'</span><span class="jsdoc-syntax">);
263         });
264
265         </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">();
266         
267         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">bullet</span><span class="jsdoc-syntax">){
268             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
269         }
270         
271         </span><span class="jsdoc-var">bullet.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'selected'</span><span class="jsdoc-syntax">);
272     }
273     
274     
275   
276 });
277
278  
279
280  
281  
282 </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">, {
283     
284     </span><span class="jsdoc-var">groups</span><span class="jsdoc-syntax">: {},
285      </span><span class="jsdoc-comment">/**
286     * register a Navigation Group
287     * @param {Roo.bootstrap.NavGroup} the navgroup to add
288     */
289     </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">)
290     {
291         </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">;
292         
293     },
294     </span><span class="jsdoc-comment">/**
295     * fetch a Navigation Group based on the navigation ID
296     * if one does not exist , it will get created.
297     * @param {string} the navgroup to add
298     * @returns {Roo.bootstrap.NavGroup} the navgroup 
299     */
300     </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">) {
301         </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">) {
302             </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">}));
303         }
304         </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">] ;
305     }
306     
307     
308     
309 });
310
311  </span></code></body></html>