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

   1 <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">/*
   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.Region
  14  * @extends Roo.bootstrap.layout.Basic
  15  * This class represents a region in a layout manager.
  16
  17  * @cfg {Object}    margins         Margins for the element (defaults to {top: 0, left: 0, right:0, bottom: 0})
  18  * @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})
  19  * @cfg {String}    tabPosition     (top|bottom) &quot;top&quot; or &quot;bottom&quot; (defaults to &quot;bottom&quot;)
  20  * @cfg {Boolean}   alwaysShowTabs  True to always display tabs even when there is only 1 panel (defaults to false)
  21  * @cfg {Boolean}   autoScroll      True to enable overflow scrolling (defaults to false)
  22  * @cfg {Boolean}   titlebar        True to display a title bar (defaults to true)
  23  * @cfg {String}    title           The title for the region (overrides panel titles)
  24  * @cfg {Boolean}   animate         True to animate expand/collapse (defaults to false)
  25  * @cfg {Boolean}   autoHide        False to disable auto hiding when the mouse leaves the &quot;floated&quot; region (defaults to true)
  26  * @cfg {Boolean}   preservePanels  True to preserve removed panels so they can be readded later (defaults to false)
  27  * @cfg {Boolean}   closeOnTab      True to place the close icon on the tabs instead of the region titlebar (defaults to false)
  28  * @cfg {Boolean}   hideTabs        True to hide the tab strip (defaults to false)
  29  * @cfg {Boolean}   resizeTabs      True to enable automatic tab resizing. This will resize the tabs so they are all the same size and fit within
  30  *                      the space available, similar to FireFox 1.5 tabs (defaults to false)
  31  * @cfg {Number}    minTabWidth     The minimum tab width (defaults to 40)
  32  * @cfg {Number}    preferredTabWidth The preferred tab width (defaults to 150)
  33  * @cfg {String}    overflow       (hidden|visible) if you have menus in the region, then you need to set this to visible.
  34
  35  * @cfg {Boolean}   hidden          True to start the region hidden (defaults to false)
  36  * @cfg {Boolean}   hideWhenEmpty   True to hide the region when it has no panels
  37  * @cfg {Boolean}   disableTabTips  True to disable tab tooltips
  38  * @cfg {Number}    width           For East/West panels
  39  * @cfg {Number}    height          For North/South panels
  40  * @cfg {Boolean}   split           To show the splitter
  41  * @cfg {Boolean}   toolbar         xtype configuration for a toolbar - shows on right of tabbar
  42  *
  43  * @cfg {string}   cls             Extra CSS classes to add to region
  44  *
  45  * @cfg {Roo.bootstrap.layout.Manager}   mgr The manager
  46  * @cfg {string}   region  the region that it inhabits..
  47  *
  48
  49  * @xxxcfg {Boolean}   collapsible     DISABLED False to disable collapsing (defaults to true)
  50  * @xxxcfg {Boolean}   collapsed       DISABLED True to set the initial display to collapsed (defaults to false)
  51
  52  * @xxxcfg {String}    collapsedTitle  DISABLED Optional string message to display in the collapsed block of a north or south region
  53  * @xxxxcfg {Boolean}   floatable       DISABLED False to disable floating (defaults to true)
  54  * @xxxxcfg {Boolean}   showPin         True to show a pin button NOT SUPPORTED YET
  55  */
  56 </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">)
  57 {
  58     </span><span class="jsdoc-var">this.applyConfig</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  59
  60     </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">;
  61     </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">;
  62     </span><span class="jsdoc-var">config.skipConfig </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
  63     </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">);
  64
  65     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mgr.el</span><span class="jsdoc-syntax">) {
  66         </span><span class="jsdoc-var">this.onRender</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mgr.el</span><span class="jsdoc-syntax">);
  67     }
  68
  69     </span><span class="jsdoc-var">this.visible </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
  70     </span><span class="jsdoc-var">this.collapsed </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
  71     </span><span class="jsdoc-var">this.unrendered_panels </span><span class="jsdoc-syntax">= [];
  72 };
  73
  74 </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">, {
  75
  76     </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..)
  77     </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.
  78     </span><span class="jsdoc-var">createBody </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  79         </span><span class="jsdoc-comment">/** This region's body element
  80         * @type Roo.Element */
  81         </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">({
  82                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
  83                 </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...
  84         </span><span class="jsdoc-syntax">});
  85     },
  86
  87     </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">)
  88     {
  89         </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">;
  90         </span><span class="jsdoc-comment">/** This region's container element
  91         * @type Roo.Element */
  92         </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">, {
  93                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
  94                 </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
  95             </span><span class="jsdoc-syntax">}, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
  96         </span><span class="jsdoc-comment">/** This region's title element
  97         * @type Roo.Element */
  98
  99         </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">,
 100             {
 101                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
 102                     </span><span class="jsdoc-var">unselectable</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;on&quot;</span><span class="jsdoc-syntax">,
 103                     </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">,
 104                     </span><span class="jsdoc-var">children</span><span class="jsdoc-syntax">:[
 105                         {</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">},
 106                         {</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">}
 107                     ]}, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 108
 109         </span><span class="jsdoc-var">this.titleEl.enableDisplayMode</span><span class="jsdoc-syntax">();
 110         </span><span class="jsdoc-comment">/** This region's title text element
 111         * @type HTMLElement */
 112         </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">;
 113         </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">);
 114         </span><span class="jsdoc-comment">/*
 115         this.closeBtn = this.createTool(this.tools.dom, &quot;roo-layout-close&quot;);
 116         this.closeBtn.enableDisplayMode();
 117         this.closeBtn.on(&quot;click&quot;, this.closeClicked, this);
 118         this.closeBtn.hide();
 119     */
 120         </span><span class="jsdoc-var">this.createBody</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config</span><span class="jsdoc-syntax">);
 121         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.hideWhenEmpty</span><span class="jsdoc-syntax">){
 122             </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
 123             </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">);
 124             </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">);
 125         }
 126         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoScroll</span><span class="jsdoc-syntax">){
 127             </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">);
 128         }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 129             </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">);
 130         }
 131         </span><span class="jsdoc-comment">//if(c.titlebar !== false){
 132             </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">){
 133                 </span><span class="jsdoc-var">this.titleEl.hide</span><span class="jsdoc-syntax">();
 134             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 135                 </span><span class="jsdoc-var">this.titleEl.show</span><span class="jsdoc-syntax">();
 136                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.title</span><span class="jsdoc-syntax">){
 137                     </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">;
 138                 }
 139             }
 140         </span><span class="jsdoc-comment">//}
 141         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.collapsed</span><span class="jsdoc-syntax">){
 142             </span><span class="jsdoc-var">this.collapse</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 143         }
 144         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.hidden</span><span class="jsdoc-syntax">){
 145             </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
 146         }
 147
 148         </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">) {
 149             </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">++) {
 150                 </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">]);
 151             }
 152             </span><span class="jsdoc-var">this.unrendered_panels </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
 153
 154         }
 155
 156     },
 157
 158     </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">)
 159     {
 160         </span><span class="jsdoc-comment">/*
 161          *if(c.collapsible &amp;&amp; this.position != &quot;center&quot; &amp;&amp; !this.collapsedEl){
 162             var dh = Roo.DomHelper;
 163             if(c.titlebar !== false){
 164                 this.collapseBtn = this.createTool(this.tools.dom, &quot;roo-layout-collapse-&quot;+this.position);
 165                 this.collapseBtn.on(&quot;click&quot;, this.collapse, this);
 166                 this.collapseBtn.enableDisplayMode();
 167                 /*
 168                 if(c.showPin === true || this.showPin){
 169                     this.stickBtn = this.createTool(this.tools.dom, &quot;roo-layout-stick&quot;);
 170                     this.stickBtn.enableDisplayMode();
 171                     this.stickBtn.on(&quot;click&quot;, this.expand, this);
 172                     this.stickBtn.hide();
 173                 }
 174
 175             }
 176             */
 177             /** This region's collapsed element
 178             * @type Roo.Element */
 179             /*
 180              *
 181             this.collapsedEl = dh.append(this.mgr.el.dom, {cls: &quot;x-layout-collapsed x-layout-collapsed-&quot;+this.position, children:[
 182                 {cls: &quot;x-layout-collapsed-tools&quot;, children:[{cls: &quot;x-layout-ctools-inner&quot;}]}
 183             ]}, true);
 184
 185             if(c.floatable !== false){
 186                this.collapsedEl.addClassOnOver(&quot;x-layout-collapsed-over&quot;);
 187                this.collapsedEl.on(&quot;click&quot;, this.collapseClick, this);
 188             }
 189
 190             if(c.collapsedTitle &amp;&amp; (this.position == &quot;north&quot; || this.position== &quot;south&quot;)) {
 191                 this.collapsedTitleTextEl = dh.append(this.collapsedEl.dom, {tag: &quot;div&quot;, cls: &quot;x-unselectable x-layout-panel-hd-text&quot;,
 192                    id: &quot;message&quot;, unselectable: &quot;on&quot;, style:{&quot;float&quot;:&quot;left&quot;}});
 193                this.collapsedTitleTextEl.innerHTML = c.collapsedTitle;
 194              }
 195             this.expandBtn = this.createTool(this.collapsedEl.dom.firstChild.firstChild, &quot;x-layout-expand-&quot;+this.position);
 196             this.expandBtn.on(&quot;click&quot;, this.expand, this);
 197
 198         }
 199
 200         if(this.collapseBtn){
 201             this.collapseBtn.setVisible(c.collapsible == true);
 202         }
 203
 204         this.cmargins = c.cmargins || this.cmargins ||
 205                          (this.position == &quot;west&quot; || this.position == &quot;east&quot; ?
 206                              {top: 0, left: 2, right:2, bottom: 0} :
 207                              {top: 2, left: 0, right:0, bottom: 2});
 208         */
 209         </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};
 210
 211
 212         </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">;
 213
 214         </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">;
 215
 216
 217
 218
 219         </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;
 220         </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;
 221         </span><span class="jsdoc-var">this.config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">;
 222
 223     },
 224     </span><span class="jsdoc-comment">/**
 225      * Returns true if this region is currently visible.
 226      * @return {Boolean}
 227      */
 228     </span><span class="jsdoc-var">isVisible </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 229         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.visible</span><span class="jsdoc-syntax">;
 230     },
 231
 232     </span><span class="jsdoc-comment">/**
 233      * Updates the title for collapsed north/south regions (used with {@link #collapsedTitle} config option)
 234      * @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;)
 235      */
 236     //setCollapsedTitle : function(title){
 237     //    title = title || &quot;&amp;#160;&quot;;
 238      //   if(this.collapsedTitleTextEl){
 239       //      this.collapsedTitleTextEl.innerHTML = title;
 240        // }
 241     //},
 242
 243     </span><span class="jsdoc-var">getBox </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 244         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">;
 245       </span><span class="jsdoc-comment">//  if(!this.collapsed){
 246             </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">);
 247        </span><span class="jsdoc-comment">// }else{
 248           //  b = this.collapsedEl.getBox(false, true);
 249         //}
 250         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">;
 251     },
 252
 253     </span><span class="jsdoc-var">getMargins </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 254         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.margins</span><span class="jsdoc-syntax">;
 255         </span><span class="jsdoc-comment">//return this.collapsed ? this.cmargins : this.margins;
 256     </span><span class="jsdoc-syntax">},
 257 </span><span class="jsdoc-comment">/*
 258     highlight : function(){
 259         this.el.addClass(&quot;x-layout-panel-dragover&quot;);
 260     },
 261
 262     unhighlight : function(){
 263         this.el.removeClass(&quot;x-layout-panel-dragover&quot;);
 264     },
 265 */
 266     </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">)
 267     {
 268         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.bodyEl</span><span class="jsdoc-syntax">) {
 269             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// not rendered yet..
 270         </span><span class="jsdoc-syntax">}
 271
 272         </span><span class="jsdoc-var">this.box </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">;
 273         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.collapsed</span><span class="jsdoc-syntax">){
 274             </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">;
 275             </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">;
 276             </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">);
 277         }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 278             </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">;
 279             </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">;
 280             </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">);
 281         }
 282         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
 283             </span><span class="jsdoc-var">this.tabs.autoSizeTabs</span><span class="jsdoc-syntax">();
 284         }
 285     },
 286
 287     </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">)
 288     {
 289         </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">){
 290             </span><span class="jsdoc-var">this.el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">);
 291             </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">);
 292             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.adjustments</span><span class="jsdoc-syntax">){
 293                 </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];
 294             }
 295         }
 296         </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){
 297             </span><span class="jsdoc-var">this.el.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
 298             </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">;
 299             </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">);
 300             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.adjustments</span><span class="jsdoc-syntax">){
 301                 </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];
 302             }
 303             </span><span class="jsdoc-var">this.bodyEl.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
 304             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
 305                 </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">);
 306             }
 307         }
 308         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panelSize</span><span class="jsdoc-syntax">){
 309             </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">;
 310             </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">;
 311         }
 312         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.activePanel</span><span class="jsdoc-syntax">){
 313             </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">();
 314             </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">();
 315             </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">();
 316             </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">};
 317             </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">);
 318         }
 319         </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">){
 320             </span><span class="jsdoc-var">this.tabs.el.repaint</span><span class="jsdoc-syntax">();
 321         }
 322     },
 323
 324     </span><span class="jsdoc-comment">/**
 325      * Returns the container element for this region.
 326      * @return {Roo.Element}
 327      */
 328     </span><span class="jsdoc-var">getEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 329         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
 330     },
 331
 332     </span><span class="jsdoc-comment">/**
 333      * Hides this region.
 334      */
 335     </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 336         </span><span class="jsdoc-comment">//if(!this.collapsed){
 337             </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">;
 338             </span><span class="jsdoc-var">this.el.hide</span><span class="jsdoc-syntax">();
 339         </span><span class="jsdoc-comment">//}else{
 340          //   this.collapsedEl.dom.style.left = &quot;-2000px&quot;;
 341          //   this.collapsedEl.hide();
 342        // }
 343         </span><span class="jsdoc-var">this.visible </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 344         </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">);
 345     },
 346
 347     </span><span class="jsdoc-comment">/**
 348      * Shows this region if it was previously hidden.
 349      */
 350     </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 351         </span><span class="jsdoc-comment">//if(!this.collapsed){
 352             </span><span class="jsdoc-var">this.el.show</span><span class="jsdoc-syntax">();
 353         </span><span class="jsdoc-comment">//}else{
 354         //    this.collapsedEl.show();
 355        // }
 356         </span><span class="jsdoc-var">this.visible </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 357         </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">);
 358     },
 359 </span><span class="jsdoc-comment">/*
 360     closeClicked : function(){
 361         if(this.activePanel){
 362             this.remove(this.activePanel);
 363         }
 364     },
 365
 366     collapseClick : function(e){
 367         if(this.isSlid){
 368            e.stopPropagation();
 369            this.slideIn();
 370         }else{
 371            e.stopPropagation();
 372            this.slideOut();
 373         }
 374     },
 375 */
 376     /**
 377      * Collapses this region.
 378      * @param {Boolean} skipAnim (optional) true to collapse the element without animation (if animate is true)
 379      */
 380     /*
 381     collapse : function(skipAnim, skipCheck = false){
 382         if(this.collapsed) {
 383             return;
 384         }
 385
 386         if(skipCheck || this.fireEvent(&quot;beforecollapse&quot;, this) != false){
 387
 388             this.collapsed = true;
 389             if(this.split){
 390                 this.split.el.hide();
 391             }
 392             if(this.config.animate &amp;&amp; skipAnim !== true){
 393                 this.fireEvent(&quot;invalidated&quot;, this);
 394                 this.animateCollapse();
 395             }else{
 396                 this.el.setLocation(-20000,-20000);
 397                 this.el.hide();
 398                 this.collapsedEl.show();
 399                 this.fireEvent(&quot;collapsed&quot;, this);
 400                 this.fireEvent(&quot;invalidated&quot;, this);
 401             }
 402         }
 403
 404     },
 405 */
 406     </span><span class="jsdoc-var">animateCollapse </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 407         </span><span class="jsdoc-comment">// overridden
 408     </span><span class="jsdoc-syntax">},
 409
 410     </span><span class="jsdoc-comment">/**
 411      * Expands this region if it was previously collapsed.
 412      * @param {Roo.EventObject} e The event that triggered the expand (or null if calling manually)
 413      * @param {Boolean} skipAnim (optional) true to expand the element without animation (if animate is true)
 414      */
 415     /*
 416     expand : function(e, skipAnim){
 417         if(e) {
 418             e.stopPropagation();
 419         }
 420         if(!this.collapsed || this.el.hasActiveFx()) {
 421             return;
 422         }
 423         if(this.isSlid){
 424             this.afterSlideIn();
 425             skipAnim = true;
 426         }
 427         this.collapsed = false;
 428         if(this.config.animate &amp;&amp; skipAnim !== true){
 429             this.animateExpand();
 430         }else{
 431             this.el.show();
 432             if(this.split){
 433                 this.split.el.show();
 434             }
 435             this.collapsedEl.setLocation(-2000,-2000);
 436             this.collapsedEl.hide();
 437             this.fireEvent(&quot;invalidated&quot;, this);
 438             this.fireEvent(&quot;expanded&quot;, this);
 439         }
 440     },
 441 */
 442     </span><span class="jsdoc-var">animateExpand </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 443         </span><span class="jsdoc-comment">// overridden
 444     </span><span class="jsdoc-syntax">},
 445
 446     </span><span class="jsdoc-var">initTabs </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 447     {
 448         </span><span class="jsdoc-comment">//this.bodyEl.setStyle(&quot;overflow&quot;, &quot;hidden&quot;); -- this is set in render?
 449
 450         </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">({
 451                 </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.bodyEl.dom</span><span class="jsdoc-syntax">,
 452                 </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">,
 453                 </span><span class="jsdoc-var">disableTooltips</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.config.disableTabTips</span><span class="jsdoc-syntax">,
 454                 </span><span class="jsdoc-var">toolbar </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.config.toolbar
 455             </span><span class="jsdoc-syntax">});
 456
 457         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.hideTabs</span><span class="jsdoc-syntax">){
 458             </span><span class="jsdoc-var">ts.stripWrap.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 459         }
 460         </span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ts</span><span class="jsdoc-syntax">;
 461         </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">;
 462         </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;
 463         </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;
 464         </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;
 465         </span><span class="jsdoc-var">ts.monitorResize </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 466         </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?
 467         </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">);
 468         </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">);
 469     },
 470
 471     </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">){
 472         </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">(
 473             </span><span class="jsdoc-var">panel.getEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.id</span><span class="jsdoc-syntax">,
 474             </span><span class="jsdoc-var">panel.getTitle</span><span class="jsdoc-syntax">(),
 475             </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 476             </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">(),
 477             </span><span class="jsdoc-var">panel.tpl
 478         </span><span class="jsdoc-syntax">);
 479         </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">){
 480             </span><span class="jsdoc-var">ti.setTooltip</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.tabTip</span><span class="jsdoc-syntax">);
 481         }
 482         </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">(){
 483               </span><span class="jsdoc-var">this.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
 484         }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 485
 486         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.config.closeOnTab</span><span class="jsdoc-syntax">){
 487             </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">){
 488                 </span><span class="jsdoc-var">e.cancel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 489                 </span><span class="jsdoc-var">this.remove</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
 490             }, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 491         }
 492
 493         </span><span class="jsdoc-var">panel.tabItem </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ti</span><span class="jsdoc-syntax">;
 494
 495         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">ti</span><span class="jsdoc-syntax">;
 496     },
 497
 498     </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">)
 499     {
 500         </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">){
 501             </span><span class="jsdoc-var">this.updateTitle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">);
 502         }
 503         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
 504             </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">);
 505             </span><span class="jsdoc-var">ti.setText</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">title</span><span class="jsdoc-syntax">);
 506             </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">){
 507                 </span><span class="jsdoc-var">ti.setTooltip</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.tabTip</span><span class="jsdoc-syntax">);
 508             }
 509         }
 510     },
 511
 512     </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">){
 513         </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">){
 514             </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">);
 515         }
 516     },
 517
 518     </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">)
 519     {
 520         </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">);
 521         </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">){
 522             </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">){
 523                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 524             }
 525         }
 526         </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
 527         </span><span class="jsdoc-var">panel.setActiveState</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 528         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panelSize</span><span class="jsdoc-syntax">){
 529             </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">);
 530         }
 531         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.closeBtn</span><span class="jsdoc-syntax">){
 532             </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">());
 533         }
 534         </span><span class="jsdoc-var">this.updateTitle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel.getTitle</span><span class="jsdoc-syntax">());
 535         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
 536             </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">);
 537         }
 538         </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">);
 539     },
 540
 541     </span><span class="jsdoc-comment">/**
 542      * Shows the specified panel.
 543      * @param {Number/String/ContentPanel} panelId The panel's index, id or the panel itself
 544      * @return {Roo.ContentPanel} The shown panel, or null if a panel could not be found from panelId
 545      */
 546     </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">)
 547     {
 548         </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">);
 549         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
 550             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
 551                 </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">);
 552                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tab.isHidden</span><span class="jsdoc-syntax">()){
 553                     </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">);
 554                 }
 555                 </span><span class="jsdoc-var">tab.activate</span><span class="jsdoc-syntax">();
 556             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 557                 </span><span class="jsdoc-var">this.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
 558             }
 559         }
 560         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
 561     },
 562
 563     </span><span class="jsdoc-comment">/**
 564      * Get the active panel for this region.
 565      * @return {Roo.ContentPanel} The active panel or null
 566      */
 567     </span><span class="jsdoc-var">getActivePanel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 568         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.activePanel</span><span class="jsdoc-syntax">;
 569     },
 570
 571     </span><span class="jsdoc-var">validateVisibility </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 572         </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){
 573             </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">);
 574             </span><span class="jsdoc-var">this.closeBtn.hide</span><span class="jsdoc-syntax">();
 575             </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
 576         }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 577             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isVisible</span><span class="jsdoc-syntax">()){
 578                 </span><span class="jsdoc-var">this.show</span><span class="jsdoc-syntax">();
 579             }
 580         }
 581     },
 582
 583     </span><span class="jsdoc-comment">/**
 584      * Adds the passed ContentPanel(s) to this region.
 585      * @param {ContentPanel...} panel The ContentPanel(s) to add (you can pass more than one)
 586      * @return {Roo.ContentPanel} The panel added (if only one was added; null otherwise)
 587      */
 588     </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">)
 589     {
 590         </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){
 591             </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">++) {
 592                 </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">]);
 593             }
 594             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 595         }
 596
 597         </span><span class="jsdoc-comment">// if we have not been rendered yet, then we can not really do much of this..
 598         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.bodyEl</span><span class="jsdoc-syntax">) {
 599             </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">);
 600             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
 601         }
 602
 603
 604
 605
 606         </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">)){
 607             </span><span class="jsdoc-var">this.showPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
 608             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
 609         }
 610         </span><span class="jsdoc-var">panel.setRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 611         </span><span class="jsdoc-var">this.panels.add</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
 612        </span><span class="jsdoc-comment">/* if(this.panels.getCount() == 1 &amp;&amp; !this.config.alwaysShowTabs){
 613             // sinle panel - no tab...?? would it not be better to render it with the tabs,
 614             // and hide them... ???
 615             this.bodyEl.dom.appendChild(panel.getEl().dom);
 616             if(panel.background !== true){
 617                 this.setActivePanel(panel);
 618             }
 619             this.fireEvent(&quot;paneladded&quot;, this, panel);
 620             return panel;
 621         }
 622         */
 623         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
 624             </span><span class="jsdoc-var">this.initTabs</span><span class="jsdoc-syntax">();
 625         }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 626             </span><span class="jsdoc-var">this.initPanelAsTab</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">);
 627         }
 628
 629
 630         </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">){
 631             </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">);
 632         }
 633         </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">);
 634         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
 635     },
 636
 637     </span><span class="jsdoc-comment">/**
 638      * Hides the tab for the specified panel.
 639      * @param {Number/String/ContentPanel} panel The panel's index, id or the panel itself
 640      */
 641     </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">){
 642         </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">))){
 643             </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">);
 644         }
 645     },
 646
 647     </span><span class="jsdoc-comment">/**
 648      * Unhides the tab for a previously hidden panel.
 649      * @param {Number/String/ContentPanel} panel The panel's index, id or the panel itself
 650      */
 651     </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">){
 652         </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">))){
 653             </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">);
 654         }
 655     },
 656
 657     </span><span class="jsdoc-var">clearPanels </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 658         </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){
 659              </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">());
 660         }
 661     },
 662
 663     </span><span class="jsdoc-comment">/**
 664      * Removes the specified panel. If preservePanel is not true (either here or in the config), the panel is destroyed.
 665      * @param {Number/String/ContentPanel} panel The panel's index, id or the panel itself
 666      * @param {Boolean} preservePanel Overrides the config preservePanel option
 667      * @return {Roo.ContentPanel} The panel that was removed
 668      */
 669     </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">)
 670     {
 671         </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">);
 672         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">){
 673             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 674         }
 675         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">e </span><span class="jsdoc-syntax">= {};
 676         </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">);
 677         </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">){
 678             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 679         }
 680         </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">));
 681         </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">();
 682         </span><span class="jsdoc-var">this.panels.removeKey</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">panelId</span><span class="jsdoc-syntax">);
 683         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">preservePanel</span><span class="jsdoc-syntax">){
 684             </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">);
 685         }
 686         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">){
 687             </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">);
 688         }</span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">preservePanel</span><span class="jsdoc-syntax">){
 689             </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">);
 690         }
 691         </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">){
 692             </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">();
 693             </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
 694             </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">);
 695             </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">);
 696             </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">);
 697             </span><span class="jsdoc-var">tempEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
 698             </span><span class="jsdoc-var">this.updateTitle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p.getTitle</span><span class="jsdoc-syntax">());
 699             </span><span class="jsdoc-var">this.tabs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
 700             </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">);
 701             </span><span class="jsdoc-var">this.setActivePanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">);
 702         }
 703         </span><span class="jsdoc-var">panel.setRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
 704         </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">){
 705             </span><span class="jsdoc-var">this.activePanel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
 706         }
 707         </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">){
 708             </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">){}
 709         }
 710         </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">);
 711         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">panel</span><span class="jsdoc-syntax">;
 712     },
 713
 714     </span><span class="jsdoc-comment">/**
 715      * Returns the TabPanel component used by this region
 716      * @return {Roo.TabPanel}
 717      */
 718     </span><span class="jsdoc-var">getTabs </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 719         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.tabs</span><span class="jsdoc-syntax">;
 720     },
 721
 722     </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">){
 723         </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">, {
 724             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
 725             </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">,
 726             </span><span class="jsdoc-var">children</span><span class="jsdoc-syntax">: [ {
 727                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">,
 728                 </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">,
 729                 </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&amp;#160;&quot;
 730             </span><span class="jsdoc-syntax">}]
 731         }, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 732         </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">);
 733         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">btn</span><span class="jsdoc-syntax">;
 734     }
 735 });</span></code></body></html>