-<html>\r
-<head>\r
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> \r
- <title>The source code</title>\r
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body onload="prettyPrint();">\r
- <pre class="prettyprint lang-js"><div id="cls-Ext.Component"></div>/**
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>The source code</title>
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+</head>
+<body onload="prettyPrint();">
+ <pre class="prettyprint lang-js">/*!
+ * Ext JS Library 3.3.0
+ * Copyright(c) 2006-2010 Ext JS, Inc.
+ * licensing@extjs.com
+ * http://www.extjs.com/license
+ */
+<div id="cls-Ext.Component"></div>/**
* @class Ext.Component
* @extends Ext.util.Observable
* <p>Base class for all Ext components. All subclasses of Component may participate in the automated
flash {@link Ext.FlashComponent}
grid {@link Ext.grid.GridPanel}
listview {@link Ext.ListView}
+multislider {@link Ext.slider.MultiSlider}
panel {@link Ext.Panel}
progress {@link Ext.ProgressBar}
propertygrid {@link Ext.grid.PropertyGrid}
-slider {@link Ext.Slider}
+slider {@link Ext.slider.SingleSlider}
spacer {@link Ext.Spacer}
splitbutton {@link Ext.SplitButton}
tabpanel {@link Ext.TabPanel}
checkbox {@link Ext.form.Checkbox}
checkboxgroup {@link Ext.form.CheckboxGroup}
combo {@link Ext.form.ComboBox}
+compositefield {@link Ext.form.CompositeField}
datefield {@link Ext.form.DateField}
displayfield {@link Ext.form.DisplayField}
field {@link Ext.form.Field}
</code></pre>
*/
- // Configs below are used for all Components when rendered by AnchorLayout.
- <div id="cfg-Ext.Component-anchor"></div>/**
- * @cfg {String} anchor <p><b>Note</b>: this config is only used when this Component is rendered
- * by a Container which has been configured to use an <b>{@link Ext.layout.AnchorLayout AnchorLayout}</b>
- * based layout manager, for example:<div class="mdetail-params"><ul>
- * <li>{@link Ext.form.FormPanel}</li>
- * <li>specifying <code>layout: 'anchor' // or 'form', or 'absolute'</code></li>
- * </ul></div></p>
- * <p>See {@link Ext.layout.AnchorLayout}.{@link Ext.layout.AnchorLayout#anchor anchor} also.</p>
- */
-
<div id="cfg-Ext.Component-id"></div>/**
* @cfg {String} id
* <p>The <b>unique</b> id of this component (defaults to an {@link #getId auto-assigned id}).
* @cfg {Mixed} tpl
* An <bold>{@link Ext.Template}</bold>, <bold>{@link Ext.XTemplate}</bold>
* or an array of strings to form an Ext.XTemplate.
- * Used in conjunction with the <code>{@link #data}</code> and
+ * Used in conjunction with the <code>{@link #data}</code> and
* <code>{@link #tplWriteMode}</code> configurations.
*/
* The initial set of data to apply to the <code>{@link #tpl}</code> to
* update the content area of the Component.
*/
+
+ <div id="cfg-Ext.Component-bubbleEvents"></div>/**
+ * @cfg {Array} bubbleEvents
+ * <p>An array of events that, when fired, should be bubbled to any parent container.
+ * See {@link Ext.util.Observable#enableBubble}.
+ * Defaults to <tt>[]</tt>.
+ */
+ bubbleEvents: [],
// private
}
</code></pre>
*/
- initComponent : Ext.emptyFn,
+ initComponent : function(){
+ /*
+ * this is double processing, however it allows people to be able to do
+ * Ext.apply(this, {
+ * listeners: {
+ * //here
+ * }
+ * });
+ * MyClass.superclass.initComponent.call(this);
+ */
+ if(this.listeners){
+ this.on(this.listeners);
+ delete this.listeners;
+ }
+ this.enableBubble(this.bubbleEvents);
+ },
<div id="method-Ext.Component-render"></div>/**
* <p>Render this Component into the passed HTML element.</p>
*/
if(this.ref && !this.refOwner){
var levels = this.ref.split('/'),
- last = levels.length,
+ last = levels.length,
i = 0,
t = this;
-
+
while(t && i < last){
t = t.ownerCt;
++i;
// private
getStateId : function(){
- return this.stateId || ((this.id.indexOf('ext-comp-') == 0 || this.id.indexOf('ext-gen') == 0) ? null : this.id);
+ return this.stateId || ((/^(ext-comp-|ext-gen)/).test(String(this.id)) ? null : this.id);
},
// private
this.container.remove();
}
}
+ // Stop any buffered tasks
+ if(this.focusTask && this.focusTask.cancel){
+ this.focusTask.cancel();
+ }
this.onDestroy();
Ext.ComponentMgr.unregister(this);
this.fireEvent('destroy', this);
*/
focus : function(selectText, delay){
if(delay){
- this.focus.defer(Ext.isNumber(delay) ? delay : 10, this, [selectText, false]);
- return;
+ this.focusTask = new Ext.util.DelayedTask(this.focus, this, [selectText, false]);
+ this.focusTask.delay(Ext.isNumber(delay) ? delay : 10);
+ return this;
}
- if(this.rendered){
+ if(this.rendered && !this.isDestroyed){
this.el.focus();
if(selectText === true){
this.el.dom.select();
var isBoxSubclass = t.isXType('box'); // true, descended from BoxComponent
var isBoxInstance = t.isXType('box', true); // false, not a direct BoxComponent instance
</code></pre>
- * @param {String} xtype The xtype to check for this Component
+ * @param {String/Ext.Component/Class} xtype The xtype to check for this Component. Note that the the component can either be an instance
+ * or a component class:
+ * <pre><code>
+var c = new Ext.Component();
+console.log(c.isXType(c));
+console.log(c.isXType(Ext.Component));
+</code></pre>
* @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
* the default), or true to check whether this Component is directly of the specified xtype.
* @return {Boolean} True if this component descends from the specified xtype, false otherwise.
<div id="method-Ext.Component-findParentByType"></div>/**
* Find a container above this component at any level by xtype or class
- * @param {String/Class} xtype The xtype string for a component, or the class of the component directly
+ * @param {String/Ext.Component/Class} xtype The xtype to check for this Component. Note that the the component can either be an instance
+ * or a component class:
+ * @param {Boolean} shallow (optional) False to check whether this Component is descended from the xtype (this is
+ * the default), or true to check whether this Component is directly of the specified xtype.
* @return {Ext.Container} The first Container which matches the given xtype or class
*/
- findParentByType : function(xtype) {
- return Ext.isFunction(xtype) ?
- this.findParentBy(function(p){
- return p.constructor === xtype;
- }) :
- this.findParentBy(function(p){
- return p.constructor.xtype === xtype;
- });
+ findParentByType : function(xtype, shallow){
+ return this.findParentBy(function(c){
+ return c.isXType(xtype, shallow);
+ });
+ },
+
+ <div id="method-Ext.Component-bubble"></div>/**
+ * Bubbles up the component/container heirarchy, calling the specified function with each component. The scope (<i>this</i>) of
+ * function call will be the scope provided or the current component. The arguments to the function
+ * will be the args provided or the current component. If the function returns false at any point,
+ * the bubble is stopped.
+ * @param {Function} fn The function to call
+ * @param {Object} scope (optional) The scope of the function (defaults to current node)
+ * @param {Array} args (optional) The args to call the function with (default to passing the current component)
+ * @return {Ext.Component} this
+ */
+ bubble : function(fn, scope, args){
+ var p = this;
+ while(p){
+ if(fn.apply(scope || p, args || [p]) === false){
+ break;
+ }
+ p = p.ownerCt;
+ }
+ return this;
},
// protected
}
});
-Ext.reg('component', Ext.Component);</pre> \r
-</body>\r
+Ext.reg('component', Ext.Component);
+</pre>
+</body>
</html>
\ No newline at end of file