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

   1 <html><head><title>../roojs1/Roo/bootstrap/Container.js</title><link rel="stylesheet" type="text/css" href="../../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
   2  * - LGPL
   3  *
   4  * page container.
   5  *
   6  */
   7
   8
   9 /**
  10  * @class Roo.bootstrap.Container
  11  * @extends Roo.bootstrap.Component
  12  * Bootstrap Container class
  13  * @cfg {Boolean} jumbotron is it a jumbotron element
  14  * @cfg {String} html content of element
  15  * @cfg {String} well (lg|sm|md) a well, large, small or medium.
  16  * @cfg {String} panel (primary|success|info|warning|danger) render as a panel.
  17  * @cfg {String} header content of header (for panel)
  18  * @cfg {String} footer content of footer (for panel)
  19  * @cfg {String} sticky (footer|wrap|push) block to use as footer or body- needs css-bootstrap/sticky-footer.css
  20  * @cfg {String} tag (header|aside|section) type of HTML tag.
  21  * @cfg {String} alert (success|info|warning|danger) type alert (changes background / border...)
  22  * @cfg {String} fa (ban|check|...) font awesome icon
  23  * @cfg {String} icon (info-sign|check|...) glyphicon name
  24  * @cfg {Boolean} hidden (true|false) hide the element
  25  * @cfg {Boolean} expandable (true|false) default false
  26  * @cfg {String} rheader contet on the right of header
  27
  28  *
  29  * @constructor
  30  * Create a new Container
  31  * @param {Object} config The config object
  32  */
  33
  34 </span><span class="jsdoc-var">Roo.bootstrap.Container </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">){
  35     </span><span class="jsdoc-var">Roo.bootstrap.Container.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">);
  36
  37     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  38         </span><span class="jsdoc-comment">// raw events
  39          /**
  40          * @event expand
  41          * After the panel has been expand
  42          *
  43          * @param {Roo.bootstrap.Container} this
  44          */
  45         </span><span class="jsdoc-string">&quot;expand&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  46         </span><span class="jsdoc-comment">/**
  47          * @event collapse
  48          * After the panel has been collapsed
  49          *
  50          * @param {Roo.bootstrap.Container} this
  51          */
  52         </span><span class="jsdoc-string">&quot;collapse&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
  53     </span><span class="jsdoc-syntax">});
  54 };
  55
  56 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Container</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
  57
  58     </span><span class="jsdoc-var">jumbotron </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  59     </span><span class="jsdoc-var">well</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  60     </span><span class="jsdoc-var">panel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  61     </span><span class="jsdoc-var">header</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  62     </span><span class="jsdoc-var">footer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  63     </span><span class="jsdoc-var">sticky</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  64     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  65     </span><span class="jsdoc-var">alert </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  66     </span><span class="jsdoc-var">fa</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  67     </span><span class="jsdoc-var">icon </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  68     </span><span class="jsdoc-var">expandable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  69     </span><span class="jsdoc-var">rheader </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  70     </span><span class="jsdoc-var">expanded </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  71
  72
  73     </span><span class="jsdoc-var">getChildContainer </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
  74
  75         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
  76             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
  77         }
  78
  79         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panel.length</span><span class="jsdoc-syntax">) {
  80             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.panel-body'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
  81         }
  82
  83         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
  84     },
  85
  86
  87     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  88
  89         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
  90             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.tag </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
  91             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  92             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''
  93         </span><span class="jsdoc-syntax">};
  94         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.jumbotron</span><span class="jsdoc-syntax">) {
  95             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'jumbotron'</span><span class="jsdoc-syntax">;
  96         }
  97
  98
  99
 100         </span><span class="jsdoc-comment">// - this is applied by the parent..
 101         //if (this.cls) {
 102         //    cfg.cls = this.cls + '';
 103         //}
 104
 105         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.sticky.length</span><span class="jsdoc-syntax">) {
 106
 107             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">);
 108             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">bd.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'bootstrap-sticky'</span><span class="jsdoc-syntax">)) {
 109                 </span><span class="jsdoc-var">bd.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'bootstrap-sticky'</span><span class="jsdoc-syntax">);
 110                 </span><span class="jsdoc-var">Roo.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'html'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'height'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'100%'</span><span class="jsdoc-syntax">);
 111             }
 112
 113             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">'bootstrap-sticky-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.sticky</span><span class="jsdoc-syntax">;
 114         }
 115
 116
 117         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.well.length</span><span class="jsdoc-syntax">) {
 118             </span><span class="jsdoc-keyword">switch </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.well</span><span class="jsdoc-syntax">) {
 119                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'lg'</span><span class="jsdoc-syntax">:
 120                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">:
 121                     </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+=</span><span class="jsdoc-string">' well well-' </span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">this.well</span><span class="jsdoc-syntax">;
 122                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 123                 </span><span class="jsdoc-keyword">default</span><span class="jsdoc-syntax">:
 124                     </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+=</span><span class="jsdoc-string">' well'</span><span class="jsdoc-syntax">;
 125                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 126             }
 127         }
 128
 129         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hidden</span><span class="jsdoc-syntax">) {
 130             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' hidden'</span><span class="jsdoc-syntax">;
 131         }
 132
 133
 134         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alert </span><span class="jsdoc-syntax">&amp;&amp; [</span><span class="jsdoc-string">&quot;success&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;info&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;warning&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;danger&quot;</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.alert</span><span class="jsdoc-syntax">) &gt; -1) {
 135             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+=</span><span class="jsdoc-string">' alert alert-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.alert</span><span class="jsdoc-syntax">;
 136         }
 137
 138         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">body </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 139
 140         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.panel.length</span><span class="jsdoc-syntax">) {
 141             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' panel panel-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.panel</span><span class="jsdoc-syntax">;
 142             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [];
 143             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.header.length</span><span class="jsdoc-syntax">) {
 144
 145                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= [];
 146
 147                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.expandable</span><span class="jsdoc-syntax">){
 148
 149                     </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">' expandable'</span><span class="jsdoc-syntax">;
 150
 151                     </span><span class="jsdoc-var">h.push</span><span class="jsdoc-syntax">({
 152                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
 153                         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'fa fa-minus'
 154                     </span><span class="jsdoc-syntax">});
 155                 }
 156
 157                 </span><span class="jsdoc-var">h.push</span><span class="jsdoc-syntax">(
 158                     {
 159                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 160                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'panel-title'</span><span class="jsdoc-syntax">,
 161                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.header
 162                     </span><span class="jsdoc-syntax">},
 163                     {
 164                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 165                         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'panel-header-right'</span><span class="jsdoc-syntax">,
 166                         </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.rheader
 167                     </span><span class="jsdoc-syntax">}
 168                 );
 169
 170                 </span><span class="jsdoc-var">cfg.cn.push</span><span class="jsdoc-syntax">({
 171                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'panel-heading'</span><span class="jsdoc-syntax">,
 172                     </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">h
 173                 </span><span class="jsdoc-syntax">});
 174
 175             }
 176
 177             </span><span class="jsdoc-var">body </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 178             </span><span class="jsdoc-var">cfg.cn.push</span><span class="jsdoc-syntax">({
 179                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'panel-body'</span><span class="jsdoc-syntax">,
 180                 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.html
 181             </span><span class="jsdoc-syntax">});
 182
 183
 184             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.footer.length</span><span class="jsdoc-syntax">) {
 185                 </span><span class="jsdoc-var">cfg.cn.push</span><span class="jsdoc-syntax">({
 186                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'panel-footer'</span><span class="jsdoc-syntax">,
 187                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.footer
 188
 189                 </span><span class="jsdoc-syntax">});
 190             }
 191
 192         }
 193
 194         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">body</span><span class="jsdoc-syntax">) {
 195             </span><span class="jsdoc-var">body.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.html </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">cfg.html</span><span class="jsdoc-syntax">;
 196             </span><span class="jsdoc-comment">// prefix with the icons..
 197             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fa</span><span class="jsdoc-syntax">) {
 198                 </span><span class="jsdoc-var">body.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'&lt;i class=&quot;fa fa-'</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">this.fa </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&quot;&gt;&lt;/i&gt;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">body.html </span><span class="jsdoc-syntax">;
 199             }
 200             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.icon</span><span class="jsdoc-syntax">) {
 201                 </span><span class="jsdoc-var">body.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'&lt;i class=&quot;glyphicon glyphicon-'</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">this.icon </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&quot;&gt;&lt;/i&gt;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">body.html </span><span class="jsdoc-syntax">;
 202             }
 203
 204
 205         }
 206         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">((!</span><span class="jsdoc-var">this.cls </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.cls.length</span><span class="jsdoc-syntax">) &amp;&amp; (!</span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">cfg.cls.length</span><span class="jsdoc-syntax">)) {
 207             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-string">'container'</span><span class="jsdoc-syntax">;
 208         }
 209
 210         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 211     },
 212
 213     </span><span class="jsdoc-var">initEvents</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 214     {
 215         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.expandable</span><span class="jsdoc-syntax">){
 216             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 217         }
 218
 219         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">headerEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.headerEl</span><span class="jsdoc-syntax">();
 220
 221         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">headerEl</span><span class="jsdoc-syntax">){
 222             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 223         }
 224
 225         </span><span class="jsdoc-var">headerEl.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onToggleClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 226
 227     },
 228
 229     </span><span class="jsdoc-var">onToggleClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 230     {
 231         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">headerEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.headerEl</span><span class="jsdoc-syntax">();
 232
 233         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">headerEl</span><span class="jsdoc-syntax">){
 234             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 235         }
 236
 237         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.expanded</span><span class="jsdoc-syntax">){
 238             </span><span class="jsdoc-var">this.collapse</span><span class="jsdoc-syntax">();
 239             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 240         }
 241
 242         </span><span class="jsdoc-var">this.expand</span><span class="jsdoc-syntax">();
 243     },
 244
 245     </span><span class="jsdoc-var">expand </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 246     {
 247         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'expand'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)) {
 248
 249             </span><span class="jsdoc-var">this.expanded </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 250
 251             </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.panel-body'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.show</span><span class="jsdoc-syntax">();
 252
 253             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">toggleEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.toggleEl</span><span class="jsdoc-syntax">();
 254
 255             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">toggleEl</span><span class="jsdoc-syntax">){
 256                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 257             }
 258
 259             </span><span class="jsdoc-var">toggleEl.removeClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'fa-minus'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'fa-plus'</span><span class="jsdoc-syntax">])</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'fa-minus'</span><span class="jsdoc-syntax">]);
 260         }
 261
 262     },
 263
 264     </span><span class="jsdoc-var">collapse </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 265     {
 266         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'collapse'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)) {
 267
 268             </span><span class="jsdoc-var">this.expanded </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 269
 270             </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.panel-body'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Element.DISPLAY</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.hide</span><span class="jsdoc-syntax">();
 271
 272             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">toggleEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.toggleEl</span><span class="jsdoc-syntax">();
 273
 274             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">toggleEl</span><span class="jsdoc-syntax">){
 275                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 276             }
 277
 278             </span><span class="jsdoc-var">toggleEl.removeClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'fa-minus'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'fa-plus'</span><span class="jsdoc-syntax">])</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'fa-plus'</span><span class="jsdoc-syntax">]);
 279         }
 280     },
 281
 282     </span><span class="jsdoc-var">toggleEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 283     {
 284         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.panel.length </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.header.length </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.expandable</span><span class="jsdoc-syntax">){
 285             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 286         }
 287
 288         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.panel-heading .fa'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 289     },
 290
 291     </span><span class="jsdoc-var">headerEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 292     {
 293         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.panel.length </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.header.length</span><span class="jsdoc-syntax">){
 294             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 295         }
 296
 297         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.panel-heading'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">()
 298     },
 299
 300     </span><span class="jsdoc-var">titleEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 301     {
 302         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.panel.length </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.header.length</span><span class="jsdoc-syntax">){
 303             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 304         }
 305
 306         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.panel-title'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 307     },
 308
 309     </span><span class="jsdoc-var">setTitle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">)
 310     {
 311         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">titleEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.titleEl</span><span class="jsdoc-syntax">();
 312
 313         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">titleEl</span><span class="jsdoc-syntax">){
 314             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 315         }
 316
 317         </span><span class="jsdoc-var">titleEl.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 318     },
 319
 320     </span><span class="jsdoc-var">getTitle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 321     {
 322
 323         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">titleEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.titleEl</span><span class="jsdoc-syntax">();
 324
 325         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">titleEl</span><span class="jsdoc-syntax">){
 326             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 327         }
 328
 329         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">titleEl.dom.innerHTML</span><span class="jsdoc-syntax">;
 330     },
 331
 332     </span><span class="jsdoc-var">setRightTitle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">)
 333     {
 334         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.panel-header-right'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 335
 336         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">){
 337             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 338         }
 339
 340         </span><span class="jsdoc-var">t.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 341     }
 342
 343 });
 344
 345  </span></code></body></html>