/**
* @class Roo.Component
* @extends Roo.util.Observable
- * Base class for all major Ext components. All subclasses of Component can automatically participate in the standard
- * Ext component lifecycle of creation, rendering and destruction. They also have automatic support for basic hide/show
+ * Base class for all major Roo components. All subclasses of Component can automatically participate in the standard
+ * Roo component lifecycle of creation, rendering and destruction. They also have automatic support for basic hide/show
* and enable/disable behavior. Component allows any subclass to be lazy-rendered into any {@link Roo.Container} and
* to be automatically registered with the {@link Roo.ComponentMgr} so that it can be referenced at any time via {@link Roo.getCmp}.
* All visual components (widgets) that require rendering into a layout should subclass Component.
destroy : true
});
if(!this.id){
- this.id = "ext-comp-" + (++Roo.Component.AUTO_ID);
+ this.id = "roo-comp-" + (++Roo.Component.AUTO_ID);
}
Roo.ComponentMgr.register(this);
Roo.Component.superclass.constructor.call(this);
}
};
-// private
+/** @private */
Roo.Component.AUTO_ID = 1000;
Roo.extend(Roo.Component, Roo.util.Observable, {
/**
- * @property {Boolean} hidden
+ * @scope Roo.Component.prototype
+ * @type {Boolean}
* true if this component is hidden. Read-only.
*/
hidden : false,
/**
+ * @type {Boolean}
* true if this component is disabled. Read-only.
*/
disabled : false,
/**
+ * @type {Boolean}
* true if this component has been rendered. Read-only.
*/
rendered : false,
* Whether the component can move the Dom node when rendering (defaults to true).
*/
allowDomMove : true,
- /** @cfg {String} hideMode
+ /** @cfg {String} hideMode (display|visibility)
* How this component should hidden. Supported values are
* "visibility" (css visibility), "offsets" (negative offset position) and
* "display" (css display) - defaults to "display".
*/
hideMode: 'display',
- // private
+ /** @private */
ctype : "Roo.Component",
- /** @cfg {String} actionMode
+ /**
+ * @cfg {String} actionMode
* which property holds the element that used for hide() / show() / disable() / enable()
- * default is 'el'
+ * default is 'el' for forms you probably want to set this to fieldEl
*/
actionMode : "el",
- // private
+ /** @private */
getActionEl : function(){
return this[this.actionMode];
},
* @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.
*/
render : function(container, position){
- if(!this.rendered && this.fireEvent("beforerender", this) !== false){
- if(!container && this.el){
- this.el = Roo.get(this.el);
- container = this.el.dom.parentNode;
- this.allowDomMove = false;
- }
- this.container = Roo.get(container);
- this.rendered = true;
- if(position !== undefined){
- if(typeof position == 'number'){
- position = this.container.dom.childNodes[position];
- }else{
- position = Roo.getDom(position);
- }
- }
- this.onRender(this.container, position || null);
- if(this.cls){
- this.el.addClass(this.cls);
- delete this.cls;
- }
- if(this.style){
- this.el.applyStyles(this.style);
- delete this.style;
- }
- this.fireEvent("render", this);
- this.afterRender(this.container);
- if(this.hidden){
- this.hide();
- }
- if(this.disabled){
- this.disable();
+
+ if(this.rendered){
+ return this;
+ }
+
+ if(this.fireEvent("beforerender", this) === false){
+ return false;
+ }
+
+ if(!container && this.el){
+ this.el = Roo.get(this.el);
+ container = this.el.dom.parentNode;
+ this.allowDomMove = false;
+ }
+ this.container = Roo.get(container);
+ this.rendered = true;
+ if(position !== undefined){
+ if(typeof position == 'number'){
+ position = this.container.dom.childNodes[position];
+ }else{
+ position = Roo.getDom(position);
}
}
+ this.onRender(this.container, position || null);
+ if(this.cls){
+ this.el.addClass(this.cls);
+ delete this.cls;
+ }
+ if(this.style){
+ this.el.applyStyles(this.style);
+ delete this.style;
+ }
+ this.fireEvent("render", this);
+ this.afterRender(this.container);
+ if(this.hidden){
+ this.hide();
+ }
+ if(this.disabled){
+ this.disable();
+ }
+
return this;
+
},
- // private
+ /** @private */
// default function is not really useful
onRender : function(ct, position){
if(this.el){
}
},
- // private
+ /** @private */
getAutoCreate : function(){
var cfg = typeof this.autoCreate == "object" ?
this.autoCreate : Roo.apply({}, this.defaultAutoCreate);
return cfg;
},
- // private
+ /** @private */
afterRender : Roo.emptyFn,
/**
}
},
- // private
+ /** @private */
beforeDestroy : function(){
},
- // private
+ /** @private */
onDestroy : function(){
},
return this;
},
- // private
+ /** @private */
blur : function(){
if(this.rendered){
this.el.blur();