[TYPO3-mvc] Few proposals for mvc_extjs view branch

[Dennis Ahrens]

Hi Dmitri,

Dmitri Pisarev wrote:
>> In our new project i'd like to have another gui architecture - with
>> classes which are responsible for (extjs) object creation and
>> application flow inside the gui.
> It's a mystery for me, how to write gui for large applications so it 
> shall remain clean. Do you think it's not possible to do it in pure JS, 
> with only domain model related stuff generated through the viewHelpers?
> Anyway, this is very important topic, and very relevant to me, let's see 
> if I can provide some feedback on this.
> BTW, the way you extend ExtJS classes for configuration, seems to be not 
> a very good architecture, ExtJS specialist suggest to use factories for 
> that, and only use Extend when you change some functionality.

I was talking about js related architecture. Your hint related to 
Ext.extend is interesting. ATM i have started to "kickstart" a new gui, 
which will become big. How would you design a factory?
I've started to write a ComponentFactory Class as a singleton, which has 
  public methods for each component i'd like to create.

It looks like this atm:

Ext.ns('FhhQmdocs.Module');
/**
  * Creates predefinied Components
  *
  * @class FhhQmdocs.Module.ComponentFactory
  * @singleton
  */
FhhQmdocs.Module.ComponentFactory = function() {
	
	var documentStore;
	var documentGrid;
	
	var createDocumentStore = function() {
		documentStore = new Ext.data.DirectStore({
			storeId: 'DocumentStore',
			reader: new FhhQmdocs.Module.DocumentJsonReader,
			writer: new FhhQmdocs.Module.DocumentJsonWriter,
			api: {
				read: FhhQmdocs.Module.Remote.DocumentController.list
			},
			autoLoad: true,
			restful: false,
			batch: false,
			remoteSort: false
		});
	};
	
	var createDocumentGrid = function() {
		createDocumentStore();
		documentGrid = new Ext.grid.GridPanel({
			columns: FhhQmdocs.Module.DocumentColumns,
			region: 'center',
			id: 'DocumentGrid',
			store: documentStore,
			viewConfig: {
				forceFit: true
			}
		});
	};
	
     return Ext.apply(new Ext.util.Observable, {
         createDocumentGrid: function() {
     		return documentGrid;
         }
     })
}();

>> Another approach may be annotation based code generation. Think about
>> somthing like this:
>>
>> ViewHelper-Code:
>> <ext:includeDomainAnnotations />
>>
>> Class Annotation:
>> /**
>> * [...]
>> * @extjs form gridcolumn
>> */
>>
>> Variable Annotation
>> /**
>> * [...]
>> * @validate StringLength(minimum = 2, maximum = 80)
>> * @form <configuartion>
>> * @gridcolumn <configuration>
>> */
>>
>> Maybe it is senseful to inculde information from TCA, too.
> I didn't quite get this part. Annotations to what class are those? Some 
> viewhelper?

I thought about annotation related to domain model classes.

> And one more note, your viewhelper classes should be more easy to 
> extend. For example, to add the 'total' parameter to your 
> StoreReadResponseViewHelper.php class, I had to rewrite the whole class, 
> there was not much to extend. In typo3v4 era, there were hooks, now what?=)

The ViewHelpers in the json-package aren't nice to extend, thats right. 
Those in the jsCode-package are a bit better for this intention. Have a 
look at the StoreViewHelper and i.e. the GroupingStoreViewHelper.
But i think that those ViewHelpers aren't as useful as i thought when 
writing them down... In the current project i'll try to have the json 
code for a store in pure javascript - as you can see in the factory code 
above.

regards
Dennis