1 <html><head><title>../roojs1/Roo/Component.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">/*
4 * Copyright(c) 2006-2007, Ext JS, LLC.
6 * Originally Released Under LGPL - original licence link has changed is not relivant.
9 * <script type="text/javascript">
13 * @class Roo.Component
14 * @extends Roo.util.Observable
15 * Base class for all major Roo components. All subclasses of Component can automatically participate in the standard
16 * Roo component lifecycle of creation, rendering and destruction. They also have automatic support for basic hide/show
17 * and enable/disable behavior. Component allows any subclass to be lazy-rendered into any {@link Roo.Container} and
18 * to be automatically registered with the {@link Roo.ComponentMgr} so that it can be referenced at any time via {@link Roo.getCmp}.
19 * All visual components (widgets) that require rendering into a layout should subclass Component.
21 * @param {Roo.Element/String/Object} config The configuration options. If an element is passed, it is set as the internal
22 * element and its id used as the component id. If a string is passed, it is assumed to be the id of an existing element
23 * and is used as the component id. Otherwise, it is assumed to be a standard config object and is applied to the component.
25 </span><span class="jsdoc-var">Roo.Component </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">){
26 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">|| {};
27 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config.tagName </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">config.dom </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">"string"</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// element object
28 </span><span class="jsdoc-var">config </span><span class="jsdoc-syntax">= {</span><span class="jsdoc-var">el</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">config.id </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">};
30 </span><span class="jsdoc-var">this.initialConfig </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">;
32 </span><span class="jsdoc-var">Roo.apply</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">);
33 </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
34 </span><span class="jsdoc-comment">/**
36 * Fires after the component is disabled.
37 * @param {Roo.Component} this
39 </span><span class="jsdoc-var">disable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
40 </span><span class="jsdoc-comment">/**
42 * Fires after the component is enabled.
43 * @param {Roo.Component} this
45 </span><span class="jsdoc-var">enable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
46 </span><span class="jsdoc-comment">/**
48 * Fires before the component is shown. Return false to stop the show.
49 * @param {Roo.Component} this
51 </span><span class="jsdoc-var">beforeshow </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
52 </span><span class="jsdoc-comment">/**
54 * Fires after the component is shown.
55 * @param {Roo.Component} this
57 </span><span class="jsdoc-var">show </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
58 </span><span class="jsdoc-comment">/**
60 * Fires before the component is hidden. Return false to stop the hide.
61 * @param {Roo.Component} this
63 </span><span class="jsdoc-var">beforehide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
64 </span><span class="jsdoc-comment">/**
66 * Fires after the component is hidden.
67 * @param {Roo.Component} this
69 </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
70 </span><span class="jsdoc-comment">/**
72 * Fires before the component is rendered. Return false to stop the render.
73 * @param {Roo.Component} this
75 </span><span class="jsdoc-var">beforerender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
76 </span><span class="jsdoc-comment">/**
78 * Fires after the component is rendered.
79 * @param {Roo.Component} this
81 </span><span class="jsdoc-var">render </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
82 </span><span class="jsdoc-comment">/**
83 * @event beforedestroy
84 * Fires before the component is destroyed. Return false to stop the destroy.
85 * @param {Roo.Component} this
87 </span><span class="jsdoc-var">beforedestroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
88 </span><span class="jsdoc-comment">/**
90 * Fires after the component is destroyed.
91 * @param {Roo.Component} this
93 </span><span class="jsdoc-var">destroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
94 </span><span class="jsdoc-syntax">});
95 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.id</span><span class="jsdoc-syntax">){
96 </span><span class="jsdoc-var">this.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">"roo-comp-" </span><span class="jsdoc-syntax">+ (++</span><span class="jsdoc-var">Roo.Component.AUTO_ID</span><span class="jsdoc-syntax">);
98 </span><span class="jsdoc-var">Roo.ComponentMgr.register</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
99 </span><span class="jsdoc-var">Roo.Component.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
100 </span><span class="jsdoc-var">this.initComponent</span><span class="jsdoc-syntax">();
101 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.renderTo</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// not supported by all components yet. use at your own risk!
102 </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.renderTo</span><span class="jsdoc-syntax">);
103 </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.renderTo</span><span class="jsdoc-syntax">;
107 </span><span class="jsdoc-comment">/** @private */
108 </span><span class="jsdoc-var">Roo.Component.AUTO_ID </span><span class="jsdoc-syntax">= 1000;
110 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.Component</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.util.Observable</span><span class="jsdoc-syntax">, {
111 </span><span class="jsdoc-comment">/**
112 * @scope Roo.Component.prototype
114 * true if this component is hidden. Read-only.
116 </span><span class="jsdoc-var">hidden </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
117 </span><span class="jsdoc-comment">/**
119 * true if this component is disabled. Read-only.
121 </span><span class="jsdoc-var">disabled </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
122 </span><span class="jsdoc-comment">/**
124 * true if this component has been rendered. Read-only.
126 </span><span class="jsdoc-var">rendered </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
128 </span><span class="jsdoc-comment">/** @cfg {String} disableClass
129 * CSS class added to the component when it is disabled (defaults to "x-item-disabled").
131 </span><span class="jsdoc-var">disabledClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">"x-item-disabled"</span><span class="jsdoc-syntax">,
132 </span><span class="jsdoc-comment">/** @cfg {Boolean} allowDomMove
133 * Whether the component can move the Dom node when rendering (defaults to true).
135 </span><span class="jsdoc-var">allowDomMove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
136 </span><span class="jsdoc-comment">/** @cfg {String} hideMode (display|visibility)
137 * How this component should hidden. Supported values are
138 * "visibility" (css visibility), "offsets" (negative offset position) and
139 * "display" (css display) - defaults to "display".
141 </span><span class="jsdoc-var">hideMode</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'display'</span><span class="jsdoc-syntax">,
143 </span><span class="jsdoc-comment">/** @private */
144 </span><span class="jsdoc-var">ctype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">"Roo.Component"</span><span class="jsdoc-syntax">,
146 </span><span class="jsdoc-comment">/**
147 * @cfg {String} actionMode
148 * which property holds the element that used for hide() / show() / disable() / enable()
151 </span><span class="jsdoc-var">actionMode </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">"el"</span><span class="jsdoc-syntax">,
153 </span><span class="jsdoc-comment">/** @private */
154 </span><span class="jsdoc-var">getActionEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
155 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.actionMode</span><span class="jsdoc-syntax">];
158 </span><span class="jsdoc-var">initComponent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.emptyFn</span><span class="jsdoc-syntax">,
159 </span><span class="jsdoc-comment">/**
160 * If this is a lazy rendering component, render it to its container element.
161 * @param {String/HTMLElement/Element} container (optional) The element this component should be rendered into. If it is being applied to existing markup, this should be left off.
163 </span><span class="jsdoc-var">render </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">position</span><span class="jsdoc-syntax">){
164 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.rendered </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"beforerender"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
165 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">container </span><span class="jsdoc-syntax">&& </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
166 </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">);
167 </span><span class="jsdoc-var">container </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.dom.parentNode</span><span class="jsdoc-syntax">;
168 </span><span class="jsdoc-var">this.allowDomMove </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
170 </span><span class="jsdoc-var">this.container </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">container</span><span class="jsdoc-syntax">);
171 </span><span class="jsdoc-var">this.rendered </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
172 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
173 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'number'</span><span class="jsdoc-syntax">){
174 </span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.container.dom.childNodes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">];
175 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
176 </span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
179 </span><span class="jsdoc-var">this.onRender</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.container</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">);
180 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">){
181 </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">);
182 </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">;
184 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.style</span><span class="jsdoc-syntax">){
185 </span><span class="jsdoc-var">this.el.applyStyles</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.style</span><span class="jsdoc-syntax">);
186 </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.style</span><span class="jsdoc-syntax">;
188 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"render"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
189 </span><span class="jsdoc-var">this.afterRender</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.container</span><span class="jsdoc-syntax">);
190 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hidden</span><span class="jsdoc-syntax">){
191 </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
193 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">){
194 </span><span class="jsdoc-var">this.disable</span><span class="jsdoc-syntax">();
197 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
200 </span><span class="jsdoc-comment">/** @private */
201 // default function is not really useful
202 </span><span class="jsdoc-var">onRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">){
203 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
204 </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">);
205 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.allowDomMove </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
206 </span><span class="jsdoc-var">ct.dom.insertBefore</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
211 </span><span class="jsdoc-comment">/** @private */
212 </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
213 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">this.autoCreate </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"object" </span><span class="jsdoc-syntax">?
214 </span><span class="jsdoc-var">this.autoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({}, </span><span class="jsdoc-var">this.defaultAutoCreate</span><span class="jsdoc-syntax">);
215 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.id </span><span class="jsdoc-syntax">&& !</span><span class="jsdoc-var">cfg.id</span><span class="jsdoc-syntax">){
216 </span><span class="jsdoc-var">cfg.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.id</span><span class="jsdoc-syntax">;
218 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
221 </span><span class="jsdoc-comment">/** @private */
222 </span><span class="jsdoc-var">afterRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.emptyFn</span><span class="jsdoc-syntax">,
224 </span><span class="jsdoc-comment">/**
225 * Destroys this component by purging any event listeners, removing the component's element from the DOM,
226 * removing the component from its {@link Roo.Container} (if applicable) and unregistering it from {@link Roo.ComponentMgr}.
228 </span><span class="jsdoc-var">destroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
229 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"beforedestroy"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
230 </span><span class="jsdoc-var">this.purgeListeners</span><span class="jsdoc-syntax">();
231 </span><span class="jsdoc-var">this.beforeDestroy</span><span class="jsdoc-syntax">();
232 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
233 </span><span class="jsdoc-var">this.el.removeAllListeners</span><span class="jsdoc-syntax">();
234 </span><span class="jsdoc-var">this.el.remove</span><span class="jsdoc-syntax">();
235 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.actionMode </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">"container"</span><span class="jsdoc-syntax">){
236 </span><span class="jsdoc-var">this.container.remove</span><span class="jsdoc-syntax">();
239 </span><span class="jsdoc-var">this.onDestroy</span><span class="jsdoc-syntax">();
240 </span><span class="jsdoc-var">Roo.ComponentMgr.unregister</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
241 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"destroy"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
245 </span><span class="jsdoc-comment">/** @private */
246 </span><span class="jsdoc-var">beforeDestroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
250 </span><span class="jsdoc-comment">/** @private */
251 </span><span class="jsdoc-var">onDestroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
255 </span><span class="jsdoc-comment">/**
256 * Returns the underlying {@link Roo.Element}.
257 * @return {Roo.Element} The element
259 </span><span class="jsdoc-var">getEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
260 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
263 </span><span class="jsdoc-comment">/**
264 * Returns the id of this component.
267 </span><span class="jsdoc-var">getId </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
268 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.id</span><span class="jsdoc-syntax">;
271 </span><span class="jsdoc-comment">/**
272 * Try to focus this component.
273 * @param {Boolean} selectText True to also select the text in this component (if applicable)
274 * @return {Roo.Component} this
276 </span><span class="jsdoc-var">focus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selectText</span><span class="jsdoc-syntax">){
277 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
278 </span><span class="jsdoc-var">this.el.focus</span><span class="jsdoc-syntax">();
279 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selectText </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
280 </span><span class="jsdoc-var">this.el.dom.select</span><span class="jsdoc-syntax">();
283 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
286 </span><span class="jsdoc-comment">/** @private */
287 </span><span class="jsdoc-var">blur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
288 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
289 </span><span class="jsdoc-var">this.el.blur</span><span class="jsdoc-syntax">();
291 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
294 </span><span class="jsdoc-comment">/**
295 * Disable this component.
296 * @return {Roo.Component} this
298 </span><span class="jsdoc-var">disable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
299 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
300 </span><span class="jsdoc-var">this.onDisable</span><span class="jsdoc-syntax">();
302 </span><span class="jsdoc-var">this.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
303 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"disable"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
304 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
307 </span><span class="jsdoc-comment">// private
308 </span><span class="jsdoc-var">onDisable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
309 </span><span class="jsdoc-var">this.getActionEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabledClass</span><span class="jsdoc-syntax">);
310 </span><span class="jsdoc-var">this.el.dom.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
313 </span><span class="jsdoc-comment">/**
314 * Enable this component.
315 * @return {Roo.Component} this
317 </span><span class="jsdoc-var">enable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
318 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
319 </span><span class="jsdoc-var">this.onEnable</span><span class="jsdoc-syntax">();
321 </span><span class="jsdoc-var">this.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
322 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"enable"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
323 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
326 </span><span class="jsdoc-comment">// private
327 </span><span class="jsdoc-var">onEnable </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
328 </span><span class="jsdoc-var">this.getActionEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabledClass</span><span class="jsdoc-syntax">);
329 </span><span class="jsdoc-var">this.el.dom.disabled </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
332 </span><span class="jsdoc-comment">/**
333 * Convenience function for setting disabled/enabled by boolean.
334 * @param {Boolean} disabled
336 </span><span class="jsdoc-var">setDisabled </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">disabled</span><span class="jsdoc-syntax">){
337 </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">disabled </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">"disable" </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">"enable"</span><span class="jsdoc-syntax">]();
340 </span><span class="jsdoc-comment">/**
341 * Show this component.
342 * @return {Roo.Component} this
344 </span><span class="jsdoc-var">show</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
345 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"beforeshow"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
346 </span><span class="jsdoc-var">this.hidden </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
347 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
348 </span><span class="jsdoc-var">this.onShow</span><span class="jsdoc-syntax">();
350 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"show"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
352 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
355 </span><span class="jsdoc-comment">// private
356 </span><span class="jsdoc-var">onShow </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
357 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ae </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getActionEl</span><span class="jsdoc-syntax">();
358 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hideMode </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'visibility'</span><span class="jsdoc-syntax">){
359 </span><span class="jsdoc-var">ae.dom.style.visibility </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">"visible"</span><span class="jsdoc-syntax">;
360 }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hideMode </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'offsets'</span><span class="jsdoc-syntax">){
361 </span><span class="jsdoc-var">ae.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-hidden'</span><span class="jsdoc-syntax">);
362 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
363 </span><span class="jsdoc-var">ae.dom.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">""</span><span class="jsdoc-syntax">;
367 </span><span class="jsdoc-comment">/**
368 * Hide this component.
369 * @return {Roo.Component} this
371 </span><span class="jsdoc-var">hide</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
372 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"beforehide"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
373 </span><span class="jsdoc-var">this.hidden </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
374 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
375 </span><span class="jsdoc-var">this.onHide</span><span class="jsdoc-syntax">();
377 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">"hide"</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
379 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
382 </span><span class="jsdoc-comment">// private
383 </span><span class="jsdoc-var">onHide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
384 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ae </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getActionEl</span><span class="jsdoc-syntax">();
385 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hideMode </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'visibility'</span><span class="jsdoc-syntax">){
386 </span><span class="jsdoc-var">ae.dom.style.visibility </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">"hidden"</span><span class="jsdoc-syntax">;
387 }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hideMode </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'offsets'</span><span class="jsdoc-syntax">){
388 </span><span class="jsdoc-var">ae.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-hidden'</span><span class="jsdoc-syntax">);
389 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
390 </span><span class="jsdoc-var">ae.dom.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">"none"</span><span class="jsdoc-syntax">;
394 </span><span class="jsdoc-comment">/**
395 * Convenience function to hide or show this component by boolean.
396 * @param {Boolean} visible True to show, false to hide
397 * @return {Roo.Component} this
399 </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">){
400 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">visible</span><span class="jsdoc-syntax">) {
401 </span><span class="jsdoc-var">this.show</span><span class="jsdoc-syntax">();
402 }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
403 </span><span class="jsdoc-var">this.hide</span><span class="jsdoc-syntax">();
405 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
408 </span><span class="jsdoc-comment">/**
409 * Returns true if this component is visible.
411 </span><span class="jsdoc-var">isVisible </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
412 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.getActionEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.isVisible</span><span class="jsdoc-syntax">();
415 </span><span class="jsdoc-var">cloneConfig </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">overrides</span><span class="jsdoc-syntax">){
416 </span><span class="jsdoc-var">overrides </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">overrides </span><span class="jsdoc-syntax">|| {};
417 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">overrides.id </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
418 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.applyIf</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">overrides</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.initialConfig</span><span class="jsdoc-syntax">);
419 </span><span class="jsdoc-var">cfg.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// prevent dup id
420 </span><span class="jsdoc-keyword">return new </span><span class="jsdoc-var">this.constructor</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">);
422 });</span></code></body></html>