Documentation is awful and vague - how to find stuff and name things?

Documentation is awful and vague - how to find stuff and name things?

Somebody needs to sit down and write a "theory of operation" for this framework because there seems to be an awful lot of magic running around and I'm struggling over and over with some very basic concepts.

1) Normal MVC typically has a Controller manage one or more Views. How one is supposed to associate a controller to a view remains a total mystery to me. I'm used to iPhone development, have done Smalltalk, Cocoa, Motif, lots of other MVC frameworks. This one acts like none of those. So while I can add an event handler to a button, how do I actually get that to call the appropriate method in my controller?

2) As many designers I created a bunch of standalone views for the various screens first. Now I want to create a matching controller for each. Controllers have a 'views' attribute. Dragging a view into that or naming it results in a dialog that asks if I'd now like to delete the "copy" of the view? WTF? Seriously I need somebody to draw me a flamin' picture of how all this stuff fits together.

3) There are way too many ways to "identify" things. We have userAlias, id, itemID, userClassName and who knows what else. Stores seem to have even more handles or names.

4) Screen navigation - the iOS way this is handled makes sense - a controller manages one or more views. Pushing a controller onto a navigation controller displays its view. How this is supposed to work with Architect I have no idea but I ended up creating a top level card view and calling "setActiveItem" to swap views. Probably there is a better way to do this but I can't find it.

5) Stores have models if I create the store itself. But why does the Model have a store attribute? Is this supposed to be a bidirectional link?

Really frustrated and I'm pretty close to abandoning this tool as being way too complex but I like your widget set. I don't give a fig about the models or the stores, I use web local SQL (sqlite) and JQuery ajax and I prefer that but I like the controllers for partitioning logic so - how can I actually use them if I can't reference the controller from the view?

Last edited by CarClub; 17 May 2012 at 2:01 PM.
Reason: More questions

The documentation just got a big refresh and more will come in matter of days, and we'll keep working on it until we stop getting messages like yours. We understand the current state of the docs is frustrating and we're working on improving things.

I appreciate the sympathy but I was hoping to get some answers as well. I'm happy to beta read and proof half baked docs.

I had some success with the SqlliteProxy today - this needs to be built into the framework BTW. Web sql is a fact of life on mobile browsers and I already have code to clone chunks of a db to the local sql db.

More questions - does a store install itself as a listener on every model object it vends? I can't see how I'm supposed to update an object and save its changes vs adding or deleting one. This could be more explicit as well.

1) Normal MVC typically has a Controller manage one or more Views. How one is supposed to associate a controller to a view remains a total mystery to me. I'm used to iPhone development, have done Smalltalk, Cocoa, Motif, lots of other MVC frameworks. This one acts like none of those. So while I can add an event handler to a button, how do I actually get that to call the appropriate method in my controller?

Inside of Architect, you can add a view to a controller by selecting the controller, going to the views configurations in the property grid and typing the name of the view (or selecting the dropdown and choosing a view).

Within a controller, you can respond to an event via a "Controller Action". Select the controller, double click on controller action from the toolbox. First you will want to choose what type of view you want to subscribe to by choosing the "targetType" configuration of the controller action. Now that Architect knows what type of view you are subscribing to, it can provide you the "name" of the events available, select one via the dropdown in "name". Once you've chosen the event name architect has everything it needs to subscribe to all ui controls of that type.

For example in a Touch project, if we chose Ext.Button and then the tap event. Architect will automatically generate a onButtonTap method (which you can rename). It will also generate a controlQuery of "button". controlQueries specify which ui controls to pay attention to. It's akin to a css selector but for components instantiated on the page. Double clicking on the controller action will allow you to swap to code view and begin editing what behavior is triggered when a user taps on the button.

Originally Posted by CarClub

2) As many designers I created a bunch of standalone views for the various screens first. Now I want to create a matching controller for each. Controllers have a 'views' attribute. Dragging a view into that or naming it results in a dialog that asks if I'd now like to delete the "copy" of the view? WTF? Seriously I need somebody to draw me a flamin' picture of how all this stuff fits together.

By default when a view is added to the canvas, it is automatically added to the top level Application. Whenever the application is launched it will load these views. Architect is asking you if you would like to keep that view associated with the Application node when you add it to the controller. This is something that only you would know the answer to and we cannot guess.

Originally Posted by CarClub

3) There are way too many ways to "identify" things. We have userAlias, id, itemID, userClassName and who knows what else. Stores seem to have even more handles or names.

Each of these configurations mean and do different things. Each piece is not bound to the actual ui node that shows up in the inspector, they actually do things for the code generation. We have the intent to create a "description" field that would have priority over all of these (except userClassName) that does nothing but allow you to describe things in the Architect ui. (It would not affect code generation).

Originally Posted by CarClub

4) Screen navigation - the iOS way this is handled makes sense - a controller manages one or more views. Pushing a controller onto a navigation controller displays its view. How this is supposed to work with Architect I have no idea but I ended up creating a top level card view and calling "setActiveItem" to swap views. Probably there is a better way to do this but I can't find it.

>For example in a Touch project, if we chose Ext.Button and then the tap event. Architect will automatically generate a onButtonTap method (which you can rename). It will also generate a controlQuery of "button". controlQueries specify which ui controls to pay attention to. It's akin to a css selector but for components instantiated on the page. Double clicking on the controller action will allow you to swap to code view and begin editing what behavior is triggered when a user taps on the button.

So I tried this. I associated my view with my controller. I added an action in the controller with target Ext.button and event touch. Great. However this gets every single button touch in the application. Not really useful. How do I make it more specific? And what is a control query?

I've also uncovered what I think is a bug. I have two views - a login view and a main view (it is basically a form).

Each view has a submit button in it.

I created the action with target Ext.button in the login controller for touch and it created a function onLogin_touch or something.

I tried to do the same with the submit button in main and it insisted on creating a function called onLogin_touch and then complains that the function isn't configured correctly.

I've read it. I'm still reading it. I have half a dozen windows open on it. Hence this post. The foundation material is tremendously vague. The reference material is even worse, and the examples all show the wrong way to do things basically ignoring controllers entirely.

Here's an example.

Read the "Refs" section in Controllers.

config:{ refs:{ nav:'#mainNav'}}what is with the # in front of mainNav? Why is it there? Somewhere there is a button called mainNav I guess, how do I give that button the identifier mainNav? Do I need to specify the hash character on the button or is that implied? Which of button's many fields would I set? cls, id, itemId (I have no idea the difference between id and itemId nor can I find an explanation).

So then I gather an accessor called getNav() will be implied by creation of this ref. Nifty.

I encounter several other foreign concepts here. I am introduced to ComponentQuery - great.

This is a little bit better in that it looks like you've nicked the css selector syntax which is cool. id and itemId are apparently equivalent and use the #, this is kind of better but I still don't understand the difference between them.

Then we have xtype. There is an explanation of the common ones, but I have no idea how to assign one to something I create.

I appreciate the help, but I'm still really struggling after a week to put all this stuff together and I have to ship a beta today. Most likely it is gonna have all the logic in the views for now.

You could have simplified the docs a lot by saying they use the same syntax as css selectors and JQuery and then a nice comprehensive list of what properties in the view objects map to css concepts like class, id, attribute.....and I think most people would have it.