projects / roojs1 / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Fix #5654 - roojspacker - get it working as a doc tool...
[roojs1] / docs.old / symbols / src / Roo_bootstrap_layout_Region.js.html
diff --git a/docs.old/symbols/src/Roo_bootstrap_layout_Region.js.html b/docs.old/symbols/src/Roo_bootstrap_layout_Region.js.html
new file mode 100644 (file)
index 0000000..f7522c6
--- /dev/null
+++ b/docs.old/symbols/src/Roo_bootstrap_layout_Region.js.html
@@ -0,0 +1,735 @@
+<html><head><title>../roojs1/Roo/bootstrap/layout/Region.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">/*
+ * Based on:
+ * Ext JS Library 1.1.1
+ * Copyright(c) 2006-2007, Ext JS, LLC.
+ *
+ * Originally Released Under LGPL - original licence link has changed is not relivant.
+ *
+ * Fork - LGPL
+ * &lt;script type=&quot;text/javascript&quot;&gt;
+ */
+ 
+/**
+ * @class Roo.bootstrap.layout.Region
+ * @extends Roo.bootstrap.layout.Basic
+ * This class represents a region in a layout manager.
+ 
+ * @cfg {Object}    margins         Margins for the element (defaults to {top: 0, left: 0, right:0, bottom: 0})
+ * @cfg {Object}    cmargins        Margins for the element when collapsed (defaults to: north/south {top: 2, left: 0, right:0, bottom: 2} or east/west {top: 0, left: 2, right:2, bottom: 0})
+ * @cfg {String}    tabPosition     (top|bottom) &quot;top&quot; or &quot;bottom&quot; (defaults to &quot;bottom&quot;)
+ * @cfg {Boolean}   alwaysShowTabs  True to always display tabs even when there is only 1 panel (defaults to false)
+ * @cfg {Boolean}   autoScroll      True to enable overflow scrolling (defaults to false)
+ * @cfg {Boolean}   titlebar        True to display a title bar (defaults to true)
+ * @cfg {String}    title           The title for the region (overrides panel titles)
+ * @cfg {Boolean}   animate         True to animate expand/collapse (defaults to false)
+ * @cfg {Boolean}   autoHide        False to disable auto hiding when the mouse leaves the &quot;floated&quot; region (defaults to true)
+ * @cfg {Boolean}   preservePanels  True to preserve removed panels so they can be readded later (defaults to false)
+ * @cfg {Boolean}   closeOnTab      True to place the close icon on the tabs instead of the region titlebar (defaults to false)
+ * @cfg {Boolean}   hideTabs        True to hide the tab strip (defaults to false)
+ * @cfg {Boolean}   resizeTabs      True to enable automatic tab resizing. This will resize the tabs so they are all the same size and fit within
+ *                      the space available, similar to FireFox 1.5 tabs (defaults to false)
+ * @cfg {Number}    minTabWidth     The minimum tab width (defaults to 40)
+ * @cfg {Number}    preferredTabWidth The preferred tab width (defaults to 150)
+ * @cfg {String}    overflow       (hidden|visible) if you have menus in the region, then you need to set this to visible.
+
+ * @cfg {Boolean}   hidden          True to start the region hidden (defaults to false)
+ * @cfg {Boolean}   hideWhenEmpty   True to hide the region when it has no panels
+ * @cfg {Boolean}   disableTabTips  True to disable tab tooltips
+ * @cfg {Number}    width           For East/West panels
+ * @cfg {Number}    height          For North/South panels
+ * @cfg {Boolean}   split           To show the splitter
+ * @cfg {Boolean}   toolbar         xtype configuration for a toolbar - shows on right of tabbar
+ * 
+ * @cfg {string}   cls             Extra CSS classes to add to region
+ * 
+ * @cfg {Roo.bootstrap.layout.Manager}   mgr The manager
+ * @cfg {string}   region  the region that it inhabits..
+ *
+
+ * @xxxcfg {Boolean}   collapsible     DISABLED False to disable collapsing (defaults to true)
+ * @xxxcfg {Boolean}   collapsed       DISABLED True to set the initial display to collapsed (defaults to false)
+
+ * @xxxcfg {String}    collapsedTitle  DISABLED Optional string message to display in the collapsed block of a north or south region
+ * @xxxxcfg {Boolean}   floatable       DISABLED False to disable floating (defaults to true)
+ * @xxxxcfg {Boolean}   showPin         True to show a pin button NOT SUPPORTED YET
+ */
+</span><span class="jsdoc-var">Roo.bootstrap.layout.Region </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">)
+{
+    </span><span class="jsdoc-var">this.applyConfig</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
+
+    </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mgr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.mgr</span><span class="jsdoc-syntax">;
+    </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pos </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config.region</span><span class="jsdoc-syntax">;
+    </span><span class="jsdoc-var">config.skipConfig </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
+    </span><span class="jsdoc-var">Roo.bootstrap.layout.Region.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">);
+    
+    </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mgr.el</span><span class="jsdoc-syntax">) {
+        </span><span class="jsdoc-var">this.onRender</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mgr.el</span><span class="jsdoc-syntax">);   
+    }
+     
+    </span><span class="jsdoc-var">this.visible </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
+    </span><span class="jsdoc-var">this.collapsed </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
+    </span><span class="jsdoc-var">this.unrendered_panels </span><span class="jsdoc-syntax">= [];
+};
+
+</span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.layout.Region</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.layout.Basic</span><span class="jsdoc-syntax">, {
+
+    </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// set by wrapper (eg. north/south etc..)
+    </span><span class="jsdoc-var">unrendered_panels </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-comment">// unrendered panels.
+    </span><span class="jsdoc-var">createBody </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-comment">/** This region's body element 
+        * @type Roo.Element */
+        </span><span class="jsdoc-var">this.bodyEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.createChild</span><span class="jsdoc-syntax">({
+                </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;roo-layout-panel-body tab-content&quot; </span><span class="jsdoc-comment">// bootstrap added...
+        </span><span class="jsdoc-syntax">});
+    },
+
+    </span><span class="jsdoc-var">onRender</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ctr</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">)
+    {
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dh </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-comment">/** This region's container element 
+        * @type Roo.Element */
+        </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dh.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ctr.dom</span><span class="jsdoc-syntax">, {
+                </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.config.cls </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-string">&quot; roo-layout-region roo-layout-panel roo-layout-panel-&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.position
+            </span><span class="jsdoc-syntax">}, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-comment">/** This region's title element 
+        * @type Roo.Element */
+    
+        </span><span class="jsdoc-var">this.titleEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dh.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">,
+            {
+                    </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
+                    </span><span class="jsdoc-var">unselectable</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;on&quot;</span><span class="jsdoc-syntax">,
+                    </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;roo-unselectable roo-layout-panel-hd breadcrumb roo-layout-title-&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.position</span><span class="jsdoc-syntax">,
+                    </span><span class="jsdoc-var">children</span><span class="jsdoc-syntax">:[
+                        {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;span&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;roo-unselectable roo-layout-panel-hd-text&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">unselectable</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;on&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&amp;#160;&quot;</span><span class="jsdoc-syntax">},
+                        {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;roo-unselectable roo-layout-panel-hd-tools&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">unselectable</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;on&quot;</span><span class="jsdoc-syntax">}
+                    ]}, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
+        
+        </span><span class="jsdoc-var">this.titleEl.enableDisplayMode</span><span class="jsdoc-syntax">();
+        </span><span class="jsdoc-comment">/** This region's title text element 
+        * @type HTMLElement */
+        </span><span class="jsdoc-var">this.titleTextEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.titleEl.dom.firstChild</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">this.tools </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.titleEl.dom.childNodes</span><span class="jsdoc-syntax">[1], </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-comment">/*
+        this.closeBtn = this.createTool(this.tools.dom, &quot;roo-layout-close&quot;);
+        this.closeBtn.enableDisplayMode();
+        this.closeBtn.on(&quot;click&quot;, this.closeClicked, this);
+        this.closeBtn.hide();
+    */
+        </span><span class="jsdoc-var">this.createBody</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.hideWhenEmpty</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
+            </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;paneladded&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.validateVisibility</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;panelremoved&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.validateVisibility</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoScroll</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.bodyEl.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;auto&quot;</span><span class="jsdoc-syntax">);
+        }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+            </span><span class="jsdoc-var">this.bodyEl.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.config.overflow </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-comment">//if(c.titlebar !== false){
+            </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((!</span><span class="jsdoc-var">this.config.titlebar </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.config.title</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">this.config.titlebar </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
+                </span><span class="jsdoc-var">this.titleEl.hide</span><span class="jsdoc-syntax">();
+            }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+                </span><span class="jsdoc-var">this.titleEl.show</span><span class="jsdoc-syntax">();
+                </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.title</span><span class="jsdoc-syntax">){
+                    </span><span class="jsdoc-var">this.titleTextEl.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.title</span><span class="jsdoc-syntax">;
+                }
+            }
+        </span><span class="jsdoc-comment">//}
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.collapsed</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.collapse</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.hidden</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
+        }
+        
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.unrendered_panels </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.unrendered_panels.length</span><span class="jsdoc-syntax">) {
+            </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.unrendered_panels.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
+                </span><span class="jsdoc-var">this.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.unrendered_panels</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
+            }
+            </span><span class="jsdoc-var">this.unrendered_panels </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
+            
+        }
+        
+    },
+    
+    </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">c</span><span class="jsdoc-syntax">)
+    {
+        </span><span class="jsdoc-comment">/*
+         *if(c.collapsible &amp;&amp; this.position != &quot;center&quot; &amp;&amp; !this.collapsedEl){
+            var dh = Roo.DomHelper;
+            if(c.titlebar !== false){
+                this.collapseBtn = this.createTool(this.tools.dom, &quot;roo-layout-collapse-&quot;+this.position);
+                this.collapseBtn.on(&quot;click&quot;, this.collapse, this);
+                this.collapseBtn.enableDisplayMode();
+                /*
+                if(c.showPin === true || this.showPin){
+                    this.stickBtn = this.createTool(this.tools.dom, &quot;roo-layout-stick&quot;);
+                    this.stickBtn.enableDisplayMode();
+                    this.stickBtn.on(&quot;click&quot;, this.expand, this);
+                    this.stickBtn.hide();
+                }
+                
+            }
+            */
+            /** This region's collapsed element
+            * @type Roo.Element */
+            /*
+             *
+            this.collapsedEl = dh.append(this.mgr.el.dom, {cls: &quot;x-layout-collapsed x-layout-collapsed-&quot;+this.position, children:[
+                {cls: &quot;x-layout-collapsed-tools&quot;, children:[{cls: &quot;x-layout-ctools-inner&quot;}]}
+            ]}, true);
+            
+            if(c.floatable !== false){
+               this.collapsedEl.addClassOnOver(&quot;x-layout-collapsed-over&quot;);
+               this.collapsedEl.on(&quot;click&quot;, this.collapseClick, this);
+            }
+
+            if(c.collapsedTitle &amp;&amp; (this.position == &quot;north&quot; || this.position== &quot;south&quot;)) {
+                this.collapsedTitleTextEl = dh.append(this.collapsedEl.dom, {tag: &quot;div&quot;, cls: &quot;x-unselectable x-layout-panel-hd-text&quot;,
+                   id: &quot;message&quot;, unselectable: &quot;on&quot;, style:{&quot;float&quot;:&quot;left&quot;}});
+               this.collapsedTitleTextEl.innerHTML = c.collapsedTitle;
+             }
+            this.expandBtn = this.createTool(this.collapsedEl.dom.firstChild.firstChild, &quot;x-layout-expand-&quot;+this.position);
+            this.expandBtn.on(&quot;click&quot;, this.expand, this);
+            
+        }
+        
+        if(this.collapseBtn){
+            this.collapseBtn.setVisible(c.collapsible == true);
+        }
+        
+        this.cmargins = c.cmargins || this.cmargins ||
+                         (this.position == &quot;west&quot; || this.position == &quot;east&quot; ?
+                             {top: 0, left: 2, right:2, bottom: 0} :
+                             {top: 2, left: 0, right:0, bottom: 2});
+        */
+        </span><span class="jsdoc-var">this.margins </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">c.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};
+        
+        
+        </span><span class="jsdoc-var">this.bottomTabs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">c.tabPosition </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">;
+        
+        </span><span class="jsdoc-var">this.autoScroll </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">c.autoScroll </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
+        
+        
+       
+        
+        </span><span class="jsdoc-var">this.duration </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">c.duration </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">.</span><span class="jsdoc-syntax">30;
+        </span><span class="jsdoc-var">this.slideDuration </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">c.slideDuration </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">.</span><span class="jsdoc-syntax">45;
+        </span><span class="jsdoc-var">this.config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">;
+       
+    },
+    </span><span class="jsdoc-comment">/**
+     * Returns true if this region is currently visible.
+     * @return {Boolean}
+     */
+    </span><span class="jsdoc-var">isVisible </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.visible</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Updates the title for collapsed north/south regions (used with {@link #collapsedTitle} config option)
+     * @param {String} title (optional) The title text (accepts HTML markup, defaults to the numeric character reference for a non-breaking space, &quot;&amp;amp;#160;&quot;)
+     */
+    //setCollapsedTitle : function(title){
+    //    title = title || &quot;&amp;#160;&quot;;
+     //   if(this.collapsedTitleTextEl){
+      //      this.collapsedTitleTextEl.innerHTML = title;
+       // }
+    //},
+
+    </span><span class="jsdoc-var">getBox </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">;
+      </span><span class="jsdoc-comment">//  if(!this.collapsed){
+            </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.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-comment">// }else{
+          //  b = this.collapsedEl.getBox(false, true);
+        //}
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-var">getMargins </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.margins</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-comment">//return this.collapsed ? this.cmargins : this.margins;
+    </span><span class="jsdoc-syntax">},
+</span><span class="jsdoc-comment">/*
+    highlight : function(){
+        this.el.addClass(&quot;x-layout-panel-dragover&quot;);
+    },
+
+    unhighlight : function(){
+        this.el.removeClass(&quot;x-layout-panel-dragover&quot;);
+    },
+*/
+    </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">)
+    {
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.bodyEl</span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// not rendered yet..
+        </span><span class="jsdoc-syntax">}
+        
+        </span><span class="jsdoc-var">this.box </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.collapsed</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.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">;
+            </span><span class="jsdoc-var">this.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">;
+            </span><span class="jsdoc-var">this.updateBody</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">);
+        }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+            </span><span class="jsdoc-var">this.collapsedEl.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">;
+            </span><span class="jsdoc-var">this.collapsedEl.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">;
+            </span><span class="jsdoc-var">this.collapsedEl.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">);
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.tabs.autoSizeTabs</span><span class="jsdoc-syntax">();
+        }
+    },
+
+    </span><span class="jsdoc-var">updateBody </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">)
+    {
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">-= </span><span class="jsdoc-var">this.el.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;rl&quot;</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.adjustments</span><span class="jsdoc-syntax">){
+                </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.config.adjustments</span><span class="jsdoc-syntax">[0];
+            }
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">null </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">&gt; 0){
+            </span><span class="jsdoc-var">this.el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.titleEl </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.titleEl.isDisplayed</span><span class="jsdoc-syntax">() ? </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">- (</span><span class="jsdoc-var">this.titleEl.getHeight</span><span class="jsdoc-syntax">()||0) : </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">-= </span><span class="jsdoc-var">this.el.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.adjustments</span><span class="jsdoc-syntax">){
+                </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.config.adjustments</span><span class="jsdoc-syntax">[1];
+            }
+            </span><span class="jsdoc-var">this.bodyEl.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
+                </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tabs.syncHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
+            }
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panelSize</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">null </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.panelSize.width</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">null </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.panelSize.height</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel</span><span class="jsdoc-syntax">){
+            </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">();
+            </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">null </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">el.getWidth</span><span class="jsdoc-syntax">();
+            </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">null </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">el.getHeight</span><span class="jsdoc-syntax">();
+            </span><span class="jsdoc-var">this.panelSize </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">};
+            </span><span class="jsdoc-var">this.activePanel.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.tabs.el.repaint</span><span class="jsdoc-syntax">();
+        }
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Returns the container element for this region.
+     * @return {Roo.Element}
+     */
+    </span><span class="jsdoc-var">getEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Hides this region.
+     */
+    </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-comment">//if(!this.collapsed){
+            </span><span class="jsdoc-var">this.el.dom.style.left </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;-2000px&quot;</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-var">this.el.hide</span><span class="jsdoc-syntax">();
+        </span><span class="jsdoc-comment">//}else{
+         //   this.collapsedEl.dom.style.left = &quot;-2000px&quot;;
+         //   this.collapsedEl.hide();
+       // }
+        </span><span class="jsdoc-var">this.visible </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;visibilitychange&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Shows this region if it was previously hidden.
+     */
+    </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-comment">//if(!this.collapsed){
+            </span><span class="jsdoc-var">this.el.show</span><span class="jsdoc-syntax">();
+        </span><span class="jsdoc-comment">//}else{
+        //    this.collapsedEl.show();
+       // }
+        </span><span class="jsdoc-var">this.visible </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;visibilitychange&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
+    },
+</span><span class="jsdoc-comment">/*
+    closeClicked : function(){
+        if(this.activePanel){
+            this.remove(this.activePanel);
+        }
+    },
+
+    collapseClick : function(e){
+        if(this.isSlid){
+           e.stopPropagation();
+           this.slideIn();
+        }else{
+           e.stopPropagation();
+           this.slideOut();
+        }
+    },
+*/
+    /**
+     * Collapses this region.
+     * @param {Boolean} skipAnim (optional) true to collapse the element without animation (if animate is true)
+     */
+    /*
+    collapse : function(skipAnim, skipCheck = false){
+        if(this.collapsed) {
+            return;
+        }
+        
+        if(skipCheck || this.fireEvent(&quot;beforecollapse&quot;, this) != false){
+            
+            this.collapsed = true;
+            if(this.split){
+                this.split.el.hide();
+            }
+            if(this.config.animate &amp;&amp; skipAnim !== true){
+                this.fireEvent(&quot;invalidated&quot;, this);
+                this.animateCollapse();
+            }else{
+                this.el.setLocation(-20000,-20000);
+                this.el.hide();
+                this.collapsedEl.show();
+                this.fireEvent(&quot;collapsed&quot;, this);
+                this.fireEvent(&quot;invalidated&quot;, this);
+            }
+        }
+        
+    },
+*/
+    </span><span class="jsdoc-var">animateCollapse </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-comment">// overridden
+    </span><span class="jsdoc-syntax">},
+
+    </span><span class="jsdoc-comment">/**
+     * Expands this region if it was previously collapsed.
+     * @param {Roo.EventObject} e The event that triggered the expand (or null if calling manually)
+     * @param {Boolean} skipAnim (optional) true to expand the element without animation (if animate is true)
+     */
+    /*
+    expand : function(e, skipAnim){
+        if(e) {
+            e.stopPropagation();
+        }
+        if(!this.collapsed || this.el.hasActiveFx()) {
+            return;
+        }
+        if(this.isSlid){
+            this.afterSlideIn();
+            skipAnim = true;
+        }
+        this.collapsed = false;
+        if(this.config.animate &amp;&amp; skipAnim !== true){
+            this.animateExpand();
+        }else{
+            this.el.show();
+            if(this.split){
+                this.split.el.show();
+            }
+            this.collapsedEl.setLocation(-2000,-2000);
+            this.collapsedEl.hide();
+            this.fireEvent(&quot;invalidated&quot;, this);
+            this.fireEvent(&quot;expanded&quot;, this);
+        }
+    },
+*/
+    </span><span class="jsdoc-var">animateExpand </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-comment">// overridden
+    </span><span class="jsdoc-syntax">},
+
+    </span><span class="jsdoc-var">initTabs </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
+    {
+        </span><span class="jsdoc-comment">//this.bodyEl.setStyle(&quot;overflow&quot;, &quot;hidden&quot;); -- this is set in render?
+        
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ts </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.bootstrap.panel.Tabs</span><span class="jsdoc-syntax">({
+                </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.bodyEl.dom</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">tabPosition</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.bottomTabs </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'bottom' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">disableTooltips</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.config.disableTabTips</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">toolbar </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.config.toolbar
+            </span><span class="jsdoc-syntax">});
+        
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.hideTabs</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">ts.stripWrap.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ts</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">ts.resizeTabs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.resizeTabs </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">ts.minTabWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.minTabWidth </span><span class="jsdoc-syntax">|| 40;
+        </span><span class="jsdoc-var">ts.maxTabWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.maxTabWidth </span><span class="jsdoc-syntax">|| 250;
+        </span><span class="jsdoc-var">ts.preferredTabWidth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.config.preferredTabWidth </span><span class="jsdoc-syntax">|| 150;
+        </span><span class="jsdoc-var">ts.monitorResize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-comment">//ts.bodyEl.setStyle(&quot;overflow&quot;, this.config.autoScroll ? &quot;auto&quot; : &quot;hidden&quot;); // this is set in render?
+        </span><span class="jsdoc-var">ts.bodyEl.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'roo-layout-tabs-body'</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-var">this.panels.each</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.initPanelAsTab</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+    },
+
+    </span><span class="jsdoc-var">initPanelAsTab </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-keyword">var </span><span class="jsdoc-var">ti </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tabs.addTab</span><span class="jsdoc-syntax">(
+            </span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">,
+            </span><span class="jsdoc-var">panel.getTitle</span><span class="jsdoc-syntax">(),
+            </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
+            </span><span class="jsdoc-var">this.config.closeOnTab </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">panel.isClosable</span><span class="jsdoc-syntax">(),
+            </span><span class="jsdoc-var">panel.tpl
+        </span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.tabTip </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">ti.setTooltip</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.tabTip</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-var">ti.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;activate&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+              </span><span class="jsdoc-var">this.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
+        }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+        
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.closeOnTab</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">ti.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;beforeclose&quot;</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">e</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">;
+                </span><span class="jsdoc-var">this.remove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
+            }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+        }
+        
+        </span><span class="jsdoc-var">panel.tabItem </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ti</span><span class="jsdoc-syntax">;
+        
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">ti</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-var">updatePanelTitle </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">title</span><span class="jsdoc-syntax">)
+    {
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.updateTitle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ti </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tabs.getTab</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">ti.setText</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.tabTip </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
+                </span><span class="jsdoc-var">ti.setTooltip</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.tabTip</span><span class="jsdoc-syntax">);
+            }
+        }
+    },
+
+    </span><span class="jsdoc-var">updateTitle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">){
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.titleTextEl </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.config.title</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.titleTextEl.innerHTML </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;undefined&quot; </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">title.length </span><span class="jsdoc-syntax">&gt; 0 ? </span><span class="jsdoc-var">title </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&amp;#160;&quot;</span><span class="jsdoc-syntax">);
+        }
+    },
+
+    </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">)
+    {
+        </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">);
+        </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">){
+            </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel.setActiveState</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
+                </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
+            }
+        }
+        </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
+        </span><span class="jsdoc-var">panel.setActiveState</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panelSize</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">panel.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panelSize.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.panelSize.height</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.closeBtn</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.closeBtn.setVisible</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.config.closeOnTab </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.isSlid </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">panel.isClosable</span><span class="jsdoc-syntax">());
+        }
+        </span><span class="jsdoc-var">this.updateTitle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getTitle</span><span class="jsdoc-syntax">());
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
+            </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">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+        }
+        </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">);
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Shows the specified panel.
+     * @param {Number/String/ContentPanel} panelId The panel's index, id or the panel itself
+     * @return {Roo.ContentPanel} The shown panel, or null if a panel could not be found from panelId
+     */
+    </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">)
+    {
+        </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">);
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
+                </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tab </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tabs.getTab</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">);
+                </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tab.isHidden</span><span class="jsdoc-syntax">()){
+                    </span><span class="jsdoc-var">this.tabs.unhideTab</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tab.id</span><span class="jsdoc-syntax">);
+                }
+                </span><span class="jsdoc-var">tab.activate</span><span class="jsdoc-syntax">();
+            }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+                </span><span class="jsdoc-var">this.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
+            }
+        }
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Get the active panel for this region.
+     * @return {Roo.ContentPanel} The active panel or null
+     */
+    </span><span class="jsdoc-var">getActivePanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.activePanel</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-var">validateVisibility </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panels.getCount</span><span class="jsdoc-syntax">() &lt; 1){
+            </span><span class="jsdoc-var">this.updateTitle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;&amp;#160;&quot;</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">this.closeBtn.hide</span><span class="jsdoc-syntax">();
+            </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
+        }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+            </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isVisible</span><span class="jsdoc-syntax">()){
+                </span><span class="jsdoc-var">this.show</span><span class="jsdoc-syntax">();
+            }
+        }
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Adds the passed ContentPanel(s) to this region.
+     * @param {ContentPanel...} panel The ContentPanel(s) to add (you can pass more than one)
+     * @return {Roo.ContentPanel} The panel added (if only one was added; null otherwise)
+     */
+    </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">)
+    {
+        </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){
+            </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">++) {
+                </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">]);
+            }
+            </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
+        }
+        
+        </span><span class="jsdoc-comment">// if we have not been rendered yet, then we can not really do much of this..
+        </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.bodyEl</span><span class="jsdoc-syntax">) {
+            </span><span class="jsdoc-var">this.unrendered_panels.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
+        }
+        
+        
+        
+        
+        </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">)){
+            </span><span class="jsdoc-var">this.showPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-var">panel.setRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-var">this.panels.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
+       </span><span class="jsdoc-comment">/* if(this.panels.getCount() == 1 &amp;&amp; !this.config.alwaysShowTabs){
+            // sinle panel - no tab...?? would it not be better to render it with the tabs,
+            // and hide them... ???
+            this.bodyEl.dom.appendChild(panel.getEl().dom);
+            if(panel.background !== true){
+                this.setActivePanel(panel);
+            }
+            this.fireEvent(&quot;paneladded&quot;, this, panel);
+            return panel;
+        }
+        */
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.initTabs</span><span class="jsdoc-syntax">();
+        }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
+            </span><span class="jsdoc-var">this.initPanelAsTab</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
+        }
+        
+        
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.background </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.tabs.activate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">);
+        }
+        </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">);
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Hides the tab for the specified panel.
+     * @param {Number/String/ContentPanel} panel The panel's index, id or the panel itself
+     */
+    </span><span class="jsdoc-var">hidePanel </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-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">&amp;&amp; (</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">))){
+            </span><span class="jsdoc-var">this.tabs.hideTab</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">);
+        }
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Unhides the tab for a previously hidden panel.
+     * @param {Number/String/ContentPanel} panel The panel's index, id or the panel itself
+     */
+    </span><span class="jsdoc-var">unhidePanel </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-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">&amp;&amp; (</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">))){
+            </span><span class="jsdoc-var">this.tabs.unhideTab</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">);
+        }
+    },
+
+    </span><span class="jsdoc-var">clearPanels </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panels.getCount</span><span class="jsdoc-syntax">() &gt; 0){
+             </span><span class="jsdoc-var">this.remove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panels.first</span><span class="jsdoc-syntax">());
+        }
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Removes the specified panel. If preservePanel is not true (either here or in the config), the panel is destroyed.
+     * @param {Number/String/ContentPanel} panel The panel's index, id or the panel itself
+     * @param {Boolean} preservePanel Overrides the config preservePanel option
+     * @return {Roo.ContentPanel} The panel that was removed
+     */
+    </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">)
+    {
+        </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">);
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">e </span><span class="jsdoc-syntax">= {};
+        </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">);
+        </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">){
+            </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-var">preservePanel </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">preservePanel </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;undefined&quot; </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">preservePanel </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.config.preservePanels </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">panel.preserve </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">));
+        </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">();
+        </span><span class="jsdoc-var">this.panels.removeKey</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panelId</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">preservePanel</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">document.body.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.tabs.removeTab</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">);
+        }</span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">preservePanel</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.bodyEl.dom.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panels.getCount</span><span class="jsdoc-syntax">() == 1 &amp;&amp; </span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.config.alwaysShowTabs</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.panels.first</span><span class="jsdoc-syntax">();
+            </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tempEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// temp holder to keep IE from deleting the node
+            </span><span class="jsdoc-var">tempEl.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">this.bodyEl.update</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">this.bodyEl.dom.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">tempEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-var">this.updateTitle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p.getTitle</span><span class="jsdoc-syntax">());
+            </span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
+            </span><span class="jsdoc-var">this.bodyEl.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.config.autoScroll </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">&quot;auto&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;hidden&quot;</span><span class="jsdoc-syntax">);
+            </span><span class="jsdoc-var">this.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">);
+        }
+        </span><span class="jsdoc-var">panel.setRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
+        }
+        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.autoDestroy </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">preservePanel </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
+            </span><span class="jsdoc-keyword">try</span><span class="jsdoc-syntax">{</span><span class="jsdoc-var">panel.destroy</span><span class="jsdoc-syntax">();}</span><span class="jsdoc-keyword">catch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){}
+        }
+        </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;panelremoved&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-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-comment">/**
+     * Returns the TabPanel component used by this region
+     * @return {Roo.TabPanel}
+     */
+    </span><span class="jsdoc-var">getTabs </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">;
+    },
+
+    </span><span class="jsdoc-var">createTool </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parentEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">){
+        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">btn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parentEl</span><span class="jsdoc-syntax">, {
+            </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
+            </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;x-layout-tools-button&quot;</span><span class="jsdoc-syntax">,
+            </span><span class="jsdoc-var">children</span><span class="jsdoc-syntax">: [ {
+                </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;roo-layout-tools-button-inner &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">,
+                </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&amp;#160;&quot;
+            </span><span class="jsdoc-syntax">}]
+        }, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-var">btn.addClassOnOver</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;roo-layout-tools-button-over&quot;</span><span class="jsdoc-syntax">);
+        </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">;
+    }
+});</span></code></body></html>
\ No newline at end of file
RooJS - Version 1