Fix #5681 - fix bootstrap4 detection
[roojs1] / docs / src / Roo_bootstrap_layout_Basic.js.html
1 <html><head><title>Roo/bootstrap/layout/Basic.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  * Based on:
3  * Ext JS Library 1.1.1
4  * Copyright(c) 2006-2007, Ext JS, LLC.
5  *
6  * Originally Released Under LGPL - original licence link has changed is not relivant.
7  *
8  * Fork - LGPL
9  * &lt;script type=&quot;text/javascript&quot;&gt;
10  */
11
12 /**
13  * @class Roo.bootstrap.layout.Basic
14  * @extends Roo.util.Observable
15  * This class represents a lightweight region in a layout manager. This region does not move dom nodes
16  * and does not have a titlebar, tabs or any other features. All it does is size and position 
17  * panels. To create a BasicLayoutRegion, add lightweight:true or basic:true to your regions config.
18  * @cfg {Roo.bootstrap.layout.Manager}   mgr The manager
19  * @cfg {string}   region  the region that it inhabits..
20  * @cfg {bool}   skipConfig skip config?
21  * 
22
23  */
24 </span><span class="jsdoc-var">Roo.bootstrap.layout.Basic </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
26     </span><span class="jsdoc-var">this.mgr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.mgr</span><span class="jsdoc-syntax">;
27
28     </span><span class="jsdoc-var">this.position </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.region</span><span class="jsdoc-syntax">;
29
30     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">skipConfig </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.skipConfig</span><span class="jsdoc-syntax">;
31
32     </span><span class="jsdoc-var">this.events </span><span class="jsdoc-syntax">= {
33         </span><span class="jsdoc-comment">/**
34          * @scope Roo.BasicLayoutRegion
35          */
36
37         /**
38          * @event beforeremove
39          * Fires before a panel is removed (or closed). To cancel the removal set &quot;e.cancel = true&quot; on the event argument.
40          * @param {Roo.LayoutRegion} this
41          * @param {Roo.ContentPanel} panel The panel
42          * @param {Object} e The cancel event object
43          */
44         </span><span class="jsdoc-string">&quot;beforeremove&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
45         </span><span class="jsdoc-comment">/**
46          * @event invalidated
47          * Fires when the layout for this region is changed.
48          * @param {Roo.LayoutRegion} this
49          */
50         </span><span class="jsdoc-string">&quot;invalidated&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
51         </span><span class="jsdoc-comment">/**
52          * @event visibilitychange
53          * Fires when this region is shown or hidden 
54          * @param {Roo.LayoutRegion} this
55          * @param {Boolean} visibility true or false
56          */
57         </span><span class="jsdoc-string">&quot;visibilitychange&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
58         </span><span class="jsdoc-comment">/**
59          * @event paneladded
60          * Fires when a panel is added. 
61          * @param {Roo.LayoutRegion} this
62          * @param {Roo.ContentPanel} panel The panel
63          */
64         </span><span class="jsdoc-string">&quot;paneladded&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
65         </span><span class="jsdoc-comment">/**
66          * @event panelremoved
67          * Fires when a panel is removed. 
68          * @param {Roo.LayoutRegion} this
69          * @param {Roo.ContentPanel} panel The panel
70          */
71         </span><span class="jsdoc-string">&quot;panelremoved&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
72         </span><span class="jsdoc-comment">/**
73          * @event beforecollapse
74          * Fires when this region before collapse.
75          * @param {Roo.LayoutRegion} this
76          */
77         </span><span class="jsdoc-string">&quot;beforecollapse&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
78         </span><span class="jsdoc-comment">/**
79          * @event collapsed
80          * Fires when this region is collapsed.
81          * @param {Roo.LayoutRegion} this
82          */
83         </span><span class="jsdoc-string">&quot;collapsed&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
84         </span><span class="jsdoc-comment">/**
85          * @event expanded
86          * Fires when this region is expanded.
87          * @param {Roo.LayoutRegion} this
88          */
89         </span><span class="jsdoc-string">&quot;expanded&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
90         </span><span class="jsdoc-comment">/**
91          * @event slideshow
92          * Fires when this region is slid into view.
93          * @param {Roo.LayoutRegion} this
94          */
95         </span><span class="jsdoc-string">&quot;slideshow&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
96         </span><span class="jsdoc-comment">/**
97          * @event slidehide
98          * Fires when this region slides out of view. 
99          * @param {Roo.LayoutRegion} this
100          */
101         </span><span class="jsdoc-string">&quot;slidehide&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
102         </span><span class="jsdoc-comment">/**
103          * @event panelactivated
104          * Fires when a panel is activated. 
105          * @param {Roo.LayoutRegion} this
106          * @param {Roo.ContentPanel} panel The activated panel
107          */
108         </span><span class="jsdoc-string">&quot;panelactivated&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
109         </span><span class="jsdoc-comment">/**
110          * @event resized
111          * Fires when the user resizes this region. 
112          * @param {Roo.LayoutRegion} this
113          * @param {Number} newSize The new size (width for east/west, height for north/south)
114          */
115         </span><span class="jsdoc-string">&quot;resized&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
116     </span><span class="jsdoc-syntax">};
117     </span><span class="jsdoc-comment">/** A collection of panels in this region. @type Roo.util.MixedCollection */
118     </span><span class="jsdoc-var">this.panels </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.MixedCollection</span><span class="jsdoc-syntax">();
119     </span><span class="jsdoc-var">this.panels.getKey </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getPanelId.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
120     </span><span class="jsdoc-var">this.box </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
121     </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
122     </span><span class="jsdoc-comment">// ensure listeners are added...
123
124     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config.listeners </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">config.events</span><span class="jsdoc-syntax">) {
125         </span><span class="jsdoc-var">Roo.bootstrap.layout.Basic.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, {
126             </span><span class="jsdoc-var">listeners </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">config.listeners </span><span class="jsdoc-syntax">|| {},
127             </span><span class="jsdoc-var">events </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">config.events </span><span class="jsdoc-syntax">|| {}
128         });
129     }
130
131     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">skipConfig </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
132         </span><span class="jsdoc-var">this.applyConfig</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
133     }
134 };
135
136 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.layout.Basic</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.util.Observable</span><span class="jsdoc-syntax">,
137 {
138     </span><span class="jsdoc-var">getPanelId </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">){
139         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">p.getId</span><span class="jsdoc-syntax">();
140     },
141
142     </span><span class="jsdoc-var">applyConfig </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">){
143         </span><span class="jsdoc-var">this.margins </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.margins </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.margins </span><span class="jsdoc-syntax">|| {</span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">: 0, </span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">: 0, </span><span class="jsdoc-var">right</span><span class="jsdoc-syntax">:0, </span><span class="jsdoc-var">bottom</span><span class="jsdoc-syntax">: 0};
144         </span><span class="jsdoc-var">this.config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">;
145
146     },
147
148     </span><span class="jsdoc-comment">/**
149      * Resizes the region to the specified size. For vertical regions (west, east) this adjusts 
150      * the width, for horizontal (north, south) the height.
151      * @param {Number} newSize The new width or height
152      */
153     </span><span class="jsdoc-var">resizeTo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">){
154         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">:
155                  (</span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.activePanel.getEl</span><span class="jsdoc-syntax">() : </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
156         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
157             </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">){
158                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;east&quot;</span><span class="jsdoc-syntax">:
159                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;west&quot;</span><span class="jsdoc-syntax">:
160                     </span><span class="jsdoc-var">el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">);
161                     </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;resized&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">);
162                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
163                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;north&quot;</span><span class="jsdoc-syntax">:
164                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;south&quot;</span><span class="jsdoc-syntax">:
165                     </span><span class="jsdoc-var">el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">);
166                     </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;resized&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newSize</span><span class="jsdoc-syntax">);
167                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
168             }
169         }
170     },
171
172     </span><span class="jsdoc-var">getBox </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
173         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.activePanel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getBox</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
174     },
175
176     </span><span class="jsdoc-var">getMargins </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
177         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.margins</span><span class="jsdoc-syntax">;
178     },
179
180     </span><span class="jsdoc-var">updateBox </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">){
181         </span><span class="jsdoc-var">this.box </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">;
182         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.activePanel.getEl</span><span class="jsdoc-syntax">();
183         </span><span class="jsdoc-var">el.dom.style.left </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">box.x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot;px&quot;</span><span class="jsdoc-syntax">;
184         </span><span class="jsdoc-var">el.dom.style.top </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">box.y </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot;px&quot;</span><span class="jsdoc-syntax">;
185         </span><span class="jsdoc-var">this.activePanel.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box.height</span><span class="jsdoc-syntax">);
186     },
187
188     </span><span class="jsdoc-comment">/**
189      * Returns the container element for this region.
190      * @return {Roo.Element}
191      */
192     </span><span class="jsdoc-var">getEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
193         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.activePanel</span><span class="jsdoc-syntax">;
194     },
195
196     </span><span class="jsdoc-comment">/**
197      * Returns true if this region is currently visible.
198      * @return {Boolean}
199      */
200     </span><span class="jsdoc-var">isVisible </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
201         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
202     },
203
204     </span><span class="jsdoc-var">setActivePanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
205         </span><span class="jsdoc-var">panel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
206         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
207             </span><span class="jsdoc-var">this.activePanel.setActiveState</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
208             </span><span class="jsdoc-var">this.activePanel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.setLeftTop</span><span class="jsdoc-syntax">(-10000,-10000);
209         }
210         </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
211         </span><span class="jsdoc-var">panel.setActiveState</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
212         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.box</span><span class="jsdoc-syntax">){
213             </span><span class="jsdoc-var">panel.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.box.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.box.height</span><span class="jsdoc-syntax">);
214         }
215         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;panelactivated&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
216         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;invalidated&quot;</span><span class="jsdoc-syntax">);
217     },
218
219     </span><span class="jsdoc-comment">/**
220      * Show the specified panel.
221      * @param {Number/String/ContentPanel} panelId The panels index, id or the panel itself
222      * @return {Roo.ContentPanel} The shown panel or null
223      */
224     </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">panel</span><span class="jsdoc-syntax">){
225         </span><span class="jsdoc-var">panel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
226         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
227             </span><span class="jsdoc-var">this.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
228         }
229         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
230     },
231
232     </span><span class="jsdoc-comment">/**
233      * Get the active panel for this region.
234      * @return {Roo.ContentPanel} The active panel or null
235      */
236     </span><span class="jsdoc-var">getActivePanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
237         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.activePanel</span><span class="jsdoc-syntax">;
238     },
239
240     </span><span class="jsdoc-comment">/**
241      * Add the passed ContentPanel(s)
242      * @param {ContentPanel...} panel The ContentPanel(s) to add (you can pass more than one)
243      * @return {Roo.ContentPanel} The panel added (if only one was added)
244      */
245     </span><span class="jsdoc-var">add </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
246         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments.length </span><span class="jsdoc-syntax">&gt; 1){
247             </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">len </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">arguments.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">len</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
248                 </span><span class="jsdoc-var">this.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
249             }
250             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
251         }
252         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hasPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">)){
253             </span><span class="jsdoc-var">this.showPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
254             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
255         }
256         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">();
257         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.dom.parentNode </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">this.mgr.el.dom</span><span class="jsdoc-syntax">){
258             </span><span class="jsdoc-var">this.mgr.el.dom.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.dom</span><span class="jsdoc-syntax">);
259         }
260         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.setRegion</span><span class="jsdoc-syntax">){
261             </span><span class="jsdoc-var">panel.setRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
262         }
263         </span><span class="jsdoc-var">this.panels.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
264         </span><span class="jsdoc-var">el.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;position&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;absolute&quot;</span><span class="jsdoc-syntax">);
265         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">panel.background</span><span class="jsdoc-syntax">){
266             </span><span class="jsdoc-var">this.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
267             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.initialSize </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.panels.getCount</span><span class="jsdoc-syntax">()==1){
268                 </span><span class="jsdoc-var">this.resizeTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.initialSize</span><span class="jsdoc-syntax">);
269             }
270         }
271         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;paneladded&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
272         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
273     },
274
275     </span><span class="jsdoc-comment">/**
276      * Returns true if the panel is in this region.
277      * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
278      * @return {Boolean}
279      */
280     </span><span class="jsdoc-var">hasPanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
281         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">panel </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;object&quot;</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// must be panel obj
282             </span><span class="jsdoc-var">panel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">panel.getId</span><span class="jsdoc-syntax">();
283         }
284         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
285     },
286
287     </span><span class="jsdoc-comment">/**
288      * Removes the specified panel. If preservePanel is not true (either here or in the config), the panel is destroyed.
289      * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
290      * @param {Boolean} preservePanel Overrides the config preservePanel option
291      * @return {Roo.ContentPanel} The panel that was removed
292      */
293     </span><span class="jsdoc-var">remove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">preservePanel</span><span class="jsdoc-syntax">){
294         </span><span class="jsdoc-var">panel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
295         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
296             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
297         }
298         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">e </span><span class="jsdoc-syntax">= {};
299         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;beforeremove&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
300         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.cancel </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
301             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
302         }
303         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">panelId </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">panel.getId</span><span class="jsdoc-syntax">();
304         </span><span class="jsdoc-var">this.panels.removeKey</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panelId</span><span class="jsdoc-syntax">);
305         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
306     },
307
308     </span><span class="jsdoc-comment">/**
309      * Returns the panel specified or null if it's not in this region.
310      * @param {Number/String/ContentPanel} panel The panels index, id or the panel itself
311      * @return {Roo.ContentPanel}
312      */
313     </span><span class="jsdoc-var">getPanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">){
314         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;object&quot;</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// must be panel obj
315             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">;
316         }
317         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.panels.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">);
318     },
319
320     </span><span class="jsdoc-comment">/**
321      * Returns this regions position (north/south/east/west/center).
322      * @return {String} 
323      */
324     </span><span class="jsdoc-var">getPosition</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
325         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">;
326     }
327 });</span></code></body></html>