eccehomo
28 Dec 2008, 6:59 AM
I find it useful and somewhat interesting to implement xtypes for plugins. Here it is:
(This isn't really a plugin since this class isn't plugged into a component)
Ext.ns("Ext.ux.component.patches");
Ext.ux.component.patches.ComponentPluginsXTypesPatch = function(){
return {
onInitPlugin : function(p){
var isXtype = ( p.xtype && typeof p.init != 'function' );
if(isXtype){
var i = this.plugins.indexOf(p);
p = Ext.ComponentMgr.create(p);
this.plugins[i] = p.init(this);
}
return !isXtype; //if isXtype, return false (i.e, do not use initPlugin)
},
install : function(){
Ext.Component.prototype.initPlugin = Ext.Component.prototype.initPlugin.createInterceptor(this.onInitPlugin);
}
}
}();
Ext.ux.component.patches.ComponentPluginsXTypesPatch.install();
//now you can:
//sample plugin for a grid. let's say, saki's Ext.ux.grid.Search
Ext.ux.grid.Search = function(){
....
}
Ext.extend(Ext.ux.grid.Search, Ext.util.Observable, {
...
});
//at the end:
Ext.reg('grid_search_by_saki', Ext.ux.grid.Search);
//using the plugin:
var grid = new Ext.grid.GridPanel({
plugins : [{
xtype : 'grid_search_by_saki', <OTHER _CONFIG_OPTIONS>
}]
});
Why do this?
1.) If you are retrieving your object's definiton asynchronously, then you can now include plugins in the definition. Like this:
var loader = new ComponentLoaderClass({
url : '...'
});
loader.on("load", function(def){
//assume that def is a json that contains the plugin's defintion with xtype's
var grid = new Ext.grid.GridPanel(def.gridDefinition)
grid.render();
})
2.) saves me some typing (:D)
Some might find this useless, but to me xtypes for plugins, or for any class whose definition at instantiation can be pre-defined and loaded from the server, is a must.
(This isn't really a plugin since this class isn't plugged into a component)
Ext.ns("Ext.ux.component.patches");
Ext.ux.component.patches.ComponentPluginsXTypesPatch = function(){
return {
onInitPlugin : function(p){
var isXtype = ( p.xtype && typeof p.init != 'function' );
if(isXtype){
var i = this.plugins.indexOf(p);
p = Ext.ComponentMgr.create(p);
this.plugins[i] = p.init(this);
}
return !isXtype; //if isXtype, return false (i.e, do not use initPlugin)
},
install : function(){
Ext.Component.prototype.initPlugin = Ext.Component.prototype.initPlugin.createInterceptor(this.onInitPlugin);
}
}
}();
Ext.ux.component.patches.ComponentPluginsXTypesPatch.install();
//now you can:
//sample plugin for a grid. let's say, saki's Ext.ux.grid.Search
Ext.ux.grid.Search = function(){
....
}
Ext.extend(Ext.ux.grid.Search, Ext.util.Observable, {
...
});
//at the end:
Ext.reg('grid_search_by_saki', Ext.ux.grid.Search);
//using the plugin:
var grid = new Ext.grid.GridPanel({
plugins : [{
xtype : 'grid_search_by_saki', <OTHER _CONFIG_OPTIONS>
}]
});
Why do this?
1.) If you are retrieving your object's definiton asynchronously, then you can now include plugins in the definition. Like this:
var loader = new ComponentLoaderClass({
url : '...'
});
loader.on("load", function(def){
//assume that def is a json that contains the plugin's defintion with xtype's
var grid = new Ext.grid.GridPanel(def.gridDefinition)
grid.render();
})
2.) saves me some typing (:D)
Some might find this useless, but to me xtypes for plugins, or for any class whose definition at instantiation can be pre-defined and loaded from the server, is a must.