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

   1 <html><head><title>Roo/Element.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 // was in Composite Element!??!?!
  14
  15 </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
  16     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">D </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Dom</span><span class="jsdoc-syntax">;
  17     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">E </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Event</span><span class="jsdoc-syntax">;
  18     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">A </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Anim</span><span class="jsdoc-syntax">;
  19
  20     </span><span class="jsdoc-comment">// local style camelizing for speed
  21     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">propCache </span><span class="jsdoc-syntax">= {};
  22     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">camelRe </span><span class="jsdoc-syntax">= /(-[a-z])/gi;
  23     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">camelFn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">a.charAt</span><span class="jsdoc-syntax">(1)</span><span class="jsdoc-var">.toUpperCase</span><span class="jsdoc-syntax">(); };
  24     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">view </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.defaultView</span><span class="jsdoc-syntax">;
  25
  26 </span><span class="jsdoc-comment">/**
  27  * @class Roo.Element
  28  * Represents an Element in the DOM.&lt;br&gt;&lt;br&gt;
  29  * Usage:&lt;br&gt;
  30 &lt;pre&gt;&lt;code&gt;
  31 var el = Roo.get(&quot;my-div&quot;);
  32
  33 // or with getEl
  34 var el = getEl(&quot;my-div&quot;);
  35
  36 // or with a DOM element
  37 var el = Roo.get(myDivElement);
  38 &lt;/code&gt;&lt;/pre&gt;
  39  * Using Roo.get() or getEl() instead of calling the constructor directly ensures you get the same object
  40  * each call instead of constructing a new one.&lt;br&gt;&lt;br&gt;
  41  * &lt;b&gt;Animations&lt;/b&gt;&lt;br /&gt;
  42  * Many of the functions for manipulating an element have an optional &quot;animate&quot; parameter. The animate parameter
  43  * should either be a boolean (true) or an object literal with animation options. The animation options are:
  44 &lt;pre&gt;
  45 Option    Default   Description
  46 --------- --------  ---------------------------------------------
  47 duration  .35       The duration of the animation in seconds
  48 easing    easeOut   The YUI easing method
  49 callback  none      A function to execute when the anim completes
  50 scope     this      The scope (this) of the callback function
  51 &lt;/pre&gt;
  52 * Also, the Anim object being used for the animation will be set on your options object as &quot;anim&quot;, which allows you to stop or
  53 * manipulate the animation. Here's an example:
  54 &lt;pre&gt;&lt;code&gt;
  55 var el = Roo.get(&quot;my-div&quot;);
  56
  57 // no animation
  58 el.setWidth(100);
  59
  60 // default animation
  61 el.setWidth(100, true);
  62
  63 // animation with some options set
  64 el.setWidth(100, {
  65     duration: 1,
  66     callback: this.foo,
  67     scope: this
  68 });
  69
  70 // using the &quot;anim&quot; property to get the Anim object
  71 var opt = {
  72     duration: 1,
  73     callback: this.foo,
  74     scope: this
  75 };
  76 el.setWidth(100, opt);
  77 ...
  78 if(opt.anim.isAnimated()){
  79     opt.anim.stop();
  80 }
  81 &lt;/code&gt;&lt;/pre&gt;
  82 * &lt;b&gt; Composite (Collections of) Elements&lt;/b&gt;&lt;br /&gt;
  83  * For working with collections of Elements, see &lt;a href=&quot;Roo.CompositeElement.html&quot;&gt;Roo.CompositeElement&lt;/a&gt;
  84  * @constructor Create a new Element directly.
  85  * @param {String/HTMLElement} element
  86  * @param {Boolean} forceNew (optional) By default the constructor checks to see if there is already an instance of this element in the cache and if there is it returns the same instance. This will skip that check (useful for extending this class).
  87  */
  88     </span><span class="jsdoc-var">Roo.Element </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">element</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">forceNew</span><span class="jsdoc-syntax">)
  89     {
  90         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">element </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;string&quot; </span><span class="jsdoc-syntax">?
  91                 </span><span class="jsdoc-var">document.getElementById</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">element</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">element</span><span class="jsdoc-syntax">;
  92
  93         </span><span class="jsdoc-var">this.listeners </span><span class="jsdoc-syntax">= {};
  94
  95         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// invalid id/element
  96             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
  97         }
  98         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dom.id</span><span class="jsdoc-syntax">;
  99         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">forceNew </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.Element.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">]){ </span><span class="jsdoc-comment">// element object already exists
 100             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.Element.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">];
 101         }
 102
 103         </span><span class="jsdoc-comment">/**
 104          * The DOM element
 105          * @type HTMLElement
 106          */
 107         </span><span class="jsdoc-var">this.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">;
 108
 109         </span><span class="jsdoc-comment">/**
 110          * The DOM element ID
 111          * @type String
 112          */
 113         </span><span class="jsdoc-var">this.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">);
 114
 115         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// assumed for cctor?
 116     </span><span class="jsdoc-syntax">};
 117
 118     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">El </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.Element</span><span class="jsdoc-syntax">;
 119
 120     </span><span class="jsdoc-var">El.prototype </span><span class="jsdoc-syntax">= {
 121         </span><span class="jsdoc-comment">/**
 122          * The element's default display mode  (defaults to &quot;&quot;)
 123          * @type String
 124          */
 125         </span><span class="jsdoc-var">originalDisplay </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">,
 126
 127
 128         </span><span class="jsdoc-comment">// note this is overridden in BS version..
 129         </span><span class="jsdoc-var">visibilityMode </span><span class="jsdoc-syntax">: 1,
 130         </span><span class="jsdoc-comment">/**
 131          * The default unit to append to CSS values where a unit isn't provided (defaults to px).
 132          * @type String
 133          */
 134         </span><span class="jsdoc-var">defaultUnit </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;px&quot;</span><span class="jsdoc-syntax">,
 135
 136         </span><span class="jsdoc-comment">/**
 137          * Sets the element's visibility mode. When setVisible() is called it
 138          * will use this to determine whether to set the visibility or the display property.
 139          * @param visMode Element.VISIBILITY or Element.DISPLAY
 140          * @return {Roo.Element} this
 141          */
 142         </span><span class="jsdoc-var">setVisibilityMode </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">visMode</span><span class="jsdoc-syntax">){
 143             </span><span class="jsdoc-var">this.visibilityMode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">visMode</span><span class="jsdoc-syntax">;
 144             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 145         },
 146         </span><span class="jsdoc-comment">/**
 147          * Convenience method for setVisibilityMode(Element.DISPLAY)
 148          * @param {String} display (optional) What to set display to when visible
 149          * @return {Roo.Element} this
 150          */
 151         </span><span class="jsdoc-var">enableDisplayMode </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">display</span><span class="jsdoc-syntax">){
 152             </span><span class="jsdoc-var">this.setVisibilityMode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">El.DISPLAY</span><span class="jsdoc-syntax">);
 153             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">display </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;undefined&quot;</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-var">this.originalDisplay </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">display</span><span class="jsdoc-syntax">; }
 154             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 155         },
 156
 157         </span><span class="jsdoc-comment">/**
 158          * Looks at this node and then at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)
 159          * @param {String} selector The simple selector to test
 160          * @param {Number/String/HTMLElement/Element} maxDepth (optional) The max depth to
 161                 search as a number or element (defaults to 10 || document.body)
 162          * @param {Boolean} returnEl (optional) True to return a Roo.Element object instead of DOM node
 163          * @return {HTMLElement} The matching DOM node (or null if no match was found)
 164          */
 165         </span><span class="jsdoc-var">findParent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">simpleSelector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxDepth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnEl</span><span class="jsdoc-syntax">){
 166             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">depth </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">dq </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomQuery</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">stopEl</span><span class="jsdoc-syntax">;
 167             </span><span class="jsdoc-var">maxDepth </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">maxDepth </span><span class="jsdoc-syntax">|| 50;
 168             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">maxDepth </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;number&quot;</span><span class="jsdoc-syntax">){
 169                 </span><span class="jsdoc-var">stopEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">maxDepth</span><span class="jsdoc-syntax">);
 170                 </span><span class="jsdoc-var">maxDepth </span><span class="jsdoc-syntax">= 10;
 171             }
 172             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p.nodeType </span><span class="jsdoc-syntax">== 1 &amp;&amp; </span><span class="jsdoc-var">depth </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">maxDepth </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">stopEl</span><span class="jsdoc-syntax">){
 173                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dq.is</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">simpleSelector</span><span class="jsdoc-syntax">)){
 174                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnEl </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">;
 175                 }
 176                 </span><span class="jsdoc-var">depth</span><span class="jsdoc-syntax">++;
 177                 </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p.parentNode</span><span class="jsdoc-syntax">;
 178             }
 179             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 180         },
 181
 182
 183         </span><span class="jsdoc-comment">/**
 184          * Looks at parent nodes for a match of the passed simple selector (e.g. div.some-class or span:first-child)
 185          * @param {String} selector The simple selector to test
 186          * @param {Number/String/HTMLElement/Element} maxDepth (optional) The max depth to
 187                 search as a number or element (defaults to 10 || document.body)
 188          * @param {Boolean} returnEl (optional) True to return a Roo.Element object instead of DOM node
 189          * @return {HTMLElement} The matching DOM node (or null if no match was found)
 190          */
 191         </span><span class="jsdoc-var">findParentNode </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">simpleSelector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxDepth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnEl</span><span class="jsdoc-syntax">){
 192             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.parentNode</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_internal'</span><span class="jsdoc-syntax">);
 193             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">p.findParent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">simpleSelector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxDepth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnEl</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
 194         },
 195
 196         </span><span class="jsdoc-comment">/**
 197          * Looks at  the scrollable parent element
 198          */
 199         </span><span class="jsdoc-var">findScrollableParent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 200         {
 201             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">overflowRegex </span><span class="jsdoc-syntax">= /(auto|scroll)/;
 202
 203             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-string">'fixed'</span><span class="jsdoc-syntax">){
 204                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.isAndroid </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.documentElement</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">);
 205             }
 206
 207             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">excludeStaticParent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-string">&quot;absolute&quot;</span><span class="jsdoc-syntax">;
 208
 209             </span><span class="jsdoc-keyword">for </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">parent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">; (</span><span class="jsdoc-var">parent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parent.dom.parentNode</span><span class="jsdoc-syntax">));){
 210
 211                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">excludeStaticParent </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">parent.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-string">&quot;static&quot;</span><span class="jsdoc-syntax">) {
 212                     </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">;
 213                 }
 214
 215                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">overflowRegex.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parent.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'overflow'</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">parent.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'overflow-x'</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">parent.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'overflow-y'</span><span class="jsdoc-syntax">))){
 216                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">parent</span><span class="jsdoc-syntax">;
 217                 }
 218
 219                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parent.dom.nodeName.toLowerCase</span><span class="jsdoc-syntax">() == </span><span class="jsdoc-string">'body'</span><span class="jsdoc-syntax">){
 220                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.isAndroid </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.documentElement</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">);
 221                 }
 222             }
 223
 224             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.isAndroid </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.documentElement</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">);
 225         },
 226
 227         </span><span class="jsdoc-comment">/**
 228          * Walks up the dom looking for a parent node that matches the passed simple selector (e.g. div.some-class or span:first-child).
 229          * This is a shortcut for findParentNode() that always returns an Roo.Element.
 230          * @param {String} selector The simple selector to test
 231          * @param {Number/String/HTMLElement/Element} maxDepth (optional) The max depth to
 232                 search as a number or element (defaults to 10 || document.body)
 233          * @return {Roo.Element} The matching DOM node (or null if no match was found)
 234          */
 235         </span><span class="jsdoc-var">up </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">simpleSelector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxDepth</span><span class="jsdoc-syntax">){
 236             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.findParentNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">simpleSelector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">maxDepth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 237         },
 238
 239
 240
 241         </span><span class="jsdoc-comment">/**
 242          * Returns true if this element matches the passed simple selector (e.g. div.some-class or span:first-child)
 243          * @param {String} selector The simple selector to test
 244          * @return {Boolean} True if this element matches the selector, else false
 245          */
 246         </span><span class="jsdoc-var">is </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">simpleSelector</span><span class="jsdoc-syntax">){
 247             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.DomQuery.is</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">simpleSelector</span><span class="jsdoc-syntax">);
 248         },
 249
 250         </span><span class="jsdoc-comment">/**
 251          * Perform animation on this element.
 252          * @param {Object} args The YUI animation control args
 253          * @param {Float} duration (optional) How long the animation lasts in seconds (defaults to .35)
 254          * @param {Function} onComplete (optional) Function to call when animation completes
 255          * @param {String} easing (optional) Easing method to use (defaults to 'easeOut')
 256          * @param {String} animType (optional) 'run' is the default. Can also be 'color', 'motion', or 'scroll'
 257          * @return {Roo.Element} this
 258          */
 259         </span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">args</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">onComplete</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">easing</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animType</span><span class="jsdoc-syntax">){
 260             </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">args</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">onComplete</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">easing</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">easing</span><span class="jsdoc-syntax">}, </span><span class="jsdoc-var">animType</span><span class="jsdoc-syntax">);
 261             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 262         },
 263
 264         </span><span class="jsdoc-comment">/*
 265          * @private Internal animation call
 266          */
 267         </span><span class="jsdoc-var">anim </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">args</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">opt</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animType</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">defaultDur</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">defaultEase</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cb</span><span class="jsdoc-syntax">){
 268             </span><span class="jsdoc-var">animType </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">animType </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'run'</span><span class="jsdoc-syntax">;
 269             </span><span class="jsdoc-var">opt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">opt </span><span class="jsdoc-syntax">|| {};
 270             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">anim </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Anim</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">animType</span><span class="jsdoc-syntax">](
 271                 </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">args</span><span class="jsdoc-syntax">,
 272                 (</span><span class="jsdoc-var">opt.duration </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">defaultDur</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">.35</span><span class="jsdoc-syntax">,
 273                 (</span><span class="jsdoc-var">opt.easing </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">defaultEase</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-string">'easeOut'</span><span class="jsdoc-syntax">,
 274                 </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 275                     </span><span class="jsdoc-var">Roo.callback</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cb</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 276                     </span><span class="jsdoc-var">Roo.callback</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">opt.callback</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">opt.scope </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, [</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">opt</span><span class="jsdoc-syntax">]);
 277                 },
 278                 </span><span class="jsdoc-var">this
 279             </span><span class="jsdoc-syntax">);
 280             </span><span class="jsdoc-var">opt.anim </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">anim</span><span class="jsdoc-syntax">;
 281             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">anim</span><span class="jsdoc-syntax">;
 282         },
 283
 284         </span><span class="jsdoc-comment">// private legacy anim prep
 285         </span><span class="jsdoc-var">preanim </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">){
 286             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">!</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] ? </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">] == </span><span class="jsdoc-string">&quot;object&quot; </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]: {</span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">+1], </span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">+2], </span><span class="jsdoc-var">easing</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">+3]});
 287         },
 288
 289         </span><span class="jsdoc-comment">/**
 290          * Removes worthless text nodes
 291          * @param {Boolean} forceReclean (optional) By default the element
 292          * keeps track if it has been cleaned already so
 293          * you can call this over and over. However, if you update the element and
 294          * need to force a reclean, you can pass true.
 295          */
 296         </span><span class="jsdoc-var">clean </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">forceReclean</span><span class="jsdoc-syntax">){
 297             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isCleaned </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">forceReclean </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
 298                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 299             }
 300             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ns </span><span class="jsdoc-syntax">= /\S/;
 301             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">d.firstChild</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ni </span><span class="jsdoc-syntax">= -1;
 302             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">){
 303                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">nx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">n.nextSibling</span><span class="jsdoc-syntax">;
 304                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n.nodeType </span><span class="jsdoc-syntax">== 3 &amp;&amp; !</span><span class="jsdoc-var">ns.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n.nodeValue</span><span class="jsdoc-syntax">)){
 305                     </span><span class="jsdoc-var">d.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">);
 306                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 307                     </span><span class="jsdoc-var">n.nodeIndex </span><span class="jsdoc-syntax">= ++</span><span class="jsdoc-var">ni</span><span class="jsdoc-syntax">;
 308                 }
 309                 </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">nx</span><span class="jsdoc-syntax">;
 310             }
 311             </span><span class="jsdoc-var">this.isCleaned </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 312             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 313         },
 314
 315         </span><span class="jsdoc-comment">// private
 316         </span><span class="jsdoc-var">calcOffsetsTo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
 317             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
 318             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.dom</span><span class="jsdoc-syntax">;
 319             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">restorePos </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 320             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'static'</span><span class="jsdoc-syntax">){
 321                 </span><span class="jsdoc-var">el.position</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'relative'</span><span class="jsdoc-syntax">);
 322                 </span><span class="jsdoc-var">restorePos </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 323             }
 324             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">=0;
 325             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">op </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
 326             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">op </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">op </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">op.tagName </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'HTML'</span><span class="jsdoc-syntax">){
 327                 </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">op.offsetLeft</span><span class="jsdoc-syntax">;
 328                 </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">op.offsetTop</span><span class="jsdoc-syntax">;
 329                 </span><span class="jsdoc-var">op </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">op.offsetParent</span><span class="jsdoc-syntax">;
 330             }
 331             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">restorePos</span><span class="jsdoc-syntax">){
 332                 </span><span class="jsdoc-var">el.position</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'static'</span><span class="jsdoc-syntax">);
 333             }
 334             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">];
 335         },
 336
 337         </span><span class="jsdoc-comment">/**
 338          * Scrolls this element into view within the passed container.
 339          * @param {String/HTMLElement/Element} container (optional) The container element to scroll (defaults to document.body)
 340          * @param {Boolean} hscroll (optional) False to disable horizontal scroll (defaults to true)
 341          * @return {Roo.Element} this
 342          */
 343         </span><span class="jsdoc-var">scrollIntoView </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">container</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">hscroll</span><span class="jsdoc-syntax">){
 344             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">container</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">;
 345             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
 346
 347             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">o </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.calcOffsetsTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">),
 348                 </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[0],
 349                 </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[1],
 350                 </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">el.offsetHeight</span><span class="jsdoc-syntax">,
 351                 </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">el.offsetWidth</span><span class="jsdoc-syntax">;
 352
 353             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ch </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">c.clientHeight</span><span class="jsdoc-syntax">;
 354             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ct </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c.scrollTop</span><span class="jsdoc-syntax">, 10);
 355             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c.scrollLeft</span><span class="jsdoc-syntax">, 10);
 356             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ct </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">ch</span><span class="jsdoc-syntax">;
 357             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cl </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">c.clientWidth</span><span class="jsdoc-syntax">;
 358
 359             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">){
 360                 </span><span class="jsdoc-var">c.scrollTop </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">;
 361             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">cb</span><span class="jsdoc-syntax">){
 362                 </span><span class="jsdoc-var">c.scrollTop </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">ch</span><span class="jsdoc-syntax">;
 363             }
 364
 365             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">hscroll </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 366                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">cl</span><span class="jsdoc-syntax">){
 367                     </span><span class="jsdoc-var">c.scrollLeft </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">;
 368                 }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">cr</span><span class="jsdoc-syntax">){
 369                     </span><span class="jsdoc-var">c.scrollLeft </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">c.clientWidth</span><span class="jsdoc-syntax">;
 370                 }
 371             }
 372             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 373         },
 374
 375         </span><span class="jsdoc-comment">// private
 376         </span><span class="jsdoc-var">scrollChildIntoView </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">child</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">hscroll</span><span class="jsdoc-syntax">){
 377             </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">child</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_scrollChildIntoView'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.scrollIntoView</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">hscroll</span><span class="jsdoc-syntax">);
 378         },
 379
 380         </span><span class="jsdoc-comment">/**
 381          * Measures the element's content height and updates height to match. Note: this function uses setTimeout so
 382          * the new height may not be available immediately.
 383          * @param {Boolean} animate (optional) Animate the transition (defaults to false)
 384          * @param {Float} duration (optional) Length of the animation in seconds (defaults to .35)
 385          * @param {Function} onComplete (optional) Function to call when animation completes
 386          * @param {String} easing (optional) Easing method to use (defaults to easeOut)
 387          * @return {Roo.Element} this
 388          */
 389         </span><span class="jsdoc-var">autoHeight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">onComplete</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">easing</span><span class="jsdoc-syntax">){
 390             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">oldHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHeight</span><span class="jsdoc-syntax">();
 391             </span><span class="jsdoc-var">this.clip</span><span class="jsdoc-syntax">();
 392             </span><span class="jsdoc-var">this.setHeight</span><span class="jsdoc-syntax">(1); </span><span class="jsdoc-comment">// force clipping
 393             </span><span class="jsdoc-var">setTimeout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 394                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.scrollHeight</span><span class="jsdoc-syntax">, 10); </span><span class="jsdoc-comment">// parseInt for Safari
 395                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
 396                     </span><span class="jsdoc-var">this.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
 397                     </span><span class="jsdoc-var">this.unclip</span><span class="jsdoc-syntax">();
 398                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">onComplete </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;function&quot;</span><span class="jsdoc-syntax">){
 399                         </span><span class="jsdoc-var">onComplete</span><span class="jsdoc-syntax">();
 400                     }
 401                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 402                     </span><span class="jsdoc-var">this.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">oldHeight</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// restore original height
 403                     </span><span class="jsdoc-var">this.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">duration</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 404                         </span><span class="jsdoc-var">this.unclip</span><span class="jsdoc-syntax">();
 405                         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">onComplete </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;function&quot;</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-var">onComplete</span><span class="jsdoc-syntax">(); }
 406                     }</span><span class="jsdoc-var">.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">easing</span><span class="jsdoc-syntax">);
 407                 }
 408             }</span><span class="jsdoc-var">.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">), 0);
 409             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 410         },
 411
 412         </span><span class="jsdoc-comment">/**
 413          * Returns true if this element is an ancestor of the passed element
 414          * @param {HTMLElement/String} el The element to check
 415          * @return {Boolean} True if this element is an ancestor of el, else false
 416          */
 417         </span><span class="jsdoc-var">contains </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
 418             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){</span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;}
 419             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">D.isAncestor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el.dom </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">el.dom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
 420         },
 421
 422         </span><span class="jsdoc-comment">/**
 423          * Checks whether the element is currently visible using both visibility and display properties.
 424          * @param {Boolean} deep (optional) True to walk the dom and see if parent elements are hidden (defaults to false)
 425          * @return {Boolean} True if the element is currently visible, else false
 426          */
 427         </span><span class="jsdoc-var">isVisible </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">deep</span><span class="jsdoc-syntax">) {
 428             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">vis </span><span class="jsdoc-syntax">= !(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;visibility&quot;</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">&quot;hidden&quot; </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;display&quot;</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">&quot;none&quot;</span><span class="jsdoc-syntax">);
 429             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">deep </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">vis</span><span class="jsdoc-syntax">){
 430                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">vis</span><span class="jsdoc-syntax">;
 431             }
 432             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.parentNode</span><span class="jsdoc-syntax">;
 433             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p.tagName.toLowerCase</span><span class="jsdoc-syntax">() != </span><span class="jsdoc-string">&quot;body&quot;</span><span class="jsdoc-syntax">){
 434                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_isVisible'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.isVisible</span><span class="jsdoc-syntax">()){
 435                     </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 436                 }
 437                 </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p.parentNode</span><span class="jsdoc-syntax">;
 438             }
 439             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 440         },
 441
 442         </span><span class="jsdoc-comment">/**
 443          * Creates a {@link Roo.CompositeElement} for child nodes based on the passed CSS selector (the selector should not contain an id).
 444          * @param {String} selector The CSS selector
 445          * @param {Boolean} unique (optional) True to create a unique Roo.Element for each child (defaults to false, which creates a single shared flyweight object)
 446          * @return {CompositeElement/CompositeElementLite} The composite element
 447          */
 448         </span><span class="jsdoc-var">select </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">unique</span><span class="jsdoc-syntax">){
 449             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">El.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">unique</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
 450         },
 451
 452         </span><span class="jsdoc-comment">/**
 453          * Selects child nodes based on the passed CSS selector (the selector should not contain an id).
 454          * @param {String} selector The CSS selector
 455          * @return {Array} An array of the matched nodes
 456          */
 457         </span><span class="jsdoc-var">query </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">unique</span><span class="jsdoc-syntax">){
 458             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.DomQuery.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
 459         },
 460
 461         </span><span class="jsdoc-comment">/**
 462          * Selects a single child at any depth below this element based on the passed CSS selector (the selector should not contain an id).
 463          * @param {String} selector The CSS selector
 464          * @param {Boolean} returnDom (optional) True to return the DOM node instead of Roo.Element (defaults to false)
 465          * @return {HTMLElement/Roo.Element} The child Roo.Element (or DOM node if returnDom = true)
 466          */
 467         </span><span class="jsdoc-var">child </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">){
 468             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomQuery.selectNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
 469             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnDom </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">);
 470         },
 471
 472         </span><span class="jsdoc-comment">/**
 473          * Selects a single *direct* child based on the passed CSS selector (the selector should not contain an id).
 474          * @param {String} selector The CSS selector
 475          * @param {Boolean} returnDom (optional) True to return the DOM node instead of Roo.Element (defaults to false)
 476          * @return {HTMLElement/Roo.Element} The child Roo.Element (or DOM node if returnDom = true)
 477          */
 478         </span><span class="jsdoc-var">down </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">){
 479             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomQuery.selectNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot; &gt; &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
 480             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnDom </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">);
 481         },
 482
 483         </span><span class="jsdoc-comment">/**
 484          * Initializes a {@link Roo.dd.DD} drag drop object for this element.
 485          * @param {String} group The group the DD object is member of
 486          * @param {Object} config The DD config object
 487          * @param {Object} overrides An object containing methods to override/implement on the DD object
 488          * @return {Roo.dd.DD} The DD object
 489          */
 490         </span><span class="jsdoc-var">initDD </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">group</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">overrides</span><span class="jsdoc-syntax">){
 491             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.dd.DD</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">group</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
 492             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">overrides</span><span class="jsdoc-syntax">);
 493         },
 494
 495         </span><span class="jsdoc-comment">/**
 496          * Initializes a {@link Roo.dd.DDProxy} object for this element.
 497          * @param {String} group The group the DDProxy object is member of
 498          * @param {Object} config The DDProxy config object
 499          * @param {Object} overrides An object containing methods to override/implement on the DDProxy object
 500          * @return {Roo.dd.DDProxy} The DDProxy object
 501          */
 502         </span><span class="jsdoc-var">initDDProxy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">group</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">overrides</span><span class="jsdoc-syntax">){
 503             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.dd.DDProxy</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">group</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
 504             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">overrides</span><span class="jsdoc-syntax">);
 505         },
 506
 507         </span><span class="jsdoc-comment">/**
 508          * Initializes a {@link Roo.dd.DDTarget} object for this element.
 509          * @param {String} group The group the DDTarget object is member of
 510          * @param {Object} config The DDTarget config object
 511          * @param {Object} overrides An object containing methods to override/implement on the DDTarget object
 512          * @return {Roo.dd.DDTarget} The DDTarget object
 513          */
 514         </span><span class="jsdoc-var">initDDTarget </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">group</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">overrides</span><span class="jsdoc-syntax">){
 515             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.dd.DDTarget</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">group</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
 516             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dd</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">overrides</span><span class="jsdoc-syntax">);
 517         },
 518
 519         </span><span class="jsdoc-comment">/**
 520          * Sets the visibility of the element (see details). If the visibilityMode is set to Element.DISPLAY, it will use
 521          * the display property to hide the element, otherwise it uses visibility. The default is to hide and show using the visibility property.
 522          * @param {Boolean} visible Whether the element is visible
 523          * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
 524          * @return {Roo.Element} this
 525          */
 526          </span><span class="jsdoc-var">setVisible </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">visible</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
 527             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
 528                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.visibilityMode </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">El.DISPLAY</span><span class="jsdoc-syntax">){
 529                     </span><span class="jsdoc-var">this.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">visible</span><span class="jsdoc-syntax">);
 530                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 531                     </span><span class="jsdoc-var">this.fixDisplay</span><span class="jsdoc-syntax">();
 532                     </span><span class="jsdoc-var">this.dom.style.visibility </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">visible </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">&quot;visible&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;hidden&quot;</span><span class="jsdoc-syntax">;
 533                 }
 534             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 535                 </span><span class="jsdoc-comment">// closure for composites
 536                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
 537                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">visMode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.visibilityMode</span><span class="jsdoc-syntax">;
 538                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">visible</span><span class="jsdoc-syntax">){
 539                     </span><span class="jsdoc-var">this.setOpacity</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">.01</span><span class="jsdoc-syntax">);
 540                     </span><span class="jsdoc-var">this.setVisible</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 541                 }
 542                 </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">opacity</span><span class="jsdoc-syntax">: { </span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">visible</span><span class="jsdoc-syntax">?1:0) }},
 543                       </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 1),
 544                       </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">.35</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'easeIn'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 545                          </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">visible</span><span class="jsdoc-syntax">){
 546                              </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">visMode </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">El.DISPLAY</span><span class="jsdoc-syntax">){
 547                                  </span><span class="jsdoc-var">dom.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;none&quot;</span><span class="jsdoc-syntax">;
 548                              }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 549                                  </span><span class="jsdoc-var">dom.style.visibility </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;hidden&quot;</span><span class="jsdoc-syntax">;
 550                              }
 551                              </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.setOpacity</span><span class="jsdoc-syntax">(1);
 552                          }
 553                      });
 554             }
 555             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 556         },
 557
 558         </span><span class="jsdoc-comment">/**
 559          * Returns true if display is not &quot;none&quot;
 560          * @return {Boolean}
 561          */
 562         </span><span class="jsdoc-var">isDisplayed </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 563             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;display&quot;</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">&quot;none&quot;</span><span class="jsdoc-syntax">;
 564         },
 565
 566         </span><span class="jsdoc-comment">/**
 567          * Toggles the element's visibility or display, depending on visibility mode.
 568          * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
 569          * @return {Roo.Element} this
 570          */
 571         </span><span class="jsdoc-var">toggle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
 572             </span><span class="jsdoc-var">this.setVisible</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isVisible</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 0));
 573             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 574         },
 575
 576         </span><span class="jsdoc-comment">/**
 577          * Sets the CSS display property. Uses originalDisplay if the specified value is a boolean true.
 578          * @param {Boolean} value Boolean value to display the element using its default display, or a string to set the display directly
 579          * @return {Roo.Element} this
 580          */
 581         </span><span class="jsdoc-var">setDisplayed </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">) {
 582             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;boolean&quot;</span><span class="jsdoc-syntax">){
 583                </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.originalDisplay </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;none&quot;</span><span class="jsdoc-syntax">;
 584             }
 585             </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;display&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">);
 586             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 587         },
 588
 589         </span><span class="jsdoc-comment">/**
 590          * Tries to focus the element. Any exceptions are caught and ignored.
 591          * @return {Roo.Element} this
 592          */
 593         </span><span class="jsdoc-var">focus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 594             </span><span class="jsdoc-keyword">try</span><span class="jsdoc-syntax">{
 595                 </span><span class="jsdoc-var">this.dom.focus</span><span class="jsdoc-syntax">();
 596             }</span><span class="jsdoc-keyword">catch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){}
 597             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 598         },
 599
 600         </span><span class="jsdoc-comment">/**
 601          * Tries to blur the element. Any exceptions are caught and ignored.
 602          * @return {Roo.Element} this
 603          */
 604         </span><span class="jsdoc-var">blur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 605             </span><span class="jsdoc-keyword">try</span><span class="jsdoc-syntax">{
 606                 </span><span class="jsdoc-var">this.dom.blur</span><span class="jsdoc-syntax">();
 607             }</span><span class="jsdoc-keyword">catch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){}
 608             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 609         },
 610
 611         </span><span class="jsdoc-comment">/**
 612          * Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out.
 613          * @param {String/Array} className The CSS class to add, or an array of classes
 614          * @return {Roo.Element} this
 615          */
 616         </span><span class="jsdoc-var">addClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">){
 617             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Array</span><span class="jsdoc-syntax">){
 618                 </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">className.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">++) {
 619                     </span><span class="jsdoc-var">this.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
 620                 }
 621             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 622                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">)){
 623                     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">SVGElement</span><span class="jsdoc-syntax">) {
 624                         </span><span class="jsdoc-var">this.dom.className.baseVal </span><span class="jsdoc-syntax">=</span><span class="jsdoc-var">this.dom.className.baseVal  </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot; &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">;
 625                     } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 626                         </span><span class="jsdoc-var">this.dom.className </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.className </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">&quot; &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">;
 627                     }
 628                 }
 629             }
 630             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 631         },
 632
 633         </span><span class="jsdoc-comment">/**
 634          * Adds one or more CSS classes to this element and removes the same class(es) from all siblings.
 635          * @param {String/Array} className The CSS class to add, or an array of classes
 636          * @return {Roo.Element} this
 637          */
 638         </span><span class="jsdoc-var">radioClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">){
 639             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">siblings </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.parentNode.childNodes</span><span class="jsdoc-syntax">;
 640             </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">siblings.length</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++) {
 641                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">s </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">siblings</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
 642                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">s.nodeType </span><span class="jsdoc-syntax">== 1){
 643                     </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
 644                 }
 645             }
 646             </span><span class="jsdoc-var">this.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
 647             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 648         },
 649
 650         </span><span class="jsdoc-comment">/**
 651          * Removes one or more CSS classes from the element.
 652          * @param {String/Array} className The CSS class to remove, or an array of classes
 653          * @return {Roo.Element} this
 654          */
 655         </span><span class="jsdoc-var">removeClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">){
 656
 657             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">SVGElement </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.dom.className.baseVal </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.dom.className</span><span class="jsdoc-syntax">;
 658             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">className </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">){
 659                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 660             }
 661             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Array</span><span class="jsdoc-syntax">){
 662                 </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">className.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">++) {
 663                     </span><span class="jsdoc-var">this.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
 664                 }
 665             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 666                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">)){
 667                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">re </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.classReCache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">];
 668                     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">re</span><span class="jsdoc-syntax">) {
 669                        </span><span class="jsdoc-var">re </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">RegExp</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'(?:^|\\s+)' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">className </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'(?:\\s+|$)'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;g&quot;</span><span class="jsdoc-syntax">);
 670                        </span><span class="jsdoc-var">this.classReCache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">re</span><span class="jsdoc-syntax">;
 671                     }
 672                     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">SVGElement</span><span class="jsdoc-syntax">) {
 673                         </span><span class="jsdoc-var">this.dom.className.baseVal </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cn.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">re</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot; &quot;</span><span class="jsdoc-syntax">);
 674                     } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 675                         </span><span class="jsdoc-var">this.dom.className </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cn.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">re</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot; &quot;</span><span class="jsdoc-syntax">);
 676                     }
 677                 }
 678             }
 679             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 680         },
 681
 682         </span><span class="jsdoc-comment">// private
 683         </span><span class="jsdoc-var">classReCache</span><span class="jsdoc-syntax">: {},
 684
 685         </span><span class="jsdoc-comment">/**
 686          * Toggles the specified CSS class on this element (removes it if it already exists, otherwise adds it).
 687          * @param {String} className The CSS class to toggle
 688          * @return {Roo.Element} this
 689          */
 690         </span><span class="jsdoc-var">toggleClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">){
 691             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hasClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">)){
 692                 </span><span class="jsdoc-var">this.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
 693             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 694                 </span><span class="jsdoc-var">this.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
 695             }
 696             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 697         },
 698
 699         </span><span class="jsdoc-comment">/**
 700          * Checks if the specified CSS class exists on this element's DOM node.
 701          * @param {String} className The CSS class to check for
 702          * @return {Boolean} True if the class exists, else false
 703          */
 704         </span><span class="jsdoc-var">hasClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">){
 705             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">SVGElement</span><span class="jsdoc-syntax">) {
 706                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">className </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">this.dom.className.baseVal </span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">) != -1;
 707             }
 708             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">className </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">this.dom.className</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">' '</span><span class="jsdoc-syntax">) != -1;
 709         },
 710
 711         </span><span class="jsdoc-comment">/**
 712          * Replaces a CSS class on the element with another.  If the old name does not exist, the new name will simply be added.
 713          * @param {String} oldClassName The CSS class to replace
 714          * @param {String} newClassName The replacement CSS class
 715          * @return {Roo.Element} this
 716          */
 717         </span><span class="jsdoc-var">replaceClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">oldClassName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">newClassName</span><span class="jsdoc-syntax">){
 718             </span><span class="jsdoc-var">this.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">oldClassName</span><span class="jsdoc-syntax">);
 719             </span><span class="jsdoc-var">this.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newClassName</span><span class="jsdoc-syntax">);
 720             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 721         },
 722
 723         </span><span class="jsdoc-comment">/**
 724          * Returns an object with properties matching the styles requested.
 725          * For example, el.getStyles('color', 'font-size', 'width') might return
 726          * {'color': '#FFFFFF', 'font-size': '13px', 'width': '100px'}.
 727          * @param {String} style1 A style name
 728          * @param {String} style2 A style name
 729          * @param {String} etc.
 730          * @return {Object} The style object
 731          */
 732         </span><span class="jsdoc-var">getStyles </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 733             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">len </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">a.length</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= {};
 734             </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">len</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
 735                 </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]] = </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
 736             }
 737             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">;
 738         },
 739
 740         </span><span class="jsdoc-comment">/**
 741          * Normalizes currentStyle and computedStyle. This is not YUI getStyle, it is an optimised version.
 742          * @param {String} property The style property whose value is returned.
 743          * @return {String} The current value of the style property for this element.
 744          */
 745         </span><span class="jsdoc-var">getStyle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 746             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">view </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">view.getComputedStyle </span><span class="jsdoc-syntax">?
 747                 </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">){
 748                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">camel</span><span class="jsdoc-syntax">;
 749                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'float'</span><span class="jsdoc-syntax">){
 750                         </span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;cssFloat&quot;</span><span class="jsdoc-syntax">;
 751                     }
 752                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.style </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.style</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">])){
 753                         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 754                     }
 755                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">view.getComputedStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">)){
 756                         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!(</span><span class="jsdoc-var">camel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">propCache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">])){
 757                             </span><span class="jsdoc-var">camel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">propCache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">prop.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">camelRe</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">camelFn</span><span class="jsdoc-syntax">);
 758                         }
 759                         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">camel</span><span class="jsdoc-syntax">];
 760                     }
 761                     </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 762                 } :
 763                 </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">){
 764                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">camel</span><span class="jsdoc-syntax">;
 765                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'opacity'</span><span class="jsdoc-syntax">){
 766                         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">el.style.filter </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">){
 767                             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">m </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.style.filter.match</span><span class="jsdoc-syntax">(/alpha\(opacity=(.*)\)/i);
 768                             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">){
 769                                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">fv </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseFloat</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">[1]);
 770                                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">isNaN</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fv</span><span class="jsdoc-syntax">)){
 771                                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">fv </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">fv </span><span class="jsdoc-syntax">/ 100 : 0;
 772                                 }
 773                             }
 774                         }
 775                         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">1;
 776                     }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'float'</span><span class="jsdoc-syntax">){
 777                         </span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;styleFloat&quot;</span><span class="jsdoc-syntax">;
 778                     }
 779                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!(</span><span class="jsdoc-var">camel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">propCache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">])){
 780                         </span><span class="jsdoc-var">camel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">propCache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">prop.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">camelRe</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">camelFn</span><span class="jsdoc-syntax">);
 781                     }
 782                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.style</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">camel</span><span class="jsdoc-syntax">]){
 783                         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 784                     }
 785                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.currentStyle</span><span class="jsdoc-syntax">){
 786                         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">camel</span><span class="jsdoc-syntax">];
 787                     }
 788                     </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
 789                 };
 790         }(),
 791
 792         </span><span class="jsdoc-comment">/**
 793          * Wrapper for setting style properties, also takes single object parameter of multiple styles.
 794          * @param {String/Object} property The style property to be set, or an object of multiple styles.
 795          * @param {String} value (optional) The value to apply to the given property, or null if an object was passed.
 796          * @return {Roo.Element} this
 797          */
 798         </span><span class="jsdoc-var">setStyle </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">){
 799             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;string&quot;</span><span class="jsdoc-syntax">){
 800
 801                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'float'</span><span class="jsdoc-syntax">) {
 802                     </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'styleFloat'  </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'cssFloat'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">);
 803                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 804                 }
 805
 806                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">camel</span><span class="jsdoc-syntax">;
 807                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!(</span><span class="jsdoc-var">camel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">propCache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">])){
 808                     </span><span class="jsdoc-var">camel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">propCache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">prop.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">camelRe</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">camelFn</span><span class="jsdoc-syntax">);
 809                 }
 810
 811                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">camel </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'opacity'</span><span class="jsdoc-syntax">) {
 812                     </span><span class="jsdoc-var">this.setOpacity</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">);
 813                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 814                     </span><span class="jsdoc-var">this.dom.style</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">camel</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">;
 815                 }
 816             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 817                 </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">style </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">){
 818                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">] != </span><span class="jsdoc-string">&quot;function&quot;</span><span class="jsdoc-syntax">){
 819                        </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">]);
 820                     }
 821                 }
 822             }
 823             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 824         },
 825
 826         </span><span class="jsdoc-comment">/**
 827          * More flexible version of {@link #setStyle} for setting style properties.
 828          * @param {String/Object/Function} styles A style specification string, e.g. &quot;width:100px&quot;, or object in the form {width:&quot;100px&quot;}, or
 829          * a function which returns such a specification.
 830          * @return {Roo.Element} this
 831          */
 832         </span><span class="jsdoc-var">applyStyles </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">){
 833             </span><span class="jsdoc-var">Roo.DomHelper.applyStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">style</span><span class="jsdoc-syntax">);
 834             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 835         },
 836
 837         </span><span class="jsdoc-comment">/**
 838           * Gets the current X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
 839           * @return {Number} The X position of the element
 840           */
 841         </span><span class="jsdoc-var">getX </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 842             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">D.getX</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
 843         },
 844
 845         </span><span class="jsdoc-comment">/**
 846           * Gets the current Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
 847           * @return {Number} The Y position of the element
 848           */
 849         </span><span class="jsdoc-var">getY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 850             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">D.getY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
 851         },
 852
 853         </span><span class="jsdoc-comment">/**
 854           * Gets the current position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
 855           * @return {Array} The XY position of the element
 856           */
 857         </span><span class="jsdoc-var">getXY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 858             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">D.getXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
 859         },
 860
 861         </span><span class="jsdoc-comment">/**
 862          * Sets the X position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
 863          * @param {Number} The X position of the element
 864          * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
 865          * @return {Roo.Element} this
 866          */
 867         </span><span class="jsdoc-var">setX </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
 868             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
 869                 </span><span class="jsdoc-var">D.setX</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">);
 870             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 871                 </span><span class="jsdoc-var">this.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.getY</span><span class="jsdoc-syntax">()], </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 1));
 872             }
 873             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 874         },
 875
 876         </span><span class="jsdoc-comment">/**
 877          * Sets the Y position of the element based on page coordinates.  Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
 878          * @param {Number} The Y position of the element
 879          * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
 880          * @return {Roo.Element} this
 881          */
 882         </span><span class="jsdoc-var">setY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
 883             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
 884                 </span><span class="jsdoc-var">D.setY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">);
 885             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 886                 </span><span class="jsdoc-var">this.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">this.getX</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 1));
 887             }
 888             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 889         },
 890
 891         </span><span class="jsdoc-comment">/**
 892          * Sets the element's left position directly using CSS style (instead of {@link #setX}).
 893          * @param {String} left The left CSS property value
 894          * @return {Roo.Element} this
 895          */
 896         </span><span class="jsdoc-var">setLeft </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">){
 897             </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">));
 898             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 899         },
 900
 901         </span><span class="jsdoc-comment">/**
 902          * Sets the element's top position directly using CSS style (instead of {@link #setY}).
 903          * @param {String} top The top CSS property value
 904          * @return {Roo.Element} this
 905          */
 906         </span><span class="jsdoc-var">setTop </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">){
 907             </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">));
 908             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 909         },
 910
 911         </span><span class="jsdoc-comment">/**
 912          * Sets the element's CSS right style.
 913          * @param {String} right The right CSS property value
 914          * @return {Roo.Element} this
 915          */
 916         </span><span class="jsdoc-var">setRight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">right</span><span class="jsdoc-syntax">){
 917             </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;right&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">right</span><span class="jsdoc-syntax">));
 918             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 919         },
 920
 921         </span><span class="jsdoc-comment">/**
 922          * Sets the element's CSS bottom style.
 923          * @param {String} bottom The bottom CSS property value
 924          * @return {Roo.Element} this
 925          */
 926         </span><span class="jsdoc-var">setBottom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bottom</span><span class="jsdoc-syntax">){
 927             </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;bottom&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">bottom</span><span class="jsdoc-syntax">));
 928             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 929         },
 930
 931         </span><span class="jsdoc-comment">/**
 932          * Sets the position of the element in page coordinates, regardless of how the element is positioned.
 933          * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
 934          * @param {Array} pos Contains X &amp; Y [x, y] values for new position (coordinates are page-based)
 935          * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
 936          * @return {Roo.Element} this
 937          */
 938         </span><span class="jsdoc-var">setXY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
 939             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
 940                 </span><span class="jsdoc-var">D.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">);
 941             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 942                 </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">points</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">}}, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 1), </span><span class="jsdoc-string">'motion'</span><span class="jsdoc-syntax">);
 943             }
 944             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 945         },
 946
 947         </span><span class="jsdoc-comment">/**
 948          * Sets the position of the element in page coordinates, regardless of how the element is positioned.
 949          * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
 950          * @param {Number} x X value for new position (coordinates are page-based)
 951          * @param {Number} y Y value for new position (coordinates are page-based)
 952          * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
 953          * @return {Roo.Element} this
 954          */
 955         </span><span class="jsdoc-var">setLocation </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
 956             </span><span class="jsdoc-var">this.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2));
 957             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 958         },
 959
 960         </span><span class="jsdoc-comment">/**
 961          * Sets the position of the element in page coordinates, regardless of how the element is positioned.
 962          * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
 963          * @param {Number} x X value for new position (coordinates are page-based)
 964          * @param {Number} y Y value for new position (coordinates are page-based)
 965          * @param {Boolean/Object} animate (optional) True for the default animation, or a standard Element animation config object
 966          * @return {Roo.Element} this
 967          */
 968         </span><span class="jsdoc-var">moveTo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
 969             </span><span class="jsdoc-var">this.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2));
 970             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 971         },
 972
 973         </span><span class="jsdoc-comment">/**
 974          * Returns the region of the given element.
 975          * The element must be part of the DOM tree to have a region (display:none or elements not appended return false).
 976          * @return {Region} A Roo.lib.Region containing &quot;top, left, bottom, right&quot; member data.
 977          */
 978         </span><span class="jsdoc-var">getRegion </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 979             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">D.getRegion</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
 980         },
 981
 982         </span><span class="jsdoc-comment">/**
 983          * Returns the offset height of the element
 984          * @param {Boolean} contentHeight (optional) true to get the height minus borders and padding
 985          * @return {Number} The element's height
 986          */
 987         </span><span class="jsdoc-var">getHeight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">contentHeight</span><span class="jsdoc-syntax">){
 988             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.offsetHeight </span><span class="jsdoc-syntax">|| 0;
 989             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">contentHeight </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">)-</span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">);
 990         },
 991
 992         </span><span class="jsdoc-comment">/**
 993          * Returns the offset width of the element
 994          * @param {Boolean} contentWidth (optional) true to get the width minus borders and padding
 995          * @return {Number} The element's width
 996          */
 997         </span><span class="jsdoc-var">getWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">contentWidth</span><span class="jsdoc-syntax">){
 998             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.offsetWidth </span><span class="jsdoc-syntax">|| 0;
 999             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">contentWidth </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">)-</span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">);
1000         },
1001
1002         </span><span class="jsdoc-comment">/**
1003          * Returns either the offsetHeight or the height of this element based on CSS height adjusted by padding or borders
1004          * when needed to simulate offsetHeight when offsets aren't available. This may not work on display:none elements
1005          * if a height has not been set using CSS.
1006          * @return {Number}
1007          */
1008         </span><span class="jsdoc-var">getComputedHeight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1009             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.offsetHeight</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom.clientHeight</span><span class="jsdoc-syntax">);
1010             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">){
1011                 </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'height'</span><span class="jsdoc-syntax">), 10) || 0;
1012                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isBorderBox</span><span class="jsdoc-syntax">()){
1013                     </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.getFrameWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tb'</span><span class="jsdoc-syntax">);
1014                 }
1015             }
1016             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
1017         },
1018
1019         </span><span class="jsdoc-comment">/**
1020          * Returns either the offsetWidth or the width of this element based on CSS width adjusted by padding or borders
1021          * when needed to simulate offsetWidth when offsets aren't available. This may not work on display:none elements
1022          * if a width has not been set using CSS.
1023          * @return {Number}
1024          */
1025         </span><span class="jsdoc-var">getComputedWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1026             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.offsetWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom.clientWidth</span><span class="jsdoc-syntax">);
1027             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">){
1028                 </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'width'</span><span class="jsdoc-syntax">), 10) || 0;
1029                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isBorderBox</span><span class="jsdoc-syntax">()){
1030                     </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">this.getFrameWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'lr'</span><span class="jsdoc-syntax">);
1031                 }
1032             }
1033             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
1034         },
1035
1036         </span><span class="jsdoc-comment">/**
1037          * Returns the size of the element.
1038          * @param {Boolean} contentSize (optional) true to get the width/size minus borders and padding
1039          * @return {Object} An object containing the element's size {width: (element width), height: (element height)}
1040          */
1041         </span><span class="jsdoc-var">getSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">contentSize</span><span class="jsdoc-syntax">){
1042             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">contentSize</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">contentSize</span><span class="jsdoc-syntax">)};
1043         },
1044
1045         </span><span class="jsdoc-comment">/**
1046          * Returns the width and height of the viewport.
1047          * @return {Object} An object containing the viewport's size {width: (viewport width), height: (viewport height)}
1048          */
1049         </span><span class="jsdoc-var">getViewSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1050             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">doc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">aw </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">ah </span><span class="jsdoc-syntax">= 0;
1051             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">doc </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">doc.body</span><span class="jsdoc-syntax">){
1052                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">D.getViewWidth</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">D.getViewHeight</span><span class="jsdoc-syntax">()};
1053             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1054                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
1055                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">d.clientWidth</span><span class="jsdoc-syntax">,
1056                     </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">d.clientHeight
1057                 </span><span class="jsdoc-syntax">};
1058             }
1059         },
1060
1061         </span><span class="jsdoc-comment">/**
1062          * Returns the value of the &quot;value&quot; attribute
1063          * @param {Boolean} asNumber true to parse the value as a number
1064          * @return {String/Number}
1065          */
1066         </span><span class="jsdoc-var">getValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">asNumber</span><span class="jsdoc-syntax">){
1067             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">asNumber </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.value</span><span class="jsdoc-syntax">, 10) : </span><span class="jsdoc-var">this.dom.value</span><span class="jsdoc-syntax">;
1068         },
1069
1070         </span><span class="jsdoc-comment">// private
1071         </span><span class="jsdoc-var">adjustWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">){
1072             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;number&quot;</span><span class="jsdoc-syntax">){
1073                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoBoxAdjust </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.isBorderBox</span><span class="jsdoc-syntax">()){
1074                    </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">-= (</span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">));
1075                 }
1076                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">&lt; 0){
1077                     </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= 0;
1078                 }
1079             }
1080             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">;
1081         },
1082
1083         </span><span class="jsdoc-comment">// private
1084         </span><span class="jsdoc-var">adjustHeight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">){
1085             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;number&quot;</span><span class="jsdoc-syntax">){
1086                </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.autoBoxAdjust </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.isBorderBox</span><span class="jsdoc-syntax">()){
1087                    </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">-= (</span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">));
1088                }
1089                </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">&lt; 0){
1090                    </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= 0;
1091                }
1092             }
1093             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">;
1094         },
1095
1096         </span><span class="jsdoc-comment">/**
1097          * Set the width of the element
1098          * @param {Number} width The new width
1099          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1100          * @return {Roo.Element} this
1101          */
1102         </span><span class="jsdoc-var">setWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1103             </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.adjustWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
1104             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
1105                 </span><span class="jsdoc-var">this.dom.style.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
1106             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1107                 </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">}}, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 1));
1108             }
1109             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1110         },
1111
1112         </span><span class="jsdoc-comment">/**
1113          * Set the height of the element
1114          * @param {Number} height The new height
1115          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1116          * @return {Roo.Element} this
1117          */
1118          </span><span class="jsdoc-var">setHeight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1119             </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.adjustHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
1120             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
1121                 </span><span class="jsdoc-var">this.dom.style.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
1122             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1123                 </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">}}, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 1));
1124             }
1125             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1126         },
1127
1128         </span><span class="jsdoc-comment">/**
1129          * Set the size of the element. If animation is true, both width an height will be animated concurrently.
1130          * @param {Number} width The new width
1131          * @param {Number} height The new height
1132          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1133          * @return {Roo.Element} this
1134          */
1135          </span><span class="jsdoc-var">setSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1136             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;object&quot;</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// in case of object from getSize()
1137                 </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width.height</span><span class="jsdoc-syntax">; </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">width.width</span><span class="jsdoc-syntax">;
1138             }
1139             </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.adjustWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">); </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.adjustHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
1140             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
1141                 </span><span class="jsdoc-var">this.dom.style.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">);
1142                 </span><span class="jsdoc-var">this.dom.style.height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
1143             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1144                 </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">}, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">}}, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2));
1145             }
1146             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1147         },
1148
1149         </span><span class="jsdoc-comment">/**
1150          * Sets the element's position and size in one shot. If animation is true then width, height, x and y will be animated concurrently.
1151          * @param {Number} x X value for new position (coordinates are page-based)
1152          * @param {Number} y Y value for new position (coordinates are page-based)
1153          * @param {Number} width The new width
1154          * @param {Number} height The new height
1155          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1156          * @return {Roo.Element} this
1157          */
1158         </span><span class="jsdoc-var">setBounds </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1159             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
1160                 </span><span class="jsdoc-var">this.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
1161                 </span><span class="jsdoc-var">this.setLocation</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">);
1162             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1163                 </span><span class="jsdoc-var">width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.adjustWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">); </span><span class="jsdoc-var">height </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.adjustHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">);
1164                 </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">points</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: [</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">]}, </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">width</span><span class="jsdoc-syntax">}, </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">}},
1165                               </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 4), </span><span class="jsdoc-string">'motion'</span><span class="jsdoc-syntax">);
1166             }
1167             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1168         },
1169
1170         </span><span class="jsdoc-comment">/**
1171          * Sets the element's position and size the the specified region. If animation is true then width, height, x and y will be animated concurrently.
1172          * @param {Roo.lib.Region} region The region to fill
1173          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1174          * @return {Roo.Element} this
1175          */
1176         </span><span class="jsdoc-var">setRegion </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">region</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1177             </span><span class="jsdoc-var">this.setBounds</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">region.left</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">region.top</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">region.right</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">region.left</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">region.bottom</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">region.top</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 1));
1178             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1179         },
1180
1181         </span><span class="jsdoc-comment">/**
1182          * Appends an event handler
1183          *
1184          * @param {String}   eventName     The type of event to append
1185          * @param {Function} fn        The method the event invokes
1186          * @param {Object} scope       (optional) The scope (this object) of the fn
1187          * @param {Object}   options   (optional)An object with standard {@link Roo.EventManager#addListener} options
1188          */
1189         </span><span class="jsdoc-var">addListener </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">options</span><span class="jsdoc-syntax">)
1190         {
1191             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'dblclick'</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-comment">// doublclick (touchstart) - faked on touch.
1192                 </span><span class="jsdoc-var">this.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'touchstart'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTapHandler</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
1193             }
1194
1195             </span><span class="jsdoc-comment">// we need to handle a special case where dom element is a svg element.
1196             // in this case we do not actua
1197             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">) {
1198                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1199             }
1200
1201             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">SVGElement </span><span class="jsdoc-syntax">&amp;&amp; !(</span><span class="jsdoc-var">this.dom </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">SVGSVGElement</span><span class="jsdoc-syntax">)) {
1202                 </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.listeners</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">]) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
1203                     </span><span class="jsdoc-var">this.listeners</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">] =  </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.Event</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">);
1204                 }
1205                 </span><span class="jsdoc-var">this.listeners</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.addListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">options</span><span class="jsdoc-syntax">);
1206                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1207             }
1208
1209
1210             </span><span class="jsdoc-var">Roo.EventManager.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">options</span><span class="jsdoc-syntax">);
1211
1212
1213         },
1214         </span><span class="jsdoc-var">tapedTwice </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
1215         </span><span class="jsdoc-var">onTapHandler </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">)
1216         {
1217             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.tapedTwice</span><span class="jsdoc-syntax">) {
1218                 </span><span class="jsdoc-var">this.tapedTwice </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1219                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">s </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1220                 </span><span class="jsdoc-var">setTimeout</span><span class="jsdoc-syntax">( </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
1221                     </span><span class="jsdoc-var">s.tapedTwice </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1222                 }, 300 );
1223                 </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
1224             }
1225             </span><span class="jsdoc-var">event.preventDefault</span><span class="jsdoc-syntax">();
1226             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">revent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">MouseEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'dblclick'</span><span class="jsdoc-syntax">,  {
1227                 </span><span class="jsdoc-var">view</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">window</span><span class="jsdoc-syntax">,
1228                 </span><span class="jsdoc-var">bubbles</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
1229                 </span><span class="jsdoc-var">cancelable</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
1230             </span><span class="jsdoc-syntax">});
1231
1232             </span><span class="jsdoc-var">this.dom.dispatchEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">revent</span><span class="jsdoc-syntax">);
1233             </span><span class="jsdoc-comment">//action on double tap goes below
1234
1235         </span><span class="jsdoc-syntax">},
1236
1237         </span><span class="jsdoc-comment">/**
1238          * Removes an event handler from this element
1239          * @param {String} eventName the type of event to remove
1240          * @param {Function} fn the method the event invokes
1241          * @param {Function} scope (needed for svg fake listeners)
1242          * @return {Roo.Element} this
1243          */
1244         </span><span class="jsdoc-var">removeListener </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">){
1245             </span><span class="jsdoc-var">Roo.EventManager.removeListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">);
1246             </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.listeners</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined'  </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.listeners</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">]) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
1247                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1248             }
1249             </span><span class="jsdoc-var">this.listeners</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.removeListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">);
1250             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1251         },
1252
1253         </span><span class="jsdoc-comment">/**
1254          * Removes all previous added listeners from this element
1255          * @return {Roo.Element} this
1256          */
1257         </span><span class="jsdoc-var">removeAllListeners </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1258             </span><span class="jsdoc-var">E.purgeElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
1259             </span><span class="jsdoc-var">this.listeners </span><span class="jsdoc-syntax">= {};
1260             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1261         },
1262
1263         </span><span class="jsdoc-var">relayEvent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">observable</span><span class="jsdoc-syntax">){
1264             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</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">){
1265                 </span><span class="jsdoc-var">observable.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
1266             });
1267         },
1268
1269
1270         </span><span class="jsdoc-comment">/**
1271          * Set the opacity of the element
1272          * @param {Float} opacity The new opacity. 0 = transparent, .5 = 50% visibile, 1 = fully visible, etc
1273          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1274          * @return {Roo.Element} this
1275          */
1276          </span><span class="jsdoc-var">setOpacity </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">opacity</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1277             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
1278                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">s </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.style</span><span class="jsdoc-syntax">;
1279                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE</span><span class="jsdoc-syntax">){
1280                     </span><span class="jsdoc-var">s.zoom </span><span class="jsdoc-syntax">= 1;
1281                     </span><span class="jsdoc-var">s.filter </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">s.filter </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.replace</span><span class="jsdoc-syntax">(/alpha\([^\)]*\)/gi,</span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">) +
1282                                (</span><span class="jsdoc-var">opacity </span><span class="jsdoc-syntax">== 1 ? </span><span class="jsdoc-string">&quot;&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;alpha(opacity=&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">opacity </span><span class="jsdoc-syntax">* 100 + </span><span class="jsdoc-string">&quot;)&quot;</span><span class="jsdoc-syntax">);
1283                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1284                     </span><span class="jsdoc-var">s.opacity </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">opacity</span><span class="jsdoc-syntax">;
1285                 }
1286             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1287                 </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">opacity</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">opacity</span><span class="jsdoc-syntax">}}, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 1), </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">.35</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'easeIn'</span><span class="jsdoc-syntax">);
1288             }
1289             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1290         },
1291
1292         </span><span class="jsdoc-comment">/**
1293          * Gets the left X coordinate
1294          * @param {Boolean} local True to get the local css position instead of page coordinate
1295          * @return {Number}
1296          */
1297         </span><span class="jsdoc-var">getLeft </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
1298             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
1299                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getX</span><span class="jsdoc-syntax">();
1300             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1301                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">), 10) || 0;
1302             }
1303         },
1304
1305         </span><span class="jsdoc-comment">/**
1306          * Gets the right X coordinate of the element (element X position + element width)
1307          * @param {Boolean} local True to get the local css position instead of page coordinate
1308          * @return {Number}
1309          */
1310         </span><span class="jsdoc-var">getRight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
1311             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
1312                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getX</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">this.getWidth</span><span class="jsdoc-syntax">();
1313             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1314                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">this.getWidth</span><span class="jsdoc-syntax">()) || 0;
1315             }
1316         },
1317
1318         </span><span class="jsdoc-comment">/**
1319          * Gets the top Y coordinate
1320          * @param {Boolean} local True to get the local css position instead of page coordinate
1321          * @return {Number}
1322          */
1323         </span><span class="jsdoc-var">getTop </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">) {
1324             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
1325                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getY</span><span class="jsdoc-syntax">();
1326             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1327                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">), 10) || 0;
1328             }
1329         },
1330
1331         </span><span class="jsdoc-comment">/**
1332          * Gets the bottom Y coordinate of the element (element Y position + element height)
1333          * @param {Boolean} local True to get the local css position instead of page coordinate
1334          * @return {Number}
1335          */
1336         </span><span class="jsdoc-var">getBottom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
1337             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
1338                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getY</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-var">this.getHeight</span><span class="jsdoc-syntax">();
1339             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1340                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">this.getHeight</span><span class="jsdoc-syntax">()) || 0;
1341             }
1342         },
1343
1344         </span><span class="jsdoc-comment">/**
1345         * Initializes positioning on this element. If a desired position is not passed, it will make the
1346         * the element positioned relative IF it is not already positioned.
1347         * @param {String} pos (optional) Positioning to use &quot;relative&quot;, &quot;absolute&quot; or &quot;fixed&quot;
1348         * @param {Number} zIndex (optional) The zIndex to apply
1349         * @param {Number} x (optional) Set the page X position
1350         * @param {Number} y (optional) Set the page Y position
1351         */
1352         </span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">zIndex</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">){
1353             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">){
1354                </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'static'</span><span class="jsdoc-syntax">){
1355                    </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'relative'</span><span class="jsdoc-syntax">);
1356                }
1357             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1358                 </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;position&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">pos</span><span class="jsdoc-syntax">);
1359             }
1360             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">zIndex</span><span class="jsdoc-syntax">){
1361                 </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">zIndex</span><span class="jsdoc-syntax">);
1362             }
1363             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
1364                 </span><span class="jsdoc-var">this.setXY</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">]);
1365             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
1366                 </span><span class="jsdoc-var">this.setX</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">);
1367             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
1368                 </span><span class="jsdoc-var">this.setY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">);
1369             }
1370         },
1371
1372         </span><span class="jsdoc-comment">/**
1373         * Clear positioning back to the default when the document was loaded
1374         * @param {String} value (optional) The value to use for the left,right,top,bottom, defaults to '' (empty string). You could use 'auto'.
1375         * @return {Roo.Element} this
1376          */
1377         </span><span class="jsdoc-var">clearPositioning </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">){
1378             </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">||</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
1379             </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">({
1380                 </span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">,
1381                 </span><span class="jsdoc-string">&quot;right&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">,
1382                 </span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">,
1383                 </span><span class="jsdoc-string">&quot;bottom&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">,
1384                 </span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">,
1385                 </span><span class="jsdoc-string">&quot;position&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;static&quot;
1386             </span><span class="jsdoc-syntax">});
1387             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1388         },
1389
1390         </span><span class="jsdoc-comment">/**
1391         * Gets an object with all CSS positioning properties. Useful along with setPostioning to get
1392         * snapshot before performing an update and then restoring the element.
1393         * @return {Object}
1394         */
1395         </span><span class="jsdoc-var">getPositioning </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1396             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">);
1397             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">);
1398             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
1399                 </span><span class="jsdoc-string">&quot;position&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;position&quot;</span><span class="jsdoc-syntax">),
1400                 </span><span class="jsdoc-string">&quot;left&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">,
1401                 </span><span class="jsdoc-string">&quot;right&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">&quot;&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;right&quot;</span><span class="jsdoc-syntax">),
1402                 </span><span class="jsdoc-string">&quot;top&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">,
1403                 </span><span class="jsdoc-string">&quot;bottom&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">&quot;&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;bottom&quot;</span><span class="jsdoc-syntax">),
1404                 </span><span class="jsdoc-string">&quot;z-index&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;z-index&quot;</span><span class="jsdoc-syntax">)
1405             };
1406         },
1407
1408         </span><span class="jsdoc-comment">/**
1409          * Gets the width of the border(s) for the specified side(s)
1410          * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
1411          * passing lr would get the border (l)eft width + the border (r)ight width.
1412          * @return {Number} The width of the sides passed added together
1413          */
1414         </span><span class="jsdoc-var">getBorderWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">side</span><span class="jsdoc-syntax">){
1415             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.addStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">side</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">El.borders</span><span class="jsdoc-syntax">);
1416         },
1417
1418         </span><span class="jsdoc-comment">/**
1419          * Gets the width of the padding(s) for the specified side(s)
1420          * @param {String} side Can be t, l, r, b or any combination of those to add multiple values. For example,
1421          * passing lr would get the padding (l)eft + the padding (r)ight.
1422          * @return {Number} The padding of the sides passed added together
1423          */
1424         </span><span class="jsdoc-var">getPadding </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">side</span><span class="jsdoc-syntax">){
1425             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.addStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">side</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">El.paddings</span><span class="jsdoc-syntax">);
1426         },
1427
1428         </span><span class="jsdoc-comment">/**
1429         * Set positioning with an object returned by getPositioning().
1430         * @param {Object} posCfg
1431         * @return {Roo.Element} this
1432          */
1433         </span><span class="jsdoc-var">setPositioning </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pc</span><span class="jsdoc-syntax">){
1434             </span><span class="jsdoc-var">this.applyStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pc</span><span class="jsdoc-syntax">);
1435             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pc.right </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;auto&quot;</span><span class="jsdoc-syntax">){
1436                 </span><span class="jsdoc-var">this.dom.style.right </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
1437             }
1438             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pc.bottom </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;auto&quot;</span><span class="jsdoc-syntax">){
1439                 </span><span class="jsdoc-var">this.dom.style.bottom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
1440             }
1441             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1442         },
1443
1444         </span><span class="jsdoc-comment">// private
1445         </span><span class="jsdoc-var">fixDisplay </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1446             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;display&quot;</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">&quot;none&quot;</span><span class="jsdoc-syntax">){
1447                 </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;visibility&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;hidden&quot;</span><span class="jsdoc-syntax">);
1448                 </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;display&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.originalDisplay</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// first try reverting to default
1449                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;display&quot;</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">&quot;none&quot;</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// if that fails, default to block
1450                     </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;display&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;block&quot;</span><span class="jsdoc-syntax">);
1451                 }
1452             }
1453         },
1454
1455         </span><span class="jsdoc-comment">/**
1456          * Quick set left and top adding default units
1457          * @param {String} left The left CSS property value
1458          * @param {String} top The top CSS property value
1459          * @return {Roo.Element} this
1460          */
1461          </span><span class="jsdoc-var">setLeftTop </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">){
1462             </span><span class="jsdoc-var">this.dom.style.left </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">);
1463             </span><span class="jsdoc-var">this.dom.style.top </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">);
1464             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1465         },
1466
1467         </span><span class="jsdoc-comment">/**
1468          * Move this element relative to its current position.
1469          * @param {String} direction Possible values are: &quot;l&quot;,&quot;left&quot; - &quot;r&quot;,&quot;right&quot; - &quot;t&quot;,&quot;top&quot;,&quot;up&quot; - &quot;b&quot;,&quot;bottom&quot;,&quot;down&quot;.
1470          * @param {Number} distance How far to move the element in pixels
1471          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1472          * @return {Roo.Element} this
1473          */
1474          </span><span class="jsdoc-var">move </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">direction</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1475             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getXY</span><span class="jsdoc-syntax">();
1476             </span><span class="jsdoc-var">direction </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">direction.toLowerCase</span><span class="jsdoc-syntax">();
1477             </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">direction</span><span class="jsdoc-syntax">){
1478                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;l&quot;</span><span class="jsdoc-syntax">:
1479                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">:
1480                     </span><span class="jsdoc-var">this.moveTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0]-</span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1], </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2));
1481                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1482                </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;r&quot;</span><span class="jsdoc-syntax">:
1483                </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;right&quot;</span><span class="jsdoc-syntax">:
1484                     </span><span class="jsdoc-var">this.moveTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0]+</span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1], </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2));
1485                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1486                </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;t&quot;</span><span class="jsdoc-syntax">:
1487                </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">:
1488                </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;up&quot;</span><span class="jsdoc-syntax">:
1489                     </span><span class="jsdoc-var">this.moveTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0], </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]-</span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2));
1490                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1491                </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;b&quot;</span><span class="jsdoc-syntax">:
1492                </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;bottom&quot;</span><span class="jsdoc-syntax">:
1493                </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;down&quot;</span><span class="jsdoc-syntax">:
1494                     </span><span class="jsdoc-var">this.moveTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0], </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]+</span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2));
1495                     </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1496             }
1497             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1498         },
1499
1500         </span><span class="jsdoc-comment">/**
1501          *  Store the current overflow setting and clip overflow on the element - use {@link #unclip} to remove
1502          * @return {Roo.Element} this
1503          */
1504         </span><span class="jsdoc-var">clip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1505             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isClipped</span><span class="jsdoc-syntax">){
1506                </span><span class="jsdoc-var">this.isClipped </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1507                </span><span class="jsdoc-var">this.originalClip </span><span class="jsdoc-syntax">= {
1508                    </span><span class="jsdoc-string">&quot;o&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow&quot;</span><span class="jsdoc-syntax">),
1509                    </span><span class="jsdoc-string">&quot;x&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow-x&quot;</span><span class="jsdoc-syntax">),
1510                    </span><span class="jsdoc-string">&quot;y&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow-y&quot;</span><span class="jsdoc-syntax">)
1511                };
1512                </span><span class="jsdoc-var">this.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;hidden&quot;</span><span class="jsdoc-syntax">);
1513                </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow-x&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;hidden&quot;</span><span class="jsdoc-syntax">);
1514                </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow-y&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;hidden&quot;</span><span class="jsdoc-syntax">);
1515             }
1516             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1517         },
1518
1519         </span><span class="jsdoc-comment">/**
1520          *  Return clipping (overflow) to original clipping before clip() was called
1521          * @return {Roo.Element} this
1522          */
1523         </span><span class="jsdoc-var">unclip </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1524             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.isClipped</span><span class="jsdoc-syntax">){
1525                 </span><span class="jsdoc-var">this.isClipped </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1526                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">o </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.originalClip</span><span class="jsdoc-syntax">;
1527                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o.o</span><span class="jsdoc-syntax">){</span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o.o</span><span class="jsdoc-syntax">);}
1528                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o.x</span><span class="jsdoc-syntax">){</span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow-x&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o.x</span><span class="jsdoc-syntax">);}
1529                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o.y</span><span class="jsdoc-syntax">){</span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow-y&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o.y</span><span class="jsdoc-syntax">);}
1530             }
1531             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1532         },
1533
1534
1535         </span><span class="jsdoc-comment">/**
1536          * Gets the x,y coordinates specified by the anchor position on the element.
1537          * @param {String} anchor (optional) The specified anchor position (defaults to &quot;c&quot;).  See {@link #alignTo} for details on supported anchor positions.
1538          * @param {Object} size (optional) An object containing the size to use for calculating anchor position
1539          *                       {width: (target width), height: (target height)} (defaults to the element's current size)
1540          * @param {Boolean} local (optional) True to get the local (element top/left-relative) anchor position instead of page coordinates
1541          * @return {Array} [x, y] An array containing the element's x and y coordinates
1542          */
1543         </span><span class="jsdoc-var">getAnchorXY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">anchor</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">){
1544             </span><span class="jsdoc-comment">//Passing a different size is useful for pre-calculating anchors,
1545             //especially for anchored animations that change the el size.
1546
1547             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">vp </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1548             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">){
1549                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
1550                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document.body </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">){
1551                     </span><span class="jsdoc-var">vp </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1552                     </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">D.getViewWidth</span><span class="jsdoc-syntax">(); </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">D.getViewHeight</span><span class="jsdoc-syntax">();
1553                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1554                     </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getWidth</span><span class="jsdoc-syntax">(); </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHeight</span><span class="jsdoc-syntax">();
1555                 }
1556             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1557                 </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">s.width</span><span class="jsdoc-syntax">;  </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">s.height</span><span class="jsdoc-syntax">;
1558             }
1559             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.round</span><span class="jsdoc-syntax">;
1560             </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">anchor </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">&quot;tl&quot;</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.toLowerCase</span><span class="jsdoc-syntax">()){
1561                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;c&quot;</span><span class="jsdoc-syntax">:
1562                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">*</span><span class="jsdoc-var">.5</span><span class="jsdoc-syntax">);
1563                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">*</span><span class="jsdoc-var">.5</span><span class="jsdoc-syntax">);
1564                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1565                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;t&quot;</span><span class="jsdoc-syntax">:
1566                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">*</span><span class="jsdoc-var">.5</span><span class="jsdoc-syntax">);
1567                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= 0;
1568                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1569                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;l&quot;</span><span class="jsdoc-syntax">:
1570                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= 0;
1571                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">*</span><span class="jsdoc-var">.5</span><span class="jsdoc-syntax">);
1572                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1573                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;r&quot;</span><span class="jsdoc-syntax">:
1574                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
1575                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">*</span><span class="jsdoc-var">.5</span><span class="jsdoc-syntax">);
1576                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1577                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;b&quot;</span><span class="jsdoc-syntax">:
1578                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">*</span><span class="jsdoc-var">.5</span><span class="jsdoc-syntax">);
1579                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
1580                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1581                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;tl&quot;</span><span class="jsdoc-syntax">:
1582                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= 0;
1583                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= 0;
1584                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1585                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;bl&quot;</span><span class="jsdoc-syntax">:
1586                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= 0;
1587                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
1588                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1589                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;br&quot;</span><span class="jsdoc-syntax">:
1590                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
1591                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
1592                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1593                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;tr&quot;</span><span class="jsdoc-syntax">:
1594                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
1595                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= 0;
1596                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
1597             }
1598             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">local </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
1599                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">];
1600             }
1601             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">vp</span><span class="jsdoc-syntax">){
1602                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">sc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getScroll</span><span class="jsdoc-syntax">();
1603                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">sc.left</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">sc.top</span><span class="jsdoc-syntax">];
1604             }
1605             </span><span class="jsdoc-comment">//Add the element's offset xy
1606             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">o </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getXY</span><span class="jsdoc-syntax">();
1607             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[0], </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[1]];
1608         },
1609
1610         </span><span class="jsdoc-comment">/**
1611          * Gets the x,y coordinates to align this element with another element. See {@link #alignTo} for more info on the
1612          * supported position values.
1613          * @param {String/HTMLElement/Roo.Element} element The element to align to.
1614          * @param {String} position The position to align to.
1615          * @param {Array} offsets (optional) Offset the positioning by [x, y]
1616          * @return {Array} [x, y]
1617          */
1618         </span><span class="jsdoc-var">getAlignToXY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">)
1619         {
1620             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
1621             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
1622             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el.dom</span><span class="jsdoc-syntax">){
1623                 </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Element.alignTo with an element that doesn't exist&quot;</span><span class="jsdoc-syntax">;
1624             }
1625             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">//constrain to viewport
1626             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p1 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">p2 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
1627             </span><span class="jsdoc-var">o </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">o </span><span class="jsdoc-syntax">|| [0,0];
1628
1629             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">){
1630                 </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;tl-bl&quot;</span><span class="jsdoc-syntax">;
1631             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;?&quot;</span><span class="jsdoc-syntax">){
1632                 </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;tl-bl?&quot;</span><span class="jsdoc-syntax">;
1633             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p.indexOf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;-&quot;</span><span class="jsdoc-syntax">) == -1){
1634                 </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;tl-&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">;
1635             }
1636             </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p.toLowerCase</span><span class="jsdoc-syntax">();
1637             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">m </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p.match</span><span class="jsdoc-syntax">(/^([a-z]+)-([a-z]+)(\?)?$/);
1638             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">){
1639                </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Element.alignTo with an invalid alignment &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">;
1640             }
1641             </span><span class="jsdoc-var">p1 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">[1]; </span><span class="jsdoc-var">p2 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">[2]; </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= !!</span><span class="jsdoc-var">m</span><span class="jsdoc-syntax">[3];
1642
1643             </span><span class="jsdoc-comment">//Subtract the aligned el's internal xy from the target's offset xy
1644             //plus custom offset to get the aligned el's new offset xy
1645             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">a1 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getAnchorXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p1</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
1646             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">a2 </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.getAnchorXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p2</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
1647             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">a2</span><span class="jsdoc-syntax">[0] - </span><span class="jsdoc-var">a1</span><span class="jsdoc-syntax">[0] + </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[0];
1648             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">a2</span><span class="jsdoc-syntax">[1] - </span><span class="jsdoc-var">a1</span><span class="jsdoc-syntax">[1] + </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[1];
1649             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">){
1650                 </span><span class="jsdoc-comment">//constrain the aligned el to viewport if necessary
1651                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getWidth</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getHeight</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.getRegion</span><span class="jsdoc-syntax">();
1652                 </span><span class="jsdoc-comment">// 5px of margin for ie
1653                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">D.getViewWidth</span><span class="jsdoc-syntax">()-5, </span><span class="jsdoc-var">dh </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">D.getViewHeight</span><span class="jsdoc-syntax">()-5;
1654
1655                 </span><span class="jsdoc-comment">//If we are at a viewport boundary and the aligned el is anchored on a target border that is
1656                 //perpendicular to the vp border, allow the aligned el to slide on that border,
1657                 //otherwise swap the aligned el to the opposite border of the target.
1658                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p1y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p1.charAt</span><span class="jsdoc-syntax">(0), </span><span class="jsdoc-var">p1x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p1.charAt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p1.length</span><span class="jsdoc-syntax">-1);
1659                </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p2y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p2.charAt</span><span class="jsdoc-syntax">(0), </span><span class="jsdoc-var">p2x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p2.charAt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p2.length</span><span class="jsdoc-syntax">-1);
1660                </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">swapY </span><span class="jsdoc-syntax">= ((</span><span class="jsdoc-var">p1y</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;t&quot; </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p2y</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;b&quot;</span><span class="jsdoc-syntax">) || (</span><span class="jsdoc-var">p1y</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;b&quot; </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p2y</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;t&quot;</span><span class="jsdoc-syntax">)  );
1661                </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">swapX </span><span class="jsdoc-syntax">= ((</span><span class="jsdoc-var">p1x</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;r&quot; </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p2x</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;l&quot;</span><span class="jsdoc-syntax">) || (</span><span class="jsdoc-var">p1x</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;l&quot; </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p2x</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;r&quot;</span><span class="jsdoc-syntax">));
1662
1663                </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">doc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">;
1664                </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">scrollX </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">doc.documentElement.scrollLeft </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">doc.body.scrollLeft </span><span class="jsdoc-syntax">|| 0)+5;
1665                </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">scrollY </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">doc.documentElement.scrollTop </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">doc.body.scrollTop </span><span class="jsdoc-syntax">|| 0)+5;
1666
1667                </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">dw </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">scrollX</span><span class="jsdoc-syntax">){
1668                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">swapX </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">r.left</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">dw</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">scrollX</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
1669                 }
1670                </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">scrollX</span><span class="jsdoc-syntax">){
1671                    </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">swapX </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">r.right </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">scrollX</span><span class="jsdoc-syntax">;
1672                }
1673                </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">dh </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">scrollY</span><span class="jsdoc-syntax">){
1674                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">swapY </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">r.top</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">dh</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">scrollY</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
1675                 }
1676                </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">scrollY</span><span class="jsdoc-syntax">){
1677                    </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">swapY </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">r.bottom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">scrollY</span><span class="jsdoc-syntax">;
1678                }
1679             }
1680             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">];
1681         },
1682
1683         </span><span class="jsdoc-comment">// private
1684         </span><span class="jsdoc-var">getConstrainToXY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1685             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">os </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">bottom</span><span class="jsdoc-syntax">:0, </span><span class="jsdoc-var">right</span><span class="jsdoc-syntax">: 0};
1686
1687             </span><span class="jsdoc-keyword">return function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offsets</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">proposedXY</span><span class="jsdoc-syntax">){
1688                 </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
1689                 </span><span class="jsdoc-var">offsets </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">offsets </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.applyIf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">offsets</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">os</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">os</span><span class="jsdoc-syntax">;
1690
1691                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">vw</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">vh</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">vx </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">vy </span><span class="jsdoc-syntax">= 0;
1692                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.dom </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document.body </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">el.dom </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">){
1693                     </span><span class="jsdoc-var">vw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Dom.getViewWidth</span><span class="jsdoc-syntax">();
1694                     </span><span class="jsdoc-var">vh </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.lib.Dom.getViewHeight</span><span class="jsdoc-syntax">();
1695                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
1696                     </span><span class="jsdoc-var">vw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.dom.clientWidth</span><span class="jsdoc-syntax">;
1697                     </span><span class="jsdoc-var">vh </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.dom.clientHeight</span><span class="jsdoc-syntax">;
1698                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
1699                         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">vxy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.getXY</span><span class="jsdoc-syntax">();
1700                         </span><span class="jsdoc-var">vx </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">vxy</span><span class="jsdoc-syntax">[0];
1701                         </span><span class="jsdoc-var">vy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">vxy</span><span class="jsdoc-syntax">[1];
1702                     }
1703                 }
1704
1705                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">s </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.getScroll</span><span class="jsdoc-syntax">();
1706
1707                 </span><span class="jsdoc-var">vx </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">offsets.left </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">s.left</span><span class="jsdoc-syntax">;
1708                 </span><span class="jsdoc-var">vy </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">offsets.top </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">s.top</span><span class="jsdoc-syntax">;
1709
1710                 </span><span class="jsdoc-var">vw </span><span class="jsdoc-syntax">-= </span><span class="jsdoc-var">offsets.right</span><span class="jsdoc-syntax">;
1711                 </span><span class="jsdoc-var">vh </span><span class="jsdoc-syntax">-= </span><span class="jsdoc-var">offsets.bottom</span><span class="jsdoc-syntax">;
1712
1713                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">vr </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">vx</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">vw</span><span class="jsdoc-syntax">;
1714                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">vb </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">vy</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">vh</span><span class="jsdoc-syntax">;
1715
1716                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">proposedXY </span><span class="jsdoc-syntax">|| (!</span><span class="jsdoc-var">local </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.getXY</span><span class="jsdoc-syntax">() : [</span><span class="jsdoc-var">this.getLeft</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">this.getTop</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)]);
1717                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0], </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1];
1718                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.offsetWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.offsetHeight</span><span class="jsdoc-syntax">;
1719
1720                 </span><span class="jsdoc-comment">// only move it if it needs it
1721                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">moved </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1722
1723                 </span><span class="jsdoc-comment">// first validate right/bottom
1724                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">vr</span><span class="jsdoc-syntax">){
1725                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">vr </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
1726                     </span><span class="jsdoc-var">moved </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1727                 }
1728                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">) &gt; </span><span class="jsdoc-var">vb</span><span class="jsdoc-syntax">){
1729                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">vb </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
1730                     </span><span class="jsdoc-var">moved </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1731                 }
1732                 </span><span class="jsdoc-comment">// then make sure top/left isn't negative
1733                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">vx</span><span class="jsdoc-syntax">){
1734                     </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">vx</span><span class="jsdoc-syntax">;
1735                     </span><span class="jsdoc-var">moved </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1736                 }
1737                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">vy</span><span class="jsdoc-syntax">){
1738                     </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">vy</span><span class="jsdoc-syntax">;
1739                     </span><span class="jsdoc-var">moved </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
1740                 }
1741                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">moved </span><span class="jsdoc-syntax">? [</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">] : </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1742             };
1743         }(),
1744
1745         </span><span class="jsdoc-comment">// private
1746         </span><span class="jsdoc-var">adjustForConstraints </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">parent</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offsets</span><span class="jsdoc-syntax">){
1747             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getConstrainToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parent </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offsets</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">) ||  </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">;
1748         },
1749
1750         </span><span class="jsdoc-comment">/**
1751          * Aligns this element with another element relative to the specified anchor points. If the other element is the
1752          * document it aligns it to the viewport.
1753          * The position parameter is optional, and can be specified in any one of the following formats:
1754          * &lt;ul&gt;
1755          *   &lt;li&gt;&lt;b&gt;Blank&lt;/b&gt;: Defaults to aligning the element's top-left corner to the target's bottom-left corner (&quot;tl-bl&quot;).&lt;/li&gt;
1756          *   &lt;li&gt;&lt;b&gt;One anchor (deprecated)&lt;/b&gt;: The passed anchor position is used as the target element's anchor point.
1757          *       The element being aligned will position its top-left corner (tl) to that point.  &lt;i&gt;This method has been
1758          *       deprecated in favor of the newer two anchor syntax below&lt;/i&gt;.&lt;/li&gt;
1759          *   &lt;li&gt;&lt;b&gt;Two anchors&lt;/b&gt;: If two values from the table below are passed separated by a dash, the first value is used as the
1760          *       element's anchor point, and the second value is used as the target's anchor point.&lt;/li&gt;
1761          * &lt;/ul&gt;
1762          * In addition to the anchor points, the position parameter also supports the &quot;?&quot; character.  If &quot;?&quot; is passed at the end of
1763          * the position string, the element will attempt to align as specified, but the position will be adjusted to constrain to
1764          * the viewport if necessary.  Note that the element being aligned might be swapped to align to a different position than
1765          * that specified in order to enforce the viewport constraints.
1766          * Following are all of the supported anchor positions:
1767     &lt;pre&gt;
1768     Value  Description
1769     -----  -----------------------------
1770     tl     The top left corner (default)
1771     t      The center of the top edge
1772     tr     The top right corner
1773     l      The center of the left edge
1774     c      In the center of the element
1775     r      The center of the right edge
1776     bl     The bottom left corner
1777     b      The center of the bottom edge
1778     br     The bottom right corner
1779     &lt;/pre&gt;
1780     Example Usage:
1781     &lt;pre&gt;&lt;code&gt;
1782     // align el to other-el using the default positioning (&quot;tl-bl&quot;, non-constrained)
1783     el.alignTo(&quot;other-el&quot;);
1784
1785     // align the top left corner of el with the top right corner of other-el (constrained to viewport)
1786     el.alignTo(&quot;other-el&quot;, &quot;tr?&quot;);
1787
1788     // align the bottom right corner of el with the center left edge of other-el
1789     el.alignTo(&quot;other-el&quot;, &quot;br-l?&quot;);
1790
1791     // align the center of el with the bottom left corner of other-el and
1792     // adjust the x position by -6 pixels (and the y position by 0)
1793     el.alignTo(&quot;other-el&quot;, &quot;c-bl&quot;, [-6, 0]);
1794     &lt;/code&gt;&lt;/pre&gt;
1795          * @param {String/HTMLElement/Roo.Element} element The element to align to.
1796          * @param {String} position The position to align to.
1797          * @param {Array} offsets (optional) Offset the positioning by [x, y]
1798          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1799          * @return {Roo.Element} this
1800          */
1801         </span><span class="jsdoc-var">alignTo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">element</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offsets</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1802             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">element</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offsets</span><span class="jsdoc-syntax">);
1803             </span><span class="jsdoc-var">this.setXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 3));
1804             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1805         },
1806
1807         </span><span class="jsdoc-comment">/**
1808          * Anchors an element to another element and realigns it when the window is resized.
1809          * @param {String/HTMLElement/Roo.Element} element The element to align to.
1810          * @param {String} position The position to align to.
1811          * @param {Array} offsets (optional) Offset the positioning by [x, y]
1812          * @param {Boolean/Object} animate (optional) True for the default animation or a standard Element animation config object
1813          * @param {Boolean/Number} monitorScroll (optional) True to monitor body scroll and reposition. If this parameter
1814          * is a number, it is used as the buffer delay (defaults to 50ms).
1815          * @param {Function} callback The function to call after the animation finishes
1816          * @return {Roo.Element} this
1817          */
1818         </span><span class="jsdoc-var">anchorTo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">alignment</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offsets</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">monitorScroll</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">){
1819             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">action </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1820                 </span><span class="jsdoc-var">this.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">alignment</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">offsets</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">);
1821                 </span><span class="jsdoc-var">Roo.callback</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
1822             };
1823             </span><span class="jsdoc-var">Roo.EventManager.onWindowResize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">action</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
1824             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">tm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">monitorScroll</span><span class="jsdoc-syntax">;
1825             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tm </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">){
1826                 </span><span class="jsdoc-var">Roo.EventManager.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">window</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'scroll'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">action</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">,
1827                     {</span><span class="jsdoc-var">buffer</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">tm </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'number' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">monitorScroll </span><span class="jsdoc-syntax">: 50});
1828             }
1829             </span><span class="jsdoc-var">action.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// align immediately
1830             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1831         },
1832         </span><span class="jsdoc-comment">/**
1833          * Clears any opacity settings from this element. Required in some cases for IE.
1834          * @return {Roo.Element} this
1835          */
1836         </span><span class="jsdoc-var">clearOpacity </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1837             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">window.ActiveXObject</span><span class="jsdoc-syntax">) {
1838                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">this.dom.style.filter </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'string' </span><span class="jsdoc-syntax">&amp;&amp; (/alpha/i)</span><span class="jsdoc-var">.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.style.filter</span><span class="jsdoc-syntax">)){
1839                     </span><span class="jsdoc-var">this.dom.style.filter </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
1840                 }
1841             } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
1842                 </span><span class="jsdoc-var">this.dom.style.opacity </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
1843                 </span><span class="jsdoc-var">this.dom.style</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">&quot;-moz-opacity&quot;</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
1844                 </span><span class="jsdoc-var">this.dom.style</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">&quot;-khtml-opacity&quot;</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
1845             }
1846             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1847         },
1848
1849         </span><span class="jsdoc-comment">/**
1850          * Hide this element - Uses display mode to determine whether to use &quot;display&quot; or &quot;visibility&quot;. See {@link #setVisible}.
1851          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1852          * @return {Roo.Element} this
1853          */
1854         </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1855             </span><span class="jsdoc-var">this.setVisible</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 0));
1856             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1857         },
1858
1859         </span><span class="jsdoc-comment">/**
1860         * Show this element - Uses display mode to determine whether to use &quot;display&quot; or &quot;visibility&quot;. See {@link #setVisible}.
1861         * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
1862          * @return {Roo.Element} this
1863          */
1864         </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
1865             </span><span class="jsdoc-var">this.setVisible</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 0));
1866             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1867         },
1868
1869         </span><span class="jsdoc-comment">/**
1870          * @private Test if size has a unit, otherwise appends the default
1871          */
1872         </span><span class="jsdoc-var">addUnits </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">){
1873             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.Element.addUnits</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.defaultUnit</span><span class="jsdoc-syntax">);
1874         },
1875
1876         </span><span class="jsdoc-comment">/**
1877          * Temporarily enables offsets (width,height,x,y) for an element with display:none, use endMeasure() when done.
1878          * @return {Roo.Element} this
1879          */
1880         </span><span class="jsdoc-var">beginMeasure </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1881             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
1882             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.offsetWidth </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">el.offsetHeight</span><span class="jsdoc-syntax">){
1883                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// offsets work already
1884             </span><span class="jsdoc-syntax">}
1885             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">changed </span><span class="jsdoc-syntax">= [];
1886             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// start with this element
1887             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">((!</span><span class="jsdoc-var">el.offsetWidth </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">el.offsetHeight</span><span class="jsdoc-syntax">) &amp;&amp; </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p.tagName </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">){
1888                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">pe </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">);
1889                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">pe.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'display'</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'none'</span><span class="jsdoc-syntax">){
1890                     </span><span class="jsdoc-var">changed.push</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">p</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">visibility</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">pe.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;visibility&quot;</span><span class="jsdoc-syntax">)});
1891                     </span><span class="jsdoc-var">p.style.visibility </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;hidden&quot;</span><span class="jsdoc-syntax">;
1892                     </span><span class="jsdoc-var">p.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;block&quot;</span><span class="jsdoc-syntax">;
1893                 }
1894                 </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">p.parentNode</span><span class="jsdoc-syntax">;
1895             }
1896             </span><span class="jsdoc-var">this._measureChanged </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">changed</span><span class="jsdoc-syntax">;
1897             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1898
1899         },
1900
1901         </span><span class="jsdoc-comment">/**
1902          * Restores displays to before beginMeasure was called
1903          * @return {Roo.Element} this
1904          */
1905         </span><span class="jsdoc-var">endMeasure </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1906             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">changed </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this._measureChanged</span><span class="jsdoc-syntax">;
1907             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">changed</span><span class="jsdoc-syntax">){
1908                 </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">changed.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">++) {
1909                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">changed</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">];
1910                     </span><span class="jsdoc-var">r.el.style.visibility </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">r.visibility</span><span class="jsdoc-syntax">;
1911                     </span><span class="jsdoc-var">r.el.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;none&quot;</span><span class="jsdoc-syntax">;
1912                 }
1913                 </span><span class="jsdoc-var">this._measureChanged </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
1914             }
1915             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1916         },
1917
1918         </span><span class="jsdoc-comment">/**
1919         * Update the innerHTML of this element, optionally searching for and processing scripts
1920         * @param {String} html The new HTML
1921         * @param {Boolean} loadScripts (optional) true to look for and process scripts
1922         * @param {Function} callback For async script loading you can be noticed when the update completes
1923         * @return {Roo.Element} this
1924          */
1925         </span><span class="jsdoc-var">update </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">loadScripts</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">){
1926             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;undefined&quot;</span><span class="jsdoc-syntax">){
1927                 </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">;
1928             }
1929             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">loadScripts </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
1930                 </span><span class="jsdoc-var">this.dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">;
1931                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">callback </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;function&quot;</span><span class="jsdoc-syntax">){
1932                     </span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">();
1933                 }
1934                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1935             }
1936             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
1937             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
1938
1939             </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">'&lt;span id=&quot;' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'&quot;&gt;&lt;/span&gt;'</span><span class="jsdoc-syntax">;
1940
1941             </span><span class="jsdoc-var">E.onAvailable</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1942                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">hd </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.getElementsByTagName</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;head&quot;</span><span class="jsdoc-syntax">)[0];
1943                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">re </span><span class="jsdoc-syntax">= /(?:&lt;script([^&gt;]*)?&gt;)((\n|\r|.)*?)(?:&lt;\/script&gt;)/ig;
1944                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">srcRe </span><span class="jsdoc-syntax">= /\ssrc=([\'\&quot;])(.*?)\1/i;
1945                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">typeRe </span><span class="jsdoc-syntax">= /\stype=([\'\&quot;])(.*?)\1/i;
1946
1947                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">match</span><span class="jsdoc-syntax">;
1948                 </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">match </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">re.exec</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">)){
1949                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">attrs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">match</span><span class="jsdoc-syntax">[1];
1950                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">srcMatch </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">attrs </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">attrs.match</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">srcRe</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
1951                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">srcMatch </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">srcMatch</span><span class="jsdoc-syntax">[2]){
1952                        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">s </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;script&quot;</span><span class="jsdoc-syntax">);
1953                        </span><span class="jsdoc-var">s.src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">srcMatch</span><span class="jsdoc-syntax">[2];
1954                        </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">typeMatch </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">attrs.match</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">typeRe</span><span class="jsdoc-syntax">);
1955                        </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">typeMatch </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">typeMatch</span><span class="jsdoc-syntax">[2]){
1956                            </span><span class="jsdoc-var">s.type </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">typeMatch</span><span class="jsdoc-syntax">[2];
1957                        }
1958                        </span><span class="jsdoc-var">hd.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">);
1959                     }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">match</span><span class="jsdoc-syntax">[2] &amp;&amp; </span><span class="jsdoc-var">match</span><span class="jsdoc-syntax">[2]</span><span class="jsdoc-var">.length </span><span class="jsdoc-syntax">&gt; 0){
1960                         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">window.execScript</span><span class="jsdoc-syntax">) {
1961                            </span><span class="jsdoc-var">window.execScript</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">match</span><span class="jsdoc-syntax">[2]);
1962                         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
1963                             </span><span class="jsdoc-comment">/**
1964                              * eval:var:id
1965                              * eval:var:dom
1966                              * eval:var:html
1967                              *
1968                              */
1969                            </span><span class="jsdoc-var">window.eval</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">match</span><span class="jsdoc-syntax">[2]);
1970                         }
1971                     }
1972                 }
1973                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.getElementById</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">);
1974                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){</span><span class="jsdoc-var">el.parentNode.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);}
1975                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">callback </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;function&quot;</span><span class="jsdoc-syntax">){
1976                     </span><span class="jsdoc-var">callback</span><span class="jsdoc-syntax">();
1977                 }
1978             });
1979             </span><span class="jsdoc-var">dom.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">html.replace</span><span class="jsdoc-syntax">(/(?:&lt;script.*?&gt;)((\n|\r|.)*?)(?:&lt;\/script&gt;)/ig, </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">);
1980             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1981         },
1982
1983         </span><span class="jsdoc-comment">/**
1984          * Direct access to the UpdateManager update() method (takes the same parameters).
1985          * @param {String/Function} url The url for this request or a function to call to get the url
1986          * @param {String/Object} params (optional) The parameters to pass as either a url encoded string &quot;param1=1&amp;amp;param2=2&quot; or an object {param1: 1, param2: 2}
1987          * @param {Function} callback (optional) Callback when transaction is complete - called with signature (oElement, bSuccess)
1988          * @param {Boolean} discardUrl (optional) By default when you execute an update the defaultUrl is changed to the last used url. If true, it will not store the url.
1989          * @return {Roo.Element} this
1990          */
1991         </span><span class="jsdoc-var">load </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
1992             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">um </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getUpdateManager</span><span class="jsdoc-syntax">();
1993             </span><span class="jsdoc-var">um.update.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">um</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">);
1994             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
1995         },
1996
1997         </span><span class="jsdoc-comment">/**
1998         * Gets this element's UpdateManager
1999         * @return {Roo.UpdateManager} The UpdateManager
2000         */
2001         </span><span class="jsdoc-var">getUpdateManager </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2002             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.updateManager</span><span class="jsdoc-syntax">){
2003                 </span><span class="jsdoc-var">this.updateManager </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.UpdateManager</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
2004             }
2005             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.updateManager</span><span class="jsdoc-syntax">;
2006         },
2007
2008         </span><span class="jsdoc-comment">/**
2009          * Disables text selection for this element (normalized across browsers)
2010          * @return {Roo.Element} this
2011          */
2012         </span><span class="jsdoc-var">unselectable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2013             </span><span class="jsdoc-var">this.dom.unselectable </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;on&quot;</span><span class="jsdoc-syntax">;
2014             </span><span class="jsdoc-var">this.swallowEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;selectstart&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
2015             </span><span class="jsdoc-var">this.applyStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;-moz-user-select:none;-khtml-user-select:none;&quot;</span><span class="jsdoc-syntax">);
2016             </span><span class="jsdoc-var">this.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;x-unselectable&quot;</span><span class="jsdoc-syntax">);
2017             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2018         },
2019
2020         </span><span class="jsdoc-comment">/**
2021         * Calculates the x, y to center this element on the screen
2022         * @return {Array} The x, y values [x, y]
2023         */
2024         </span><span class="jsdoc-var">getCenterXY </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2025             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getAlignToXY</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'c-c'</span><span class="jsdoc-syntax">);
2026         },
2027
2028         </span><span class="jsdoc-comment">/**
2029         * Centers the Element in either the viewport, or another Element.
2030         * @param {String/HTMLElement/Roo.Element} centerIn (optional) The element in which to center the element.
2031         */
2032         </span><span class="jsdoc-var">center </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">centerIn</span><span class="jsdoc-syntax">){
2033             </span><span class="jsdoc-var">this.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">centerIn </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'c-c'</span><span class="jsdoc-syntax">);
2034             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2035         },
2036
2037         </span><span class="jsdoc-comment">/**
2038          * Tests various css rules/browsers to determine if this element uses a border box
2039          * @return {Boolean}
2040          */
2041         </span><span class="jsdoc-var">isBorderBox </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2042             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">noBoxAdjust</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.dom.tagName.toLowerCase</span><span class="jsdoc-syntax">()] || </span><span class="jsdoc-var">Roo.isBorderBox</span><span class="jsdoc-syntax">;
2043         },
2044
2045         </span><span class="jsdoc-comment">/**
2046          * Return a box {x, y, width, height} that can be used to set another elements
2047          * size/location to match this element.
2048          * @param {Boolean} contentBox (optional) If true a box for the content of the element is returned.
2049          * @param {Boolean} local (optional) If true the element's left and top are returned instead of page x/y.
2050          * @return {Object} box An object in the format {x, y, width, height}
2051          */
2052         </span><span class="jsdoc-var">getBox </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">contentBox</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
2053             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">;
2054             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">local</span><span class="jsdoc-syntax">){
2055                 </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getXY</span><span class="jsdoc-syntax">();
2056             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2057                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">left </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">), 10) || 0;
2058                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">top </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">), 10) || 0;
2059                 </span><span class="jsdoc-var">xy </span><span class="jsdoc-syntax">= [</span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">];
2060             }
2061             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.offsetWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.offsetHeight</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">bx</span><span class="jsdoc-syntax">;
2062             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">contentBox</span><span class="jsdoc-syntax">){
2063                 </span><span class="jsdoc-var">bx </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0], </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1], 0: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0], 1: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1], </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">};
2064             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2065                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;l&quot;</span><span class="jsdoc-syntax">)+</span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;l&quot;</span><span class="jsdoc-syntax">);
2066                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">r </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;r&quot;</span><span class="jsdoc-syntax">)+</span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;r&quot;</span><span class="jsdoc-syntax">);
2067                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;t&quot;</span><span class="jsdoc-syntax">)+</span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;t&quot;</span><span class="jsdoc-syntax">);
2068                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">b </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;b&quot;</span><span class="jsdoc-syntax">)+</span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;b&quot;</span><span class="jsdoc-syntax">);
2069                 </span><span class="jsdoc-var">bx </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0]+</span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]+</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">, 0: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[0]+</span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">, 1: </span><span class="jsdoc-var">xy</span><span class="jsdoc-syntax">[1]+</span><span class="jsdoc-var">t</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">l</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">height</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">-(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">)};
2070             }
2071             </span><span class="jsdoc-var">bx.right </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bx.x </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">bx.width</span><span class="jsdoc-syntax">;
2072             </span><span class="jsdoc-var">bx.bottom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">bx.y </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">bx.height</span><span class="jsdoc-syntax">;
2073             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">bx</span><span class="jsdoc-syntax">;
2074         },
2075
2076         </span><span class="jsdoc-comment">/**
2077          * Returns the sum width of the padding and borders for the passed &quot;sides&quot;. See getBorderWidth()
2078          for more information about the sides.
2079          * @param {String} sides
2080          * @return {Number}
2081          */
2082         </span><span class="jsdoc-var">getFrameWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sides</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">onlyContentBox</span><span class="jsdoc-syntax">){
2083             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">onlyContentBox </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.isBorderBox </span><span class="jsdoc-syntax">? 0 : (</span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sides</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sides</span><span class="jsdoc-syntax">));
2084         },
2085
2086         </span><span class="jsdoc-comment">/**
2087          * Sets the element's box. Use getBox() on another element to get a box obj. If animate is true then width, height, x and y will be animated concurrently.
2088          * @param {Object} box The box to fill {x, y, width, height}
2089          * @param {Boolean} adjust (optional) Whether to adjust for box-model issues automatically
2090          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
2091          * @return {Roo.Element} this
2092          */
2093         </span><span class="jsdoc-var">setBox </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">adjust</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
2094             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">box.width</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">box.height</span><span class="jsdoc-syntax">;
2095             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">adjust </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.autoBoxAdjust</span><span class="jsdoc-syntax">) &amp;&amp; !</span><span class="jsdoc-var">this.isBorderBox</span><span class="jsdoc-syntax">()){
2096                </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">-= (</span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;lr&quot;</span><span class="jsdoc-syntax">));
2097                </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">-= (</span><span class="jsdoc-var">this.getBorderWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-var">this.getPadding</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;tb&quot;</span><span class="jsdoc-syntax">));
2098             }
2099             </span><span class="jsdoc-var">this.setBounds</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">box.x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">box.y</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2));
2100             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2101         },
2102
2103         </span><span class="jsdoc-comment">/**
2104          * Forces the browser to repaint this element
2105          * @return {Roo.Element} this
2106          */
2107          </span><span class="jsdoc-var">repaint </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2108             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
2109             </span><span class="jsdoc-var">this.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;x-repaint&quot;</span><span class="jsdoc-syntax">);
2110             </span><span class="jsdoc-var">setTimeout</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2111                 </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;x-repaint&quot;</span><span class="jsdoc-syntax">);
2112             }, 1);
2113             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2114         },
2115
2116         </span><span class="jsdoc-comment">/**
2117          * Returns an object with properties top, left, right and bottom representing the margins of this element unless sides is passed,
2118          * then it returns the calculated width of the sides (see getPadding)
2119          * @param {String} sides (optional) Any combination of l, r, t, b to get the sum of those sides
2120          * @return {Object/Number}
2121          */
2122         </span><span class="jsdoc-var">getMargins </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">side</span><span class="jsdoc-syntax">){
2123             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">side</span><span class="jsdoc-syntax">){
2124                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{
2125                     </span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;margin-top&quot;</span><span class="jsdoc-syntax">), 10) || 0,
2126                     </span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;margin-left&quot;</span><span class="jsdoc-syntax">), 10) || 0,
2127                     </span><span class="jsdoc-var">bottom</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;margin-bottom&quot;</span><span class="jsdoc-syntax">), 10) || 0,
2128                     </span><span class="jsdoc-var">right</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;margin-right&quot;</span><span class="jsdoc-syntax">), 10) || 0
2129                 };
2130             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2131                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.addStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">side</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">El.margins</span><span class="jsdoc-syntax">);
2132              }
2133         },
2134
2135         </span><span class="jsdoc-comment">// private
2136         </span><span class="jsdoc-var">addStyles </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">sides</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">){
2137             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">val </span><span class="jsdoc-syntax">= 0, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
2138             </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">sides.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">++){
2139                 </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">styles</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">sides.charAt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">)]);
2140                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">){
2141                      </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, 10);
2142                      </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-var">val </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">; }
2143                 }
2144             }
2145             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">val</span><span class="jsdoc-syntax">;
2146         },
2147
2148         </span><span class="jsdoc-comment">/**
2149          * Creates a proxy element of this element
2150          * @param {String/Object} config The class name of the proxy element or a DomHelper config object
2151          * @param {String/HTMLElement} renderTo (optional) The element or element id to render the proxy to (defaults to document.body)
2152          * @param {Boolean} matchBox (optional) True to align and size the proxy to this element now (defaults to false)
2153          * @return {Roo.Element} The new proxy element
2154          */
2155         </span><span class="jsdoc-var">createProxy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">renderTo</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">matchBox</span><span class="jsdoc-syntax">){
2156             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">renderTo</span><span class="jsdoc-syntax">){
2157                 </span><span class="jsdoc-var">renderTo </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">renderTo</span><span class="jsdoc-syntax">);
2158             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2159                 </span><span class="jsdoc-var">renderTo </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">;
2160             }
2161             </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;object&quot; </span><span class="jsdoc-syntax">?
2162                 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">};
2163             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">proxy </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">renderTo</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
2164             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">matchBox</span><span class="jsdoc-syntax">){
2165                </span><span class="jsdoc-var">proxy.setBox</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getBox</span><span class="jsdoc-syntax">());
2166             }
2167             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">proxy</span><span class="jsdoc-syntax">;
2168         },
2169
2170         </span><span class="jsdoc-comment">/**
2171          * Puts a mask over this element to disable user interaction. Requires core.css.
2172          * This method can only be applied to elements which accept child nodes.
2173          * @param {String} msg (optional) A message to display in the mask
2174          * @param {String} msgCls (optional) A css class to apply to the msg element
2175          * @return {Element} The mask  element
2176          */
2177         </span><span class="jsdoc-var">mask </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">msgCls</span><span class="jsdoc-syntax">)
2178         {
2179             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;position&quot;</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">&quot;static&quot; </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.dom.tagName </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-string">'BODY'</span><span class="jsdoc-syntax">){
2180                 </span><span class="jsdoc-var">this.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;position&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;relative&quot;</span><span class="jsdoc-syntax">);
2181             }
2182             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this._mask</span><span class="jsdoc-syntax">){
2183                 </span><span class="jsdoc-var">this._mask </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">&quot;roo-el-mask&quot;</span><span class="jsdoc-syntax">}, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
2184             }
2185
2186             </span><span class="jsdoc-var">this.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;x-masked&quot;</span><span class="jsdoc-syntax">);
2187             </span><span class="jsdoc-var">this._mask.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
2188
2189             </span><span class="jsdoc-comment">// we wander
2190             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">z </span><span class="jsdoc-syntax">= 0;
2191             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
2192             </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">dom.style</span><span class="jsdoc-syntax">) {
2193                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">isNaN</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom.style.zIndex</span><span class="jsdoc-syntax">))) {
2194                     </span><span class="jsdoc-var">z </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">z</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom.style.zIndex</span><span class="jsdoc-syntax">));
2195                 }
2196                 </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dom.parentNode</span><span class="jsdoc-syntax">;
2197             }
2198             </span><span class="jsdoc-comment">// if we are masking the body - then it hides everything..
2199             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document.body</span><span class="jsdoc-syntax">) {
2200                 </span><span class="jsdoc-var">z </span><span class="jsdoc-syntax">= 1000000;
2201                 </span><span class="jsdoc-var">this._mask.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.lib.Dom.getDocumentWidth</span><span class="jsdoc-syntax">());
2202                 </span><span class="jsdoc-var">this._mask.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.lib.Dom.getDocumentHeight</span><span class="jsdoc-syntax">());
2203             }
2204
2205             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">){
2206                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this._maskMsg</span><span class="jsdoc-syntax">){
2207                     </span><span class="jsdoc-var">this._maskMsg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, {
2208                         </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;roo-el-mask-msg&quot;</span><span class="jsdoc-syntax">,
2209                         </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
2210                             {
2211                                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'i'</span><span class="jsdoc-syntax">,
2212                                 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'fa fa-spinner fa-spin'
2213                             </span><span class="jsdoc-syntax">},
2214                             {
2215                                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'div'
2216                             </span><span class="jsdoc-syntax">}
2217                         ]
2218                     }, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
2219                 }
2220                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">mm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this._maskMsg</span><span class="jsdoc-syntax">;
2221                 </span><span class="jsdoc-var">mm.dom.className </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">msgCls </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">&quot;roo-el-mask-msg &quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">msgCls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;roo-el-mask-msg&quot;</span><span class="jsdoc-syntax">;
2222                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">mm.dom.lastChild</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-comment">// weird IE issue?
2223                     </span><span class="jsdoc-var">mm.dom.lastChild.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">;
2224                 }
2225                 </span><span class="jsdoc-var">mm.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
2226                 </span><span class="jsdoc-var">mm.center</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
2227                 </span><span class="jsdoc-var">mm.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'z-index'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">z </span><span class="jsdoc-syntax">+ 102);
2228             }
2229             </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">Roo.isIE7 </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.isStrict</span><span class="jsdoc-syntax">) &amp;&amp; </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'height'</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'auto'</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// ie will not expand full height automatically
2230                 </span><span class="jsdoc-var">this._mask.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getHeight</span><span class="jsdoc-syntax">());
2231             }
2232             </span><span class="jsdoc-var">this._mask.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'z-index'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">z </span><span class="jsdoc-syntax">+ 100);
2233
2234             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this._mask</span><span class="jsdoc-syntax">;
2235         },
2236
2237         </span><span class="jsdoc-comment">/**
2238          * Removes a previously applied mask. If removeEl is true the mask overlay is destroyed, otherwise
2239          * it is cached for reuse.
2240          */
2241         </span><span class="jsdoc-var">unmask </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">removeEl</span><span class="jsdoc-syntax">){
2242             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this._mask</span><span class="jsdoc-syntax">){
2243                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">removeEl </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
2244                     </span><span class="jsdoc-var">this._mask.remove</span><span class="jsdoc-syntax">();
2245                     </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this._mask</span><span class="jsdoc-syntax">;
2246                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this._maskMsg</span><span class="jsdoc-syntax">){
2247                         </span><span class="jsdoc-var">this._maskMsg.remove</span><span class="jsdoc-syntax">();
2248                         </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this._maskMsg</span><span class="jsdoc-syntax">;
2249                     }
2250                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2251                     </span><span class="jsdoc-var">this._mask.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
2252                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this._maskMsg</span><span class="jsdoc-syntax">){
2253                         </span><span class="jsdoc-var">this._maskMsg.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">);
2254                     }
2255                 }
2256             }
2257             </span><span class="jsdoc-var">this.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;x-masked&quot;</span><span class="jsdoc-syntax">);
2258         },
2259
2260         </span><span class="jsdoc-comment">/**
2261          * Returns true if this element is masked
2262          * @return {Boolean}
2263          */
2264         </span><span class="jsdoc-var">isMasked </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2265             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this._mask </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this._mask.isVisible</span><span class="jsdoc-syntax">();
2266         },
2267
2268         </span><span class="jsdoc-comment">/**
2269          * Creates an iframe shim for this element to keep selects and other windowed objects from
2270          * showing through.
2271          * @return {Roo.Element} The new shim element
2272          */
2273         </span><span class="jsdoc-var">createShim </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2274             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'iframe'</span><span class="jsdoc-syntax">);
2275             </span><span class="jsdoc-var">el.frameBorder </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'no'</span><span class="jsdoc-syntax">;
2276             </span><span class="jsdoc-var">el.className </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'roo-shim'</span><span class="jsdoc-syntax">;
2277             </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">Roo.isSecure</span><span class="jsdoc-syntax">){
2278                 </span><span class="jsdoc-var">el.src </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.SSL_SECURE_URL</span><span class="jsdoc-syntax">;
2279             }
2280             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">shim </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">));
2281             </span><span class="jsdoc-var">shim.autoBoxAdjust </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
2282             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">shim</span><span class="jsdoc-syntax">;
2283         },
2284
2285         </span><span class="jsdoc-comment">/**
2286          * Removes this element from the DOM and deletes it from the cache
2287          */
2288         </span><span class="jsdoc-var">remove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2289             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.parentNode</span><span class="jsdoc-syntax">){
2290                 </span><span class="jsdoc-var">this.dom.parentNode.removeChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
2291             }
2292             </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.dom.id</span><span class="jsdoc-syntax">];
2293         },
2294
2295         </span><span class="jsdoc-comment">/**
2296          * Sets up event handlers to add and remove a css class when the mouse is over this element
2297          * @param {String} className
2298          * @param {Boolean} preventFlicker (optional) If set to true, it prevents flickering by filtering
2299          * mouseout events for children elements
2300          * @return {Roo.Element} this
2301          */
2302         </span><span class="jsdoc-var">addClassOnOver </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">preventFlicker</span><span class="jsdoc-syntax">){
2303             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseover&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2304                 </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_internal'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
2305             }, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
2306             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">removeFn </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">){
2307                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">preventFlicker </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">e.within</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">)){
2308                     </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_internal'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
2309                 }
2310             };
2311             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseout&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">removeFn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
2312             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2313         },
2314
2315         </span><span class="jsdoc-comment">/**
2316          * Sets up event handlers to add and remove a css class when this element has the focus
2317          * @param {String} className
2318          * @return {Roo.Element} this
2319          */
2320         </span><span class="jsdoc-var">addClassOnFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">){
2321             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;focus&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2322                 </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_internal'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
2323             }, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
2324             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;blur&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2325                 </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_internal'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
2326             }, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
2327             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2328         },
2329         </span><span class="jsdoc-comment">/**
2330          * Sets up event handlers to add and remove a css class when the mouse is down and then up on this element (a click effect)
2331          * @param {String} className
2332          * @return {Roo.Element} this
2333          */
2334         </span><span class="jsdoc-var">addClassOnClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">){
2335             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
2336             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mousedown&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2337                 </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_internal'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
2338                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">);
2339                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">fn </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2340                     </span><span class="jsdoc-var">Roo.fly</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'_internal'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">className</span><span class="jsdoc-syntax">);
2341                     </span><span class="jsdoc-var">d.removeListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseup&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">);
2342                 };
2343                 </span><span class="jsdoc-var">d.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;mouseup&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">);
2344             });
2345             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2346         },
2347
2348         </span><span class="jsdoc-comment">/**
2349          * Stops the specified event from bubbling and optionally prevents the default action
2350          * @param {String} eventName
2351          * @param {Boolean} preventDefault (optional) true to prevent the default action too
2352          * @return {Roo.Element} this
2353          */
2354         </span><span class="jsdoc-var">swallowEvent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">preventDefault</span><span class="jsdoc-syntax">){
2355             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">fn </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">){
2356                 </span><span class="jsdoc-var">e.stopPropagation</span><span class="jsdoc-syntax">();
2357                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">preventDefault</span><span class="jsdoc-syntax">){
2358                     </span><span class="jsdoc-var">e.preventDefault</span><span class="jsdoc-syntax">();
2359                 }
2360             };
2361             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Array</span><span class="jsdoc-syntax">){
2362                 </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">eventName.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">++){
2363                      </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">);
2364                 }
2365                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2366             }
2367             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eventName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">);
2368             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2369         },
2370
2371         </span><span class="jsdoc-comment">/**
2372          * @private
2373          */
2374         </span><span class="jsdoc-var">fitToParentDelegate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.emptyFn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-comment">// keep a reference to the fitToParent delegate
2375
2376         /**
2377          * Sizes this element to its parent element's dimensions performing
2378          * neccessary box adjustments.
2379          * @param {Boolean} monitorResize (optional) If true maintains the fit when the browser window is resized.
2380          * @param {String/HTMLElment/Element} targetParent (optional) The target parent, default to the parentNode.
2381          * @return {Roo.Element} this
2382          */
2383         </span><span class="jsdoc-var">fitToParent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">monitorResize</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">targetParent</span><span class="jsdoc-syntax">) {
2384           </span><span class="jsdoc-var">Roo.EventManager.removeResizeListener</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fitToParentDelegate</span><span class="jsdoc-syntax">); </span><span class="jsdoc-comment">// always remove previous fitToParent delegate from onWindowResize
2385           </span><span class="jsdoc-var">this.fitToParentDelegate </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.emptyFn</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// remove reference to previous delegate
2386           </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">monitorResize </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.dom.parentNode</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-comment">// check if this Element still exists
2387             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2388           }
2389           </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">targetParent </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.dom.parentNode</span><span class="jsdoc-syntax">);
2390           </span><span class="jsdoc-var">this.setSize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">p.getComputedWidth</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">p.getFrameWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'lr'</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">p.getComputedHeight</span><span class="jsdoc-syntax">() - </span><span class="jsdoc-var">p.getFrameWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tb'</span><span class="jsdoc-syntax">));
2391           </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">monitorResize </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">) {
2392             </span><span class="jsdoc-var">this.fitToParentDelegate </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.fitToParent.createDelegate</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, [</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">targetParent</span><span class="jsdoc-syntax">]);
2393             </span><span class="jsdoc-var">Roo.EventManager.onWindowResize</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fitToParentDelegate</span><span class="jsdoc-syntax">);
2394           }
2395           </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2396         },
2397
2398         </span><span class="jsdoc-comment">/**
2399          * Gets the next sibling, skipping text nodes
2400          * @return {HTMLElement} The next sibling or null
2401          */
2402         </span><span class="jsdoc-var">getNextSibling </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2403             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.nextSibling</span><span class="jsdoc-syntax">;
2404             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">n.nodeType </span><span class="jsdoc-syntax">!= 1){
2405                 </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">n.nextSibling</span><span class="jsdoc-syntax">;
2406             }
2407             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">;
2408         },
2409
2410         </span><span class="jsdoc-comment">/**
2411          * Gets the previous sibling, skipping text nodes
2412          * @return {HTMLElement} The previous sibling or null
2413          */
2414         </span><span class="jsdoc-var">getPrevSibling </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2415             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.previousSibling</span><span class="jsdoc-syntax">;
2416             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">n.nodeType </span><span class="jsdoc-syntax">!= 1){
2417                 </span><span class="jsdoc-var">n </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">n.previousSibling</span><span class="jsdoc-syntax">;
2418             }
2419             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">n</span><span class="jsdoc-syntax">;
2420         },
2421
2422
2423         </span><span class="jsdoc-comment">/**
2424          * Appends the passed element(s) to this element
2425          * @param {String/HTMLElement/Array/Element/CompositeElement} el
2426          * @return {Roo.Element} this
2427          */
2428         </span><span class="jsdoc-var">appendChild</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
2429             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2430             </span><span class="jsdoc-var">el.appendTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
2431             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2432         },
2433
2434         </span><span class="jsdoc-comment">/**
2435          * Creates the passed DomHelper config and appends it to this element or optionally inserts it before the passed child element.
2436          * @param {Object} config DomHelper element config object.  If no tag is specified (e.g., {tag:'input'}) then a div will be
2437          * automatically generated with the specified attributes.
2438          * @param {HTMLElement} insertBefore (optional) a child element of this element
2439          * @param {Boolean} returnDom (optional) true to return the dom node instead of creating an Element
2440          * @return {Roo.Element} The new child element
2441          */
2442         </span><span class="jsdoc-var">createChild</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">insertBefore</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">){
2443             </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">|| {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">};
2444             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">insertBefore</span><span class="jsdoc-syntax">){
2445                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.DomHelper.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">insertBefore</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnDom </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
2446             }
2447             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">Roo.DomHelper</span><span class="jsdoc-syntax">[!</span><span class="jsdoc-var">this.dom.firstChild </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'overwrite' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'append'</span><span class="jsdoc-syntax">](</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">returnDom </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
2448         },
2449
2450         </span><span class="jsdoc-comment">/**
2451          * Appends this element to the passed element
2452          * @param {String/HTMLElement/Element} el The new parent element
2453          * @return {Roo.Element} this
2454          */
2455         </span><span class="jsdoc-var">appendTo</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
2456             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2457             </span><span class="jsdoc-var">el.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
2458             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2459         },
2460
2461         </span><span class="jsdoc-comment">/**
2462          * Inserts this element before the passed element in the DOM
2463          * @param {String/HTMLElement/Element} el The element to insert before
2464          * @return {Roo.Element} this
2465          */
2466         </span><span class="jsdoc-var">insertBefore</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
2467             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2468             </span><span class="jsdoc-var">el.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2469             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2470         },
2471
2472         </span><span class="jsdoc-comment">/**
2473          * Inserts this element after the passed element in the DOM
2474          * @param {String/HTMLElement/Element} el The element to insert after
2475          * @return {Roo.Element} this
2476          */
2477         </span><span class="jsdoc-var">insertAfter</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
2478             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2479             </span><span class="jsdoc-var">el.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el.nextSibling</span><span class="jsdoc-syntax">);
2480             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2481         },
2482
2483         </span><span class="jsdoc-comment">/**
2484          * Inserts (or creates) an element (or DomHelper config) as the first child of the this element
2485          * @param {String/HTMLElement/Element/Object} el The id or element to insert or a DomHelper config to create and insert
2486          * @return {Roo.Element} The new child
2487          */
2488         </span><span class="jsdoc-var">insertFirst</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">){
2489             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">|| {};
2490             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'object' </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">el.nodeType</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// dh config
2491                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.createChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom.firstChild</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">);
2492             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2493                 </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2494                 </span><span class="jsdoc-var">this.dom.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom.firstChild</span><span class="jsdoc-syntax">);
2495                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">!</span><span class="jsdoc-var">returnDom </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
2496             }
2497         },
2498
2499         </span><span class="jsdoc-comment">/**
2500          * Inserts (or creates) the passed element (or DomHelper config) as a sibling of this element
2501          * @param {String/HTMLElement/Element/Object} el The id or element to insert or a DomHelper config to create and insert
2502          * @param {String} where (optional) 'before' or 'after' defaults to before
2503          * @param {Boolean} returnDom (optional) True to return the raw DOM element instead of Roo.Element
2504          * @return {Roo.Element} the inserted Element
2505          */
2506         </span><span class="jsdoc-var">insertSibling</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">){
2507             </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">where.toLowerCase</span><span class="jsdoc-syntax">() : </span><span class="jsdoc-string">'before'</span><span class="jsdoc-syntax">;
2508             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">|| {};
2509             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rt</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">refNode </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'before' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.dom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.dom.nextSibling</span><span class="jsdoc-syntax">;
2510
2511             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'object' </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">el.nodeType</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// dh config
2512                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'after' </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.dom.nextSibling</span><span class="jsdoc-syntax">){
2513                     </span><span class="jsdoc-var">rt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.append</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom.parentNode</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, !</span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">);
2514                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2515                     </span><span class="jsdoc-var">rt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'after' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'insertAfter' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'insertBefore'</span><span class="jsdoc-syntax">](</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, !</span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">);
2516                 }
2517
2518             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2519                 </span><span class="jsdoc-var">rt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom.parentNode.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">),
2520                             </span><span class="jsdoc-var">where </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'before' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.dom </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.dom.nextSibling</span><span class="jsdoc-syntax">);
2521                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">){
2522                     </span><span class="jsdoc-var">rt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rt</span><span class="jsdoc-syntax">);
2523                 }
2524             }
2525             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">rt</span><span class="jsdoc-syntax">;
2526         },
2527
2528         </span><span class="jsdoc-comment">/**
2529          * Creates and wraps this element with another element
2530          * @param {Object} config (optional) DomHelper element config object for the wrapper element or null for an empty div
2531          * @param {Boolean} returnDom (optional) True to return the raw DOM element instead of Roo.Element
2532          * @return {HTMLElement/Element} The newly created wrapper element
2533          */
2534         </span><span class="jsdoc-var">wrap</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">){
2535             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
2536                 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;div&quot;</span><span class="jsdoc-syntax">};
2537             }
2538             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">newEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, !</span><span class="jsdoc-var">returnDom</span><span class="jsdoc-syntax">);
2539             </span><span class="jsdoc-var">newEl.dom </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">newEl.dom.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">newEl.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
2540             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">newEl</span><span class="jsdoc-syntax">;
2541         },
2542
2543         </span><span class="jsdoc-comment">/**
2544          * Replaces the passed element with this element
2545          * @param {String/HTMLElement/Element} el The element to replace
2546          * @return {Roo.Element} this
2547          */
2548         </span><span class="jsdoc-var">replace</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
2549             </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2550             </span><span class="jsdoc-var">this.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2551             </span><span class="jsdoc-var">el.remove</span><span class="jsdoc-syntax">();
2552             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2553         },
2554
2555         </span><span class="jsdoc-comment">/**
2556          * Inserts an html fragment into this element
2557          * @param {String} where Where to insert the html in relation to the this element - beforeBegin, afterBegin, beforeEnd, afterEnd.
2558          * @param {String} html The HTML fragment
2559          * @param {Boolean} returnEl True to return an Roo.Element
2560          * @return {HTMLElement/Roo.Element} The inserted node (or nearest related if more than 1 inserted)
2561          */
2562         </span><span class="jsdoc-var">insertHtml </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">returnEl</span><span class="jsdoc-syntax">){
2563             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomHelper.insertHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">where</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">html</span><span class="jsdoc-syntax">);
2564             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">returnEl </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
2565         },
2566
2567         </span><span class="jsdoc-comment">/**
2568          * Sets the passed attributes as attributes of this element (a style attribute can be a string, object or function)
2569          * @param {Object} o The object with the attributes
2570          * @param {Boolean} useSet (optional) false to override the default setAttribute to use expandos.
2571          * @return {Roo.Element} this
2572          */
2573         </span><span class="jsdoc-var">set </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">useSet</span><span class="jsdoc-syntax">){
2574             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
2575             </span><span class="jsdoc-var">useSet </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">useSet </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? (</span><span class="jsdoc-var">el.setAttribute </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">) : </span><span class="jsdoc-var">useSet</span><span class="jsdoc-syntax">;
2576             </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">attr </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">){
2577                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;style&quot; </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">] == </span><span class="jsdoc-string">&quot;function&quot;</span><span class="jsdoc-syntax">)  { </span><span class="jsdoc-keyword">continue</span><span class="jsdoc-syntax">; }
2578                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">==</span><span class="jsdoc-string">&quot;cls&quot;</span><span class="jsdoc-syntax">){
2579                     </span><span class="jsdoc-var">el.className </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">&quot;cls&quot;</span><span class="jsdoc-syntax">];
2580                 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2581                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">useSet</span><span class="jsdoc-syntax">) {
2582                         </span><span class="jsdoc-var">el.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">]);
2583                     } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
2584                         </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">];
2585                     }
2586                 }
2587             }
2588             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">o.style</span><span class="jsdoc-syntax">){
2589                 </span><span class="jsdoc-var">Roo.DomHelper.applyStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">o.style</span><span class="jsdoc-syntax">);
2590             }
2591             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2592         },
2593
2594         </span><span class="jsdoc-comment">/**
2595          * Convenience method for constructing a KeyMap
2596          * @param {Number/Array/Object/String} key Either a string with the keys to listen for, the numeric key code, array of key codes or an object with the following options:
2597          *                                  {key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}
2598          * @param {Function} fn The function to call
2599          * @param {Object} scope (optional) The scope of the function
2600          * @return {Roo.KeyMap} The KeyMap created
2601          */
2602         </span><span class="jsdoc-var">addKeyListener </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">){
2603             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">;
2604             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">key </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;object&quot; </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">key </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Array</span><span class="jsdoc-syntax">){
2605                 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= {
2606                     </span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">key</span><span class="jsdoc-syntax">,
2607                     </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">,
2608                     </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">scope
2609                 </span><span class="jsdoc-syntax">};
2610             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2611                 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= {
2612                     </span><span class="jsdoc-var">key </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">key.key</span><span class="jsdoc-syntax">,
2613                     </span><span class="jsdoc-var">shift </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">key.shift</span><span class="jsdoc-syntax">,
2614                     </span><span class="jsdoc-var">ctrl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">key.ctrl</span><span class="jsdoc-syntax">,
2615                     </span><span class="jsdoc-var">alt </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">key.alt</span><span class="jsdoc-syntax">,
2616                     </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">,
2617                     </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">scope
2618                 </span><span class="jsdoc-syntax">};
2619             }
2620             </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.KeyMap</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">);
2621         },
2622
2623         </span><span class="jsdoc-comment">/**
2624          * Creates a KeyMap for this element
2625          * @param {Object} config The KeyMap config. See {@link Roo.KeyMap} for more details
2626          * @return {Roo.KeyMap} The KeyMap created
2627          */
2628         </span><span class="jsdoc-var">addKeyMap </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">){
2629             </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.KeyMap</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">);
2630         },
2631
2632         </span><span class="jsdoc-comment">/**
2633          * Returns true if this element is scrollable.
2634          * @return {Boolean}
2635          */
2636          </span><span class="jsdoc-var">isScrollable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2637             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
2638             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">dom.scrollHeight </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">dom.clientHeight </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">dom.scrollWidth </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">dom.clientWidth</span><span class="jsdoc-syntax">;
2639         },
2640
2641         </span><span class="jsdoc-comment">/**
2642          * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().
2643          * @param {String} side Either &quot;left&quot; for scrollLeft values or &quot;top&quot; for scrollTop values.
2644          * @param {Number} value The new scroll value
2645          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
2646          * @return {Element} this
2647          */
2648
2649         </span><span class="jsdoc-var">scrollTo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">side</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
2650             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">side.toLowerCase</span><span class="jsdoc-syntax">() == </span><span class="jsdoc-string">&quot;left&quot; </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">&quot;scrollLeft&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;scrollTop&quot;</span><span class="jsdoc-syntax">;
2651             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">animate </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">A</span><span class="jsdoc-syntax">){
2652                 </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">prop</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">;
2653             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2654                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">to </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">prop </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;scrollLeft&quot; </span><span class="jsdoc-syntax">? [</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dom.scrollTop</span><span class="jsdoc-syntax">] : [</span><span class="jsdoc-var">this.dom.scrollLeft</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">];
2655                 </span><span class="jsdoc-var">this.anim</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">scroll</span><span class="jsdoc-syntax">: {</span><span class="jsdoc-string">&quot;to&quot;</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">to</span><span class="jsdoc-syntax">}}, </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2), </span><span class="jsdoc-string">'scroll'</span><span class="jsdoc-syntax">);
2656             }
2657             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
2658         },
2659
2660         </span><span class="jsdoc-comment">/**
2661          * Scrolls this element the specified direction. Does bounds checking to make sure the scroll is
2662          * within this element's scrollable range.
2663          * @param {String} direction Possible values are: &quot;l&quot;,&quot;left&quot; - &quot;r&quot;,&quot;right&quot; - &quot;t&quot;,&quot;top&quot;,&quot;up&quot; - &quot;b&quot;,&quot;bottom&quot;,&quot;down&quot;.
2664          * @param {Number} distance How far to scroll the element in pixels
2665          * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
2666          * @return {Boolean} Returns true if a scroll was triggered or false if the element
2667          * was scrolled as far as it could go.
2668          */
2669          </span><span class="jsdoc-var">scroll </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">direction</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">animate</span><span class="jsdoc-syntax">){
2670              </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.isScrollable</span><span class="jsdoc-syntax">()){
2671                  </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
2672              }
2673              </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
2674              </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.scrollLeft</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.scrollTop</span><span class="jsdoc-syntax">;
2675              </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.scrollWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.scrollHeight</span><span class="jsdoc-syntax">;
2676              </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cw </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.clientWidth</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ch </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.clientHeight</span><span class="jsdoc-syntax">;
2677              </span><span class="jsdoc-var">direction </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">direction.toLowerCase</span><span class="jsdoc-syntax">();
2678              </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">scrolled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
2679              </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">a </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.preanim</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, 2);
2680              </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">direction</span><span class="jsdoc-syntax">){
2681                  </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;l&quot;</span><span class="jsdoc-syntax">:
2682                  </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">:
2683                      </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-var">l </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">cw</span><span class="jsdoc-syntax">){
2684                          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">cw</span><span class="jsdoc-syntax">);
2685                          </span><span class="jsdoc-var">this.scrollTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">);
2686                          </span><span class="jsdoc-var">scrolled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
2687                      }
2688                      </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
2689                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;r&quot;</span><span class="jsdoc-syntax">:
2690                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;right&quot;</span><span class="jsdoc-syntax">:
2691                      </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">&gt; 0){
2692                          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, 0);
2693                          </span><span class="jsdoc-var">this.scrollTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;left&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">);
2694                          </span><span class="jsdoc-var">scrolled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
2695                      }
2696                      </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
2697                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;t&quot;</span><span class="jsdoc-syntax">:
2698                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">:
2699                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;up&quot;</span><span class="jsdoc-syntax">:
2700                      </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">&gt; 0){
2701                          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, 0);
2702                          </span><span class="jsdoc-var">this.scrollTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">);
2703                          </span><span class="jsdoc-var">scrolled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
2704                      }
2705                      </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
2706                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;b&quot;</span><span class="jsdoc-syntax">:
2707                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;bottom&quot;</span><span class="jsdoc-syntax">:
2708                 </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">&quot;down&quot;</span><span class="jsdoc-syntax">:
2709                      </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-var">t </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">ch</span><span class="jsdoc-syntax">){
2710                          </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">distance</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">ch</span><span class="jsdoc-syntax">);
2711                          </span><span class="jsdoc-var">this.scrollTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;top&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">);
2712                          </span><span class="jsdoc-var">scrolled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
2713                      }
2714                      </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
2715              }
2716              </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">scrolled</span><span class="jsdoc-syntax">;
2717         },
2718
2719         </span><span class="jsdoc-comment">/**
2720          * Translates the passed page coordinates into left/top css values for this element
2721          * @param {Number/Array} x The page x or an array containing [x, y]
2722          * @param {Number} y The page y
2723          * @return {Object} An object with left and top properties. e.g. {left: (value), top: (value)}
2724          */
2725         </span><span class="jsdoc-var">translatePoints </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">y</span><span class="jsdoc-syntax">){
2726             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'object' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">x </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Array</span><span class="jsdoc-syntax">){
2727                 </span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">[1]; </span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">x</span><span class="jsdoc-syntax">[0];
2728             }
2729             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'position'</span><span class="jsdoc-syntax">);
2730             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">o </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getXY</span><span class="jsdoc-syntax">();
2731
2732             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">), 10);
2733             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'top'</span><span class="jsdoc-syntax">), 10);
2734
2735             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">isNaN</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">)){
2736                 </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;relative&quot;</span><span class="jsdoc-syntax">) ? 0 : </span><span class="jsdoc-var">this.dom.offsetLeft</span><span class="jsdoc-syntax">;
2737             }
2738             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">isNaN</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">)){
2739                 </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">p </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;relative&quot;</span><span class="jsdoc-syntax">) ? 0 : </span><span class="jsdoc-var">this.dom.offsetTop</span><span class="jsdoc-syntax">;
2740             }
2741
2742             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{</span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">x </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[0] + </span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">), </span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">y </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">o</span><span class="jsdoc-syntax">[1] + </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">)};
2743         },
2744
2745         </span><span class="jsdoc-comment">/**
2746          * Returns the current scroll position of the element.
2747          * @return {Object} An object containing the scroll position in the format {left: (scrollLeft), top: (scrollTop)}
2748          */
2749         </span><span class="jsdoc-var">getScroll </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
2750             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">doc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">;
2751             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">doc </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">doc.body</span><span class="jsdoc-syntax">){
2752                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">l </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">window.pageXOffset </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">doc.documentElement.scrollLeft </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">doc.body.scrollLeft </span><span class="jsdoc-syntax">|| 0;
2753                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">window.pageYOffset </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">doc.documentElement.scrollTop </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">doc.body.scrollTop </span><span class="jsdoc-syntax">|| 0;
2754                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{</span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">};
2755             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2756                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">{</span><span class="jsdoc-var">left</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">d.scrollLeft</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">top</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">d.scrollTop</span><span class="jsdoc-syntax">};
2757             }
2758         },
2759
2760         </span><span class="jsdoc-comment">/**
2761          * Return the CSS color for the specified CSS attribute. rgb, 3 digit (like #fff) and valid values
2762          * are convert to standard 6 digit hex color.
2763          * @param {String} attr The css attribute
2764          * @param {String} defaultValue The default value to use when a valid color isn't found
2765          * @param {String} prefix (optional) defaults to #. Use an empty string when working with
2766          * YUI color anims.
2767          */
2768         </span><span class="jsdoc-var">getColor </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">defaultValue</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">prefix</span><span class="jsdoc-syntax">){
2769             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">attr</span><span class="jsdoc-syntax">);
2770             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;transparent&quot; </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;inherit&quot;</span><span class="jsdoc-syntax">) {
2771                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">defaultValue</span><span class="jsdoc-syntax">;
2772             }
2773             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">color </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">prefix </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;undefined&quot; </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">&quot;#&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">prefix</span><span class="jsdoc-syntax">;
2774             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.substr</span><span class="jsdoc-syntax">(0, 4) == </span><span class="jsdoc-string">&quot;rgb(&quot;</span><span class="jsdoc-syntax">){
2775                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">rvs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v.slice</span><span class="jsdoc-syntax">(4, </span><span class="jsdoc-var">v.length </span><span class="jsdoc-syntax">-1)</span><span class="jsdoc-var">.split</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;,&quot;</span><span class="jsdoc-syntax">);
2776                 </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; 3; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
2777                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parseInt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">rvs</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">])</span><span class="jsdoc-var">.toString</span><span class="jsdoc-syntax">(16);
2778                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">&lt; 16){
2779                         </span><span class="jsdoc-var">h </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;0&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
2780                     }
2781                     </span><span class="jsdoc-var">color </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">;
2782                 }
2783             } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
2784                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.substr</span><span class="jsdoc-syntax">(0, 1) == </span><span class="jsdoc-string">&quot;#&quot;</span><span class="jsdoc-syntax">){
2785                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.length </span><span class="jsdoc-syntax">== 4) {
2786                         </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">= 1; </span><span class="jsdoc-var">i </span><span class="jsdoc-syntax">&lt; 4; </span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">++){
2787                             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v.charAt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">);
2788                             </span><span class="jsdoc-var">color </span><span class="jsdoc-syntax">+=  </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">;
2789                         }
2790                     }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.length </span><span class="jsdoc-syntax">== 7){
2791                         </span><span class="jsdoc-var">color </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-var">v.substr</span><span class="jsdoc-syntax">(1);
2792                     }
2793                 }
2794             }
2795             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">color.length </span><span class="jsdoc-syntax">&gt; 5 ? </span><span class="jsdoc-var">color.toLowerCase</span><span class="jsdoc-syntax">() : </span><span class="jsdoc-var">defaultValue</span><span class="jsdoc-syntax">);
2796         },
2797
2798         </span><span class="jsdoc-comment">/**
2799          * Wraps the specified element with a special markup/CSS block that renders by default as a gray container with a
2800          * gradient background, rounded corners and a 4-way shadow.
2801          * @param {String} class (optional) A base CSS class to apply to the containing wrapper element (defaults to 'x-box').
2802          * Note that there are a number of CSS rules that are dependent on this name to make the overall effect work,
2803          * so if you supply an alternate base class, make sure you also supply all of the necessary rules.
2804          * @return {Roo.Element} this
2805          */
2806         </span><span class="jsdoc-var">boxWrap </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">){
2807             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'x-box'</span><span class="jsdoc-syntax">;
2808             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.insertHtml</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'beforeBegin'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">String.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'&lt;div class=&quot;{0}&quot;&gt;'</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">El.boxMarkup</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'&lt;/div&gt;'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">)));
2809             </span><span class="jsdoc-var">el.child</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.'</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'-mc'</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.dom.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">);
2810             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
2811         },
2812
2813         </span><span class="jsdoc-comment">/**
2814          * Returns the value of a namespaced attribute from the element's underlying DOM node.
2815          * @param {String} namespace The namespace in which to look for the attribute
2816          * @param {String} name The attribute name
2817          * @return {String} The attribute value
2818          */
2819         </span><span class="jsdoc-var">getAttributeNS </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">? </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ns</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">){
2820             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
2821             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">d</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">ns</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">&quot;:&quot;</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">];
2822             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'unknown'</span><span class="jsdoc-syntax">){
2823                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">d</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">ns</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">&quot;:&quot;</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">];
2824             }
2825             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">d</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">];
2826         } : </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ns</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">){
2827             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dom</span><span class="jsdoc-syntax">;
2828             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">d.getAttributeNS</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ns</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">d.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ns</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">&quot;:&quot;</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">d.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">d</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">];
2829         },
2830
2831
2832         </span><span class="jsdoc-comment">/**
2833          * Sets or Returns the value the dom attribute value
2834          * @param {String|Object} name The attribute name (or object to set multiple attributes)
2835          * @param {String} value (optional) The value to set the attribute to
2836          * @return {String} The attribute value
2837          */
2838         </span><span class="jsdoc-var">attr </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">){
2839             </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) {
2840                 </span><span class="jsdoc-var">this.dom.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">[1]);
2841                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">[1];
2842             }
2843             </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">name</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'object'</span><span class="jsdoc-syntax">) {
2844                 </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-keyword">in </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">) {
2845                     </span><span class="jsdoc-var">this.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]);
2846                 }
2847                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">;
2848             }
2849
2850
2851             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.dom.hasAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">)) {
2852                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">;
2853             }
2854             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.dom.getAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">);
2855         }
2856
2857
2858
2859     };
2860
2861     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ep </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.prototype</span><span class="jsdoc-syntax">;
2862
2863     </span><span class="jsdoc-comment">/**
2864      * Appends an event handler (Shorthand for addListener)
2865      * @param {String}   eventName     The type of event to append
2866      * @param {Function} fn        The method the event invokes
2867      * @param {Object} scope       (optional) The scope (this object) of the fn
2868      * @param {Object}   options   (optional)An object with standard {@link Roo.EventManager#addListener} options
2869      * @method
2870      */
2871     </span><span class="jsdoc-var">ep.on </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ep.addListener</span><span class="jsdoc-syntax">;
2872         </span><span class="jsdoc-comment">// backwards compat
2873     </span><span class="jsdoc-var">ep.mon </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ep.addListener</span><span class="jsdoc-syntax">;
2874
2875     </span><span class="jsdoc-comment">/**
2876      * Removes an event handler from this element (shorthand for removeListener)
2877      * @param {String} eventName the type of event to remove
2878      * @param {Function} fn the method the event invokes
2879      * @return {Roo.Element} this
2880      * @method
2881      */
2882     </span><span class="jsdoc-var">ep.un </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ep.removeListener</span><span class="jsdoc-syntax">;
2883
2884     </span><span class="jsdoc-comment">/**
2885      * true to automatically adjust width and height settings for box-model issues (default to true)
2886      */
2887     </span><span class="jsdoc-var">ep.autoBoxAdjust </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
2888
2889     </span><span class="jsdoc-comment">// private
2890     </span><span class="jsdoc-var">El.unitPattern </span><span class="jsdoc-syntax">= /\d+(px|em|%|en|ex|pt|in|cm|mm|pc)$/i;
2891
2892     </span><span class="jsdoc-comment">// private
2893     </span><span class="jsdoc-var">El.addUnits </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">, </span><span class="jsdoc-var">defaultUnit</span><span class="jsdoc-syntax">){
2894         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-string">&quot;&quot; </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;auto&quot;</span><span class="jsdoc-syntax">){
2895             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
2896         }
2897         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
2898             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
2899         }
2900         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;number&quot; </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">El.unitPattern.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">)){
2901             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">+ (</span><span class="jsdoc-var">defaultUnit </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'px'</span><span class="jsdoc-syntax">);
2902         }
2903         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
2904     };
2905
2906     </span><span class="jsdoc-comment">// special markup used throughout Roo when box wrapping elements
2907     </span><span class="jsdoc-var">El.boxMarkup </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'&lt;div class=&quot;{0}-tl&quot;&gt;&lt;div class=&quot;{0}-tr&quot;&gt;&lt;div class=&quot;{0}-tc&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=&quot;{0}-ml&quot;&gt;&lt;div class=&quot;{0}-mr&quot;&gt;&lt;div class=&quot;{0}-mc&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;div class=&quot;{0}-bl&quot;&gt;&lt;div class=&quot;{0}-br&quot;&gt;&lt;div class=&quot;{0}-bc&quot;&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;'</span><span class="jsdoc-syntax">;
2908     </span><span class="jsdoc-comment">/**
2909      * Visibility mode constant - Use visibility to hide element
2910      * @static
2911      * @type Number
2912      */
2913     </span><span class="jsdoc-var">El.VISIBILITY </span><span class="jsdoc-syntax">= 1;
2914     </span><span class="jsdoc-comment">/**
2915      * Visibility mode constant - Use display to hide element
2916      * @static
2917      * @type Number
2918      */
2919     </span><span class="jsdoc-var">El.DISPLAY </span><span class="jsdoc-syntax">= 2;
2920
2921     </span><span class="jsdoc-var">El.borders </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;border-left-width&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;border-right-width&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;border-top-width&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;border-bottom-width&quot;</span><span class="jsdoc-syntax">};
2922     </span><span class="jsdoc-var">El.paddings </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;padding-left&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;padding-right&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;padding-top&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;padding-bottom&quot;</span><span class="jsdoc-syntax">};
2923     </span><span class="jsdoc-var">El.margins </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">l</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;margin-left&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">r</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;margin-right&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;margin-top&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">b</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;margin-bottom&quot;</span><span class="jsdoc-syntax">};
2924
2925
2926
2927     </span><span class="jsdoc-comment">/**
2928      * @private
2929      */
2930     </span><span class="jsdoc-var">El.cache </span><span class="jsdoc-syntax">= {};
2931
2932     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">docEl</span><span class="jsdoc-syntax">;
2933
2934     </span><span class="jsdoc-comment">/**
2935      * Static method to retrieve Element objects. Uses simple caching to consistently return the same object.
2936      * Automatically fixes if an object was recreated with the same id via AJAX or DOM.
2937      * @param {String/HTMLElement/Element} el The id of the node, a DOM Node or an existing Element.
2938      * @return {Element} The Element object
2939      * @static
2940      */
2941     </span><span class="jsdoc-var">El.get </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
2942         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ex</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">elm</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">;
2943         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">; }
2944         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;string&quot;</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// element id
2945             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!(</span><span class="jsdoc-var">elm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.getElementById</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">))){
2946                 </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
2947             }
2948             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ex </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">]){
2949                 </span><span class="jsdoc-var">ex.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">elm</span><span class="jsdoc-syntax">;
2950             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2951                 </span><span class="jsdoc-var">ex </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">El</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">elm</span><span class="jsdoc-syntax">);
2952             }
2953             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">ex</span><span class="jsdoc-syntax">;
2954         }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.tagName</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// dom element
2955             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!(</span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.id</span><span class="jsdoc-syntax">)){
2956                 </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2957             }
2958             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ex </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">]){
2959                 </span><span class="jsdoc-var">ex.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
2960             }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
2961                 </span><span class="jsdoc-var">ex </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">El</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2962             }
2963             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">ex</span><span class="jsdoc-syntax">;
2964         }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">El</span><span class="jsdoc-syntax">){
2965             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">docEl</span><span class="jsdoc-syntax">){
2966                 </span><span class="jsdoc-var">el.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.getElementById</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.id</span><span class="jsdoc-syntax">) || </span><span class="jsdoc-var">el.dom</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// refresh dom element in case no longer valid,
2967                                                               // catch case where it hasn't been appended
2968                 </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">el.id</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// in case it was created directly with Element(), let's cache it
2969             </span><span class="jsdoc-syntax">}
2970             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
2971         }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el.isComposite</span><span class="jsdoc-syntax">){
2972             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
2973         }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el </span><span class="jsdoc-keyword">instanceof </span><span class="jsdoc-var">Array</span><span class="jsdoc-syntax">){
2974             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">El.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
2975         }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">){
2976             </span><span class="jsdoc-comment">// create a bogus element object representing the document object
2977             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">docEl</span><span class="jsdoc-syntax">){
2978                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">f </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){};
2979                 </span><span class="jsdoc-var">f.prototype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.prototype</span><span class="jsdoc-syntax">;
2980                 </span><span class="jsdoc-var">docEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">();
2981                 </span><span class="jsdoc-var">docEl.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document</span><span class="jsdoc-syntax">;
2982             }
2983             </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">docEl</span><span class="jsdoc-syntax">;
2984         }
2985         </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
2986     };
2987
2988     </span><span class="jsdoc-comment">// private
2989     </span><span class="jsdoc-var">El.uncache </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
2990         </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">a </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">len </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">a.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">++) {
2991             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]){
2992                 </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.id </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">a</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">i</span><span class="jsdoc-syntax">]];
2993             }
2994         }
2995     };
2996
2997     </span><span class="jsdoc-comment">// private
2998     // Garbage collection - uncache elements/purge listeners on orphaned elements
2999     // so we don't hold a reference and cause the browser to retain them
3000     </span><span class="jsdoc-var">El.garbageCollect </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
3001         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">Roo.enableGarbageCollector</span><span class="jsdoc-syntax">){
3002             </span><span class="jsdoc-var">clearInterval</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">El.collectorThread</span><span class="jsdoc-syntax">);
3003             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
3004         }
3005         </span><span class="jsdoc-keyword">for</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">eid </span><span class="jsdoc-keyword">in </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">){
3006             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">eid</span><span class="jsdoc-syntax">], </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.dom</span><span class="jsdoc-syntax">;
3007             </span><span class="jsdoc-comment">// -------------------------------------------------------
3008             // Determining what is garbage:
3009             // -------------------------------------------------------
3010             // !d
3011             // dom node is null, definitely garbage
3012             // -------------------------------------------------------
3013             // !d.parentNode
3014             // no parentNode == direct orphan, definitely garbage
3015             // -------------------------------------------------------
3016             // !d.offsetParent &amp;&amp; !document.getElementById(eid)
3017             // display none elements have no offsetParent so we will
3018             // also try to look it up by it's id. However, check
3019             // offsetParent first so we don't do unneeded lookups.
3020             // This enables collection of elements that are not orphans
3021             // directly, but somewhere up the line they have an orphan
3022             // parent.
3023             // -------------------------------------------------------
3024             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">d.parentNode </span><span class="jsdoc-syntax">|| (!</span><span class="jsdoc-var">d.offsetParent </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">document.getElementById</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">eid</span><span class="jsdoc-syntax">))){
3025                 </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">eid</span><span class="jsdoc-syntax">];
3026                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.enableListenerCollection</span><span class="jsdoc-syntax">){
3027                     </span><span class="jsdoc-var">E.purgeElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d</span><span class="jsdoc-syntax">);
3028                 }
3029             }
3030         }
3031     }
3032     </span><span class="jsdoc-var">El.collectorThreadId </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">setInterval</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">El.garbageCollect</span><span class="jsdoc-syntax">, 30000);
3033
3034
3035     </span><span class="jsdoc-comment">// dom is optional
3036     </span><span class="jsdoc-var">El.Flyweight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">){
3037         </span><span class="jsdoc-var">this.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dom</span><span class="jsdoc-syntax">;
3038     };
3039     </span><span class="jsdoc-var">El.Flyweight.prototype </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.prototype</span><span class="jsdoc-syntax">;
3040
3041     </span><span class="jsdoc-var">El._flyweights </span><span class="jsdoc-syntax">= {};
3042     </span><span class="jsdoc-comment">/**
3043      * Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
3044      * the dom node can be overwritten by other code.
3045      * @param {String/HTMLElement} el The dom node or id
3046      * @param {String} named (optional) Allows for creation of named reusable flyweights to
3047      *                                  prevent conflicts (e.g. internally Roo uses &quot;_internal&quot;)
3048      * @static
3049      * @return {Element} The shared Element object
3050      */
3051     </span><span class="jsdoc-var">El.fly </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">named</span><span class="jsdoc-syntax">){
3052         </span><span class="jsdoc-var">named </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">named </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'_global'</span><span class="jsdoc-syntax">;
3053         </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">);
3054         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">){
3055             </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
3056         }
3057         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">El._flyweights</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">named</span><span class="jsdoc-syntax">]){
3058             </span><span class="jsdoc-var">El._flyweights</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">named</span><span class="jsdoc-syntax">] = </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">El.Flyweight</span><span class="jsdoc-syntax">();
3059         }
3060         </span><span class="jsdoc-var">El._flyweights</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">named</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.dom </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">;
3061         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">El._flyweights</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">named</span><span class="jsdoc-syntax">];
3062     };
3063
3064     </span><span class="jsdoc-comment">/**
3065      * Static method to retrieve Element objects. Uses simple caching to consistently return the same object.
3066      * Automatically fixes if an object was recreated with the same id via AJAX or DOM.
3067      * Shorthand of {@link Roo.Element#get}
3068      * @param {String/HTMLElement/Element} el The id of the node, a DOM Node or an existing Element.
3069      * @return {Element} The Element object
3070      * @member Roo
3071      * @method get
3072      */
3073     </span><span class="jsdoc-var">Roo.get </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.get</span><span class="jsdoc-syntax">;
3074     </span><span class="jsdoc-comment">/**
3075      * Gets the globally shared flyweight Element, with the passed node as the active element. Do not store a reference to this element -
3076      * the dom node can be overwritten by other code.
3077      * Shorthand of {@link Roo.Element#fly}
3078      * @param {String/HTMLElement} el The dom node or id
3079      * @param {String} named (optional) Allows for creation of named reusable flyweights to
3080      *                                  prevent conflicts (e.g. internally Roo uses &quot;_internal&quot;)
3081      * @static
3082      * @return {Element} The shared Element object
3083      * @member Roo
3084      * @method fly
3085      */
3086     </span><span class="jsdoc-var">Roo.fly </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">El.fly</span><span class="jsdoc-syntax">;
3087
3088     </span><span class="jsdoc-comment">// speedy lookup for elements never to box adjust
3089     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">noBoxAdjust </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.isStrict </span><span class="jsdoc-syntax">? {
3090         </span><span class="jsdoc-var">select</span><span class="jsdoc-syntax">:1
3091     } : {
3092         </span><span class="jsdoc-var">input</span><span class="jsdoc-syntax">:1, </span><span class="jsdoc-var">select</span><span class="jsdoc-syntax">:1, </span><span class="jsdoc-var">textarea</span><span class="jsdoc-syntax">:1
3093     };
3094     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">Roo.isGecko</span><span class="jsdoc-syntax">){
3095         </span><span class="jsdoc-var">noBoxAdjust</span><span class="jsdoc-syntax">[</span><span class="jsdoc-string">'button'</span><span class="jsdoc-syntax">] = 1;
3096     }
3097
3098
3099     </span><span class="jsdoc-var">Roo.EventManager.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">window</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'unload'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
3100         </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">El.cache</span><span class="jsdoc-syntax">;
3101         </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">El._flyweights</span><span class="jsdoc-syntax">;
3102     });
3103 })();
3104
3105
3106
3107
3108 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.DomQuery</span><span class="jsdoc-syntax">){
3109     </span><span class="jsdoc-var">Roo.Element.selectorFunction </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.DomQuery.select</span><span class="jsdoc-syntax">;
3110 }
3111
3112 </span><span class="jsdoc-var">Roo.Element.select </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">unique</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">root</span><span class="jsdoc-syntax">){
3113     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">;
3114     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">selector </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;string&quot;</span><span class="jsdoc-syntax">){
3115         </span><span class="jsdoc-var">els </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.Element.selectorFunction</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">root</span><span class="jsdoc-syntax">);
3116     }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selector.length </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
3117         </span><span class="jsdoc-var">els </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">selector</span><span class="jsdoc-syntax">;
3118     }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
3119         </span><span class="jsdoc-keyword">throw </span><span class="jsdoc-string">&quot;Invalid selector&quot;</span><span class="jsdoc-syntax">;
3120     }
3121     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">unique </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
3122         </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.CompositeElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">);
3123     }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
3124         </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">Roo.CompositeElementLite</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">els</span><span class="jsdoc-syntax">);
3125     }
3126 };
3127 </span><span class="jsdoc-comment">/**
3128  * Selects elements based on the passed CSS selector to enable working on them as 1.
3129  * @param {String/Array} selector The CSS selector or an array of elements
3130  * @param {Boolean} unique (optional) true to create a unique Roo.Element for each element (defaults to a shared flyweight object)
3131  * @param {HTMLElement/String} root (optional) The root element of the query or id of the root
3132  * @return {CompositeElementLite/CompositeElement}
3133  * @member Roo
3134  * @method select
3135  */
3136 </span><span class="jsdoc-var">Roo.select </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.Element.select</span><span class="jsdoc-syntax">;
3137
3138
3139
3140
3141
3142
3143
3144
3145
3146
3147
3148
3149
3150
3151 </span></code></body></html>