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

   1 <html><head><title>Roo/bootstrap/Button.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  * button
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.Button
  10  * @extends Roo.bootstrap.Component
  11  * Bootstrap Button class
  12  * @cfg {String} html The button content
  13  * @cfg {String} weight (default|primary|secondary|success|info|warning|danger|link|light|dark) default
  14  * @cfg {String} badge_weight (default|primary|secondary|success|info|warning|danger|link|light|dark) default (same as button)
  15  * @cfg {Boolean} outline default false (except for weight=default which emulates old behaveiour with an outline)
  16  * @cfg {String} size (lg|sm|xs)
  17  * @cfg {String} tag (a|input|submit)
  18  * @cfg {String} href empty or href
  19  * @cfg {Boolean} disabled default false;
  20  * @cfg {Boolean} isClose default false;
  21  * @cfg {String} glyphicon depricated - use fa
  22  * @cfg {String} fa fontawesome icon - eg. 'comment' - without the fa/fas etc..
  23  * @cfg {String} badge text for badge
  24  * @cfg {String} theme (default|glow)
  25  * @cfg {Boolean} inverse dark themed version
  26  * @cfg {Boolean} toggle is it a slidy toggle button
  27  * @cfg {Boolean} pressed　  default null - if the button ahs active state
  28  * @cfg {String} ontext text for on slidy toggle state
  29  * @cfg {String} offtext text for off slidy toggle state
  30  * @cfg {Boolean} preventDefault  default true (stop click event triggering the URL if it's a link.)
  31  * @cfg {Boolean} removeClass remove the standard class..
  32  * @cfg {String} target (_self|_blank|_parent|_top|other) target for a href.
  33  * @cfg {Boolean} grpup if parent is a btn group - then it turns it into a toogleGroup.
  34  *
  35  * @constructor
  36  * Create a new button
  37  * @param {Object} config The config object
  38  */
  39
  40
  41 </span><span class="jsdoc-var">Roo.bootstrap.Button </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">){
  42     </span><span class="jsdoc-var">Roo.bootstrap.Button.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">);
  43
  44     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  45         </span><span class="jsdoc-comment">// raw events
  46         /**
  47          * @event click
  48          * When a button is pressed
  49          * @param {Roo.bootstrap.Button} btn
  50          * @param {Roo.EventObject} e
  51          */
  52         </span><span class="jsdoc-string">&quot;click&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  53         </span><span class="jsdoc-comment">/**
  54          * @event dblclick
  55          * When a button is double clicked
  56          * @param {Roo.bootstrap.Button} btn
  57          * @param {Roo.EventObject} e
  58          */
  59         </span><span class="jsdoc-string">&quot;dblclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  60          </span><span class="jsdoc-comment">/**
  61          * @event toggle
  62          * After the button has been toggles
  63          * @param {Roo.bootstrap.Button} btn
  64          * @param {Roo.EventObject} e
  65          * @param {boolean} pressed (also available as button.pressed)
  66          */
  67         </span><span class="jsdoc-string">&quot;toggle&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
  68     </span><span class="jsdoc-syntax">});
  69 };
  70
  71 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Button</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
  72     </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  73     </span><span class="jsdoc-var">active</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  74     </span><span class="jsdoc-var">weight</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  75     </span><span class="jsdoc-var">badge_weight</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  76     </span><span class="jsdoc-var">outline </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  77     </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  78     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
  79     </span><span class="jsdoc-var">href</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  80     </span><span class="jsdoc-var">disabled</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  81     </span><span class="jsdoc-var">isClose</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  82     </span><span class="jsdoc-var">glyphicon</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  83     </span><span class="jsdoc-var">fa</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  84     </span><span class="jsdoc-var">badge</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
  85     </span><span class="jsdoc-var">theme</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'default'</span><span class="jsdoc-syntax">,
  86     </span><span class="jsdoc-var">inverse</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  87
  88     </span><span class="jsdoc-var">toggle</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  89     </span><span class="jsdoc-var">ontext</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'ON'</span><span class="jsdoc-syntax">,
  90     </span><span class="jsdoc-var">offtext</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'OFF'</span><span class="jsdoc-syntax">,
  91     </span><span class="jsdoc-var">defaulton</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  92     </span><span class="jsdoc-var">preventDefault</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  93     </span><span class="jsdoc-var">removeClass</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  94     </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  95     </span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  96     </span><span class="jsdoc-var">group </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  97
  98     </span><span class="jsdoc-var">pressed </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
  99
 100
 101     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 102
 103         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {
 104             </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">,
 105             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-button'</span><span class="jsdoc-syntax">,
 106             </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''
 107         </span><span class="jsdoc-syntax">};
 108
 109         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">([</span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'submit'</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tag</span><span class="jsdoc-syntax">) &lt; 0) {
 110             </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Invalid value for tag: &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.tag </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot;. must be a, button, input or submit.&quot;</span><span class="jsdoc-syntax">;
 111             </span><span class="jsdoc-var">this.tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">;
 112         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 113             </span><span class="jsdoc-var">cfg.tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.tag</span><span class="jsdoc-syntax">;
 114         }
 115         </span><span class="jsdoc-var">cfg.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'&lt;span class=&quot;roo-button-text&quot;&gt;' </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">) + </span><span class="jsdoc-string">'&lt;/span&gt;'</span><span class="jsdoc-syntax">;
 116
 117         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.toggle </span><span class="jsdoc-syntax">== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) {
 118             </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">={
 119                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">,
 120                 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'slider-frame roo-button'</span><span class="jsdoc-syntax">,
 121                 </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
 122                     {
 123                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 124                         </span><span class="jsdoc-string">'data-on-text'</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'ON'</span><span class="jsdoc-syntax">,
 125                         </span><span class="jsdoc-string">'data-off-text'</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'OFF'</span><span class="jsdoc-syntax">,
 126                         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'slider-button'</span><span class="jsdoc-syntax">,
 127                         </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.offtext
 128                     </span><span class="jsdoc-syntax">}
 129                 ]
 130             };
 131             </span><span class="jsdoc-comment">// why are we validating the weights?
 132             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Button.weights.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.weight</span><span class="jsdoc-syntax">) &gt; -1) {
 133                 </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+=  </span><span class="jsdoc-string">' ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.weight</span><span class="jsdoc-syntax">;
 134             }
 135
 136             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 137         }
 138
 139         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isClose</span><span class="jsdoc-syntax">) {
 140             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' close'</span><span class="jsdoc-syntax">;
 141
 142             </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">&quot;aria-hidden&quot;</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 143
 144             </span><span class="jsdoc-var">cfg.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&amp;times;&quot;</span><span class="jsdoc-syntax">;
 145
 146             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 147         }
 148
 149
 150         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.theme</span><span class="jsdoc-syntax">===</span><span class="jsdoc-string">'default'</span><span class="jsdoc-syntax">) {
 151             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'btn roo-button'</span><span class="jsdoc-syntax">;
 152
 153             </span><span class="jsdoc-comment">//if (this.parentType != 'Navbar') {
 154             </span><span class="jsdoc-var">this.weight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.weight.length </span><span class="jsdoc-syntax">?  </span><span class="jsdoc-var">this.weight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'default'</span><span class="jsdoc-syntax">;
 155             </span><span class="jsdoc-comment">//}
 156             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Button.weights.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.weight</span><span class="jsdoc-syntax">) &gt; -1) {
 157
 158                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">outline </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.outline </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.weight </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'default' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'outline-' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 159                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">weight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.weight </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'default' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'secondary' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.weight</span><span class="jsdoc-syntax">;
 160                 </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' btn-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">outline </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">weight</span><span class="jsdoc-syntax">;
 161                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.weight </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'default'</span><span class="jsdoc-syntax">) {
 162                     </span><span class="jsdoc-comment">// BC
 163                     </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' btn-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.weight</span><span class="jsdoc-syntax">;
 164                 }
 165             }
 166         } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.theme</span><span class="jsdoc-syntax">===</span><span class="jsdoc-string">'glow'</span><span class="jsdoc-syntax">) {
 167
 168             </span><span class="jsdoc-var">cfg.tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">;
 169             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'btn-glow roo-button'</span><span class="jsdoc-syntax">;
 170
 171             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Button.weights.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.weight</span><span class="jsdoc-syntax">) &gt; -1) {
 172
 173                 </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.weight</span><span class="jsdoc-syntax">;
 174             }
 175         }
 176
 177
 178         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.inverse</span><span class="jsdoc-syntax">) {
 179             </span><span class="jsdoc-var">this.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' inverse'</span><span class="jsdoc-syntax">;
 180         }
 181
 182
 183         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.active </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.pressed </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) {
 184             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' active'</span><span class="jsdoc-syntax">;
 185         }
 186
 187         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">) {
 188             </span><span class="jsdoc-var">cfg.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'disabled'</span><span class="jsdoc-syntax">;
 189         }
 190
 191         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.items</span><span class="jsdoc-syntax">) {
 192             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'changing to ul' </span><span class="jsdoc-syntax">);
 193             </span><span class="jsdoc-var">cfg.tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'ul'</span><span class="jsdoc-syntax">;
 194             </span><span class="jsdoc-var">this.glyphicon </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'caret'</span><span class="jsdoc-syntax">;
 195             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.version </span><span class="jsdoc-syntax">== 4) {
 196                 </span><span class="jsdoc-var">this.fa </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'caret-down'</span><span class="jsdoc-syntax">;
 197             }
 198
 199         }
 200
 201         </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.size.length </span><span class="jsdoc-syntax">? (</span><span class="jsdoc-string">' btn-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.size</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 202
 203         </span><span class="jsdoc-comment">//gsRoo.log(this.parentType);
 204         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.parentType </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-string">'Navbar' </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.bar</span><span class="jsdoc-syntax">) {
 205             </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'changing to li?'</span><span class="jsdoc-syntax">);
 206
 207             </span><span class="jsdoc-var">cfg.tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'li'</span><span class="jsdoc-syntax">;
 208
 209             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 210             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">=  [{
 211                 </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">,
 212                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-button'</span><span class="jsdoc-syntax">,
 213                 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.html</span><span class="jsdoc-syntax">,
 214                 </span><span class="jsdoc-var">href </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.href </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'#'
 215             </span><span class="jsdoc-syntax">}];
 216             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.menu</span><span class="jsdoc-syntax">) {
 217                 </span><span class="jsdoc-var">cfg.cn</span><span class="jsdoc-syntax">[0]</span><span class="jsdoc-var">.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.html  </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">' &lt;span class=&quot;caret&quot;&gt;&lt;/span&gt;'</span><span class="jsdoc-syntax">;
 218                 </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' dropdown'</span><span class="jsdoc-syntax">;
 219             }
 220
 221             </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">cfg.html</span><span class="jsdoc-syntax">;
 222
 223         }
 224
 225        </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.parentType </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-string">'Navbar' </span><span class="jsdoc-syntax">?  </span><span class="jsdoc-string">' navbar-btn' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 226
 227         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.glyphicon</span><span class="jsdoc-syntax">) {
 228             </span><span class="jsdoc-var">cfg.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">' ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">cfg.html</span><span class="jsdoc-syntax">;
 229
 230             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 231                 {
 232                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 233                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'glyphicon glyphicon-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.glyphicon
 234                 </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.fa</span><span class="jsdoc-syntax">) {
 238             </span><span class="jsdoc-var">cfg.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">' ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">cfg.html</span><span class="jsdoc-syntax">;
 239
 240             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 241                 {
 242                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
 243                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'fa fas fa-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.fa
 244                 </span><span class="jsdoc-syntax">}
 245             ];
 246         }
 247
 248         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.badge</span><span class="jsdoc-syntax">) {
 249             </span><span class="jsdoc-var">cfg.html </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">;
 250
 251             </span><span class="jsdoc-var">cfg.tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'a'</span><span class="jsdoc-syntax">;
 252
 253 </span><span class="jsdoc-comment">//            cfg.cls='btn roo-button';
 254
 255             </span><span class="jsdoc-var">cfg.href</span><span class="jsdoc-syntax">=</span><span class="jsdoc-var">this.href</span><span class="jsdoc-syntax">;
 256
 257             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cfg.html</span><span class="jsdoc-syntax">;
 258
 259             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.glyphicon</span><span class="jsdoc-syntax">){
 260                 </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">= {
 261                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 262                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'glyphicon glyphicon-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.glyphicon</span><span class="jsdoc-syntax">,
 263                     </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.html
 264                 </span><span class="jsdoc-syntax">};
 265             }
 266             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fa</span><span class="jsdoc-syntax">){
 267                 </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">= {
 268                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
 269                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'fa fas fa-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.fa</span><span class="jsdoc-syntax">,
 270                     </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.html
 271                 </span><span class="jsdoc-syntax">};
 272             }
 273
 274             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">bw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.badge_weight.length </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.badge_weight </span><span class="jsdoc-syntax">:
 275                 (</span><span class="jsdoc-var">this.weight.length </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.weight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'secondary'</span><span class="jsdoc-syntax">);
 276             </span><span class="jsdoc-var">bw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bw </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'default' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'secondary' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">bw</span><span class="jsdoc-syntax">;
 277
 278             </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 279                 </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">,
 280                 {
 281                     </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 282                     </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'badge badge-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">bw</span><span class="jsdoc-syntax">,
 283                     </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.badge
 284                 </span><span class="jsdoc-syntax">}
 285             ];
 286
 287             </span><span class="jsdoc-var">cfg.html</span><span class="jsdoc-syntax">=</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 288         }
 289
 290         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.menu</span><span class="jsdoc-syntax">) {
 291             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' dropdown'</span><span class="jsdoc-syntax">;
 292             </span><span class="jsdoc-var">cfg.html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg.html</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">?
 293                     </span><span class="jsdoc-var">cfg.html </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">' &lt;span class=&quot;caret&quot;&gt;&lt;/span&gt;' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'&lt;span class=&quot;caret&quot;&gt;&lt;/span&gt;'</span><span class="jsdoc-syntax">;
 294         }
 295
 296         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg.tag </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-string">'a' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.href </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">) {
 297             </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Tag must be a to set href.&quot;</span><span class="jsdoc-syntax">;
 298         } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.href.length </span><span class="jsdoc-syntax">&gt; 0) {
 299             </span><span class="jsdoc-var">cfg.href </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.href</span><span class="jsdoc-syntax">;
 300         }
 301
 302         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.removeClass</span><span class="jsdoc-syntax">){
 303             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 304         }
 305
 306         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.target</span><span class="jsdoc-syntax">){
 307             </span><span class="jsdoc-var">cfg.target </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.target</span><span class="jsdoc-syntax">;
 308         }
 309
 310         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 311     },
 312     </span><span class="jsdoc-var">initEvents</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 313        </span><span class="jsdoc-comment">// Roo.log('init events?');
 314 //        Roo.log(this.el.dom);
 315         // add the menu...
 316
 317         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.menu</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
 318             </span><span class="jsdoc-var">this.menu.parentType </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.xtype</span><span class="jsdoc-syntax">;
 319             </span><span class="jsdoc-var">this.menu.triggerEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
 320             </span><span class="jsdoc-var">this.addxtype</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({}, </span><span class="jsdoc-var">this.menu</span><span class="jsdoc-syntax">));
 321         }
 322
 323
 324         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'roo-button'</span><span class="jsdoc-syntax">)) {
 325              </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 326              </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'dblclick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onDblClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 327         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 328              </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-button'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 329              </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-button'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'dblclick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onDblClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 330
 331         }
 332         </span><span class="jsdoc-comment">// why?
 333         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.removeClass</span><span class="jsdoc-syntax">){
 334             </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 335         }
 336
 337         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.group </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) {
 338              </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.pressed </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.pressed </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) {
 339                 </span><span class="jsdoc-comment">// nothing
 340             </span><span class="jsdoc-syntax">} </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 341                 </span><span class="jsdoc-var">this.pressed </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 342                 </span><span class="jsdoc-var">this.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.pressed</span><span class="jsdoc-syntax">);
 343             }
 344
 345         }
 346
 347         </span><span class="jsdoc-var">this.el.enableDisplayMode</span><span class="jsdoc-syntax">();
 348
 349     },
 350     </span><span class="jsdoc-var">onClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
 351     {
 352         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">) {
 353             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 354         }
 355
 356         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'button on click '</span><span class="jsdoc-syntax">);
 357         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.preventDefault</span><span class="jsdoc-syntax">){
 358             </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
 359         }
 360
 361         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.group</span><span class="jsdoc-syntax">) {
 362             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.pressed</span><span class="jsdoc-syntax">) {
 363                 </span><span class="jsdoc-comment">// do nothing -
 364                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 365             }
 366             </span><span class="jsdoc-var">this.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 367             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pi </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.items</span><span class="jsdoc-syntax">;
 368             </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">pi.length</span><span class="jsdoc-syntax">;</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
 369                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">pi</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]) {
 370                     </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
 371                 }
 372                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pi</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.el.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'roo-button'</span><span class="jsdoc-syntax">)) {
 373                     </span><span class="jsdoc-var">pi</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.setActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
 374                 }
 375             }
 376             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 377             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 378         }
 379
 380         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.pressed </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.pressed </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) {
 381             </span><span class="jsdoc-var">this.toggleActive</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 382         }
 383
 384
 385         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'click'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 386     },
 387     </span><span class="jsdoc-var">onDblClick</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
 388     {
 389         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">) {
 390             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 391         }
 392         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.preventDefault</span><span class="jsdoc-syntax">){
 393             </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
 394         }
 395         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'dblclick'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 396     },
 397     </span><span class="jsdoc-comment">/**
 398      * Enables this button
 399      */
 400     </span><span class="jsdoc-var">enable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 401     {
 402         </span><span class="jsdoc-var">this.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 403         </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'disabled'</span><span class="jsdoc-syntax">);
 404         </span><span class="jsdoc-var">this.el.dom.removeAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;disabled&quot;</span><span class="jsdoc-syntax">);
 405     },
 406
 407     </span><span class="jsdoc-comment">/**
 408      * Disable this button
 409      */
 410     </span><span class="jsdoc-var">disable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 411     {
 412         </span><span class="jsdoc-var">this.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 413         </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'disabled'</span><span class="jsdoc-syntax">);
 414         </span><span class="jsdoc-var">this.el.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;disabled&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;disabled&quot;</span><span class="jsdoc-syntax">)
 415     },
 416      </span><span class="jsdoc-comment">/**
 417      * sets the active state on/off,
 418      * @param {Boolean} state (optional) Force a particular state
 419      */
 420     </span><span class="jsdoc-var">setActive </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">) {
 421
 422         </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'addClass' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'removeClass'</span><span class="jsdoc-syntax">](</span><span class="jsdoc-string">'active'</span><span class="jsdoc-syntax">);
 423         </span><span class="jsdoc-var">this.pressed </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 424     },
 425      </span><span class="jsdoc-comment">/**
 426      * toggles the current active state
 427      */
 428     </span><span class="jsdoc-var">toggleActive </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">)
 429     {
 430         </span><span class="jsdoc-var">this.setActive</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.pressed</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// this modifies pressed...
 431         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'toggle'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.pressed</span><span class="jsdoc-syntax">);
 432     },
 433      </span><span class="jsdoc-comment">/**
 434      * get the current active state
 435      * @return {boolean} true if it's active
 436      */
 437     </span><span class="jsdoc-var">isActive </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 438     {
 439         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'active'</span><span class="jsdoc-syntax">);
 440     },
 441     </span><span class="jsdoc-comment">/**
 442      * set the text of the first selected button
 443      */
 444     </span><span class="jsdoc-var">setText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">)
 445     {
 446         </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-button-text'</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">.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
 447     },
 448     </span><span class="jsdoc-comment">/**
 449      * get the text of the first selected button
 450      */
 451     </span><span class="jsdoc-var">getText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 452     {
 453         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-button-text'</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">.dom.innerHTML</span><span class="jsdoc-syntax">;
 454     },
 455
 456     </span><span class="jsdoc-var">setWeight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">)
 457     {
 458         </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Button.weights.map</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-keyword">return </span><span class="jsdoc-string">'btn-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">; } ) );
 459         </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Button.weights.map</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-keyword">return </span><span class="jsdoc-string">'btn-outline-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">; } ) );
 460         </span><span class="jsdoc-var">this.weight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">;
 461         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">outline </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.outline </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'outline-' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 462         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">str </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'default'</span><span class="jsdoc-syntax">) {
 463             </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'btn-default btn-outline-secondary'</span><span class="jsdoc-syntax">);
 464             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 465         }
 466         </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'btn-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">outline </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">str</span><span class="jsdoc-syntax">);
 467     }
 468
 469
 470 });
 471 </span><span class="jsdoc-comment">// fixme - this is probably generic bootstrap - should go in some kind of enum file.. - like sizes.
 472
 473 </span><span class="jsdoc-var">Roo.bootstrap.Button.weights </span><span class="jsdoc-syntax">= [
 474     </span><span class="jsdoc-string">'default'</span><span class="jsdoc-syntax">,
 475     </span><span class="jsdoc-string">'secondary' </span><span class="jsdoc-syntax">,
 476     </span><span class="jsdoc-string">'primary'</span><span class="jsdoc-syntax">,
 477     </span><span class="jsdoc-string">'success'</span><span class="jsdoc-syntax">,
 478     </span><span class="jsdoc-string">'info'</span><span class="jsdoc-syntax">,
 479     </span><span class="jsdoc-string">'warning'</span><span class="jsdoc-syntax">,
 480     </span><span class="jsdoc-string">'danger'</span><span class="jsdoc-syntax">,
 481     </span><span class="jsdoc-string">'link'</span><span class="jsdoc-syntax">,
 482     </span><span class="jsdoc-string">'light'</span><span class="jsdoc-syntax">,
 483     </span><span class="jsdoc-string">'dark'
 484
 485 </span><span class="jsdoc-syntax">];</span></code></body></html>