PDA

View Full Version : Class Instances in a "Big Application"



mark.lozano
12 Aug 2010, 3:38 PM
I recently read Saki's article: Writing a Big Application in Ext (http://blog.extjs.eu/know-how/writing-a-big-application-in-ext/). It was a great read and I have begun moving over my application creation to this pattern. However, I'm curious how to access the actual instance of the app I've created.

Right now, for lack of a better idea, I have the following in my main application JS:


// application main entry point
Ext.onReady(function() {

Ext.QuickTips.init();

// code here
WebApp.instance = new WebApp.ViewPort();

}); // eo function onReady

For this example, WebApp.ViewPort is defined as so:


WebApp.ViewPort = Ext.extend(Ext.Viewport, {

initComponent:function()
{
var config = {
layout:'border'
,items: [
{
xtype: 'wt-banner',
region: 'north'
}
,{
xtype: 'wt-app-panel'
}
,{
xtype: 'wt-banner',
region: 'south'
}
]
,renderTo: Ext.getBody(),

someMethod : function()
{
// do something useful here.
}
}; // eo config object

// apply config
Ext.apply(this, Ext.apply(this.initialConfig, config));

WebApp.ViewPort.superclass.initComponent.apply(this, arguments);
} // eo function initComponent
});

When some code in a preconfigured component (like that wt-app-panel) needs to call a method on that main viewport, I do the following:


WebApp.instance.someMethod();

Is there a better way?