PDA

View Full Version : Referencing the application instance in a View



parky128
25 Jan 2012, 5:02 AM
Hi,

Under PR3 I was able to set a global variable for my Application instance so I could reference it from functions defined in some of my views.

So for example, in my Application launch function I could do:


MyAppName.app = this;

And then in a function in my view I could then get to some other globals defined in my Application class such as:


MyAppName.app.selectedUntID

But MyAppName.app is coming up as undefined for me in PR4 now. I know I get an 'application' variable in the Controller class, can I achieve this in my View classes?

estesbubba
25 Jan 2012, 6:38 AM
We have a rule with our Sencha MVC development that views know nothing about controllers (and application is a controller). In your case I would make a singleton class that views/controllers/application can all access. The alternative would be for your view to fire a custom event that the application listens to and makes the changes.

parky128
25 Jan 2012, 9:05 AM
Ok, I must be coding this in a poor way....

In my application class I am defining some globals like so:


Ext.application({
name: 'MyApp',
controllers: ['Login','MainView','Unit','GMap','History', 'Preferences', 'HistoryCriteria','LogoutAction'],
models: ['UserPreferences','TrackingList','CurrentGrid','History','Journey', 'Placemarker'],
stores: ['UserPreferences','TrackingListWithShowAll','TrackingList','CurrentGrid','History','Journey', 'Placemarkers'],
userIsLoggedIn: false,
wsClient:null,
loginWin: null,
loadMask: null,
sessionDataLoaded: false,
waitingForSessionCheckResponse: false,
launch: function() {

....


From what your saying, I should probably have any globals reside in this singleton class correct?

estesbubba
25 Jan 2012, 9:18 AM
I like the idea of a singleton for global application data. Our application classes are pretty dumb mainly defining name, controllers, and launch.

bweiler
25 Jan 2012, 10:58 AM
We have a rule with our Sencha MVC development that views know nothing about controllers (and application is a controller). In your case I would make a singleton class that views/controllers/application can all access. The alternative would be for your view to fire a custom event that the application listens to and makes the changes.

I think keeping the architecture clean is a good goal. However, it is not clear how to accomplish some tasks such as firing an event from a view to a controller. I'm still using the following hack to do this.

The listener is defined in the controller:


this.getApplication().on({
geocoded: function(){console.log("geocode event fired");},
...
});


I need to fire the event from the view. However, views don't know about applications, so I have to use a global variable.


globals.application.fireEvent('geocoded');


What is the recommended approach to firing application events from views?

Thanks

parky128
25 Jan 2012, 12:17 PM
How did you define your globals variable so the rest of the app could see it?

bweiler
25 Jan 2012, 2:03 PM
I just used the app namespace. This is not a great idea, but it is an easy workaround to some of the object reference issues.

MyApp.globals (or whatever you like that won't result in a namespace collision)

jay@moduscreate.com
25 Jan 2012, 4:33 PM
Views should never access an application. They should only fire events and the controllers should react to those events.

bweiler
25 Jan 2012, 5:16 PM
Assuming code in the controller similar to:

this.getApplication().on({
myevent: this.respondToEvent
}).

What is the code you use in a view to fire an event that will be picked up by the controller?

estesbubba
26 Jan 2012, 7:40 AM
Looking at the guides would be a good idea as this is basic Sencha MVC. This would be a good place for your problem:

http://docs.sencha.com/touch/2-0/#!/guide/controllers

JHuybrighs
26 Jan 2012, 8:35 AM
Isn't the answer to this question simply that there is no way anymore (since 2-pr3 I think) for the view class to have code that fires an event that can be picked up by a controller or dispatch an action request to a controller?
I read that if a user action in a view must notify a controller that it is the responsibility of the target controller itself to listen on the UI component. Like in:


...
init: function() {
this.control({'button[action=showSongs]': { tap: this.showSongs } });
},
...

I keep on having problems with this concept since it binds controllers to specific view elements; controllers must reference things like: button, xtypes, etc. Most of today's MVC frameworks come with a much looser binding.

Anyhow, we have to live with this I think since it seems to be at the core now of Sencha's architecture.

jay@moduscreate.com
26 Jan 2012, 3:22 PM
Even though this was for early sencha touch 2.0, take a look at this video: http://vimeo.com/34052884

I plan on doing screencasts and blog posts on this once ST2 stabilizes. :)