MVC, Ext.direct & "the Tools"

[sysrun]

Hi,

im not getting it:

If i use this code, all my App-Files where packed in the app-all.js BUT the Ext.direct-Calls in my stores throwing errors "Undefined" direct-functions.

Ext.require(['Ext.direct.Manager',"Bonusserver.REMOTING_API"],function(){
    	Ext.direct.Manager.addProvider(Bonusserver.REMOTING_API);
},this);
	Ext.application({
    name: 'Bonus',

    appFolder: 'extapp',

	
	requires:[
		'Ext.direct.*',
		'Bonus.*',
		'Ext.view.*'
	],
	

	controllers: [
		'XXX'
	],


    autoCreateViewport: true

    }
});

If i use this code, the Ext.direct part is ok BUT none of my App-Files would be included in the app-all.js:

Ext.require(['Ext.direct.Manager',"Bonusserver.REMOTING_API","Ext.app.Application"],function(){
    	Ext.direct.Manager.addProvider(Bonusserver.REMOTING_API);
	Ext.application({
    name: 'Bonus',

    appFolder: 'extapp',

	
	requires:[
		'Ext.direct.*',
		'Bonus.*',
		'Ext.view.*'
	],
	

	controllers: [
		'XXX'
	],


    autoCreateViewport: true

    }
});

},this);

So, how to use ExtMVC together with Ext.direct and the Sencha-Tools?

[mitchellsimoens]

What happens if you use addProvider within the Ext.application's launch method? This will need to be reworked as you are using autoCreateViewport though.

[sysrun]

Like this code?

	Ext.application({
...

    autoCreateViewport: true,
    launch: function() {
        Ext.direct.Manager.addProvider(Bonusserver.REMOTING_API);
    }
    }
});

This will need to be reworked as you are using autoCreateViewport though.

So i cant use autoCreateViewport?

[sysrun]

Tried this Code in my app.js:

Ext.require('Ext.direct.Manager',function(){
	Ext.direct.Manager.addProvider(Bonusserver.REMOTING_API);	
});

Ext.application({
    name: 'Bonus',

    appFolder: 'extapp',
	
	paths:{
		"Ext": "ext-4.0.7/src",
		"Bonus":"extapp",
		"Ext.ux":"ux"
	},

	

	controllers: [
xxx
	],


    autoCreateViewport: false,

    
	launch:function(){
		Ext.direct.Manager.addProvider(Bonusserver.REMOTING_API);
        Ext.create('Ext.container.Viewport', {
            items: {
                html: 'My App'
            }
        });		
    }
});

autoCreateViewport off and addProvider in launch-function. Same Error:

After async-load of the Model i get an error in Firebug:
Bonusserver.Mitarbeiter is undefined

Here is my Model:

Ext.define('Bonus.model.Mitarbeiter', {
    extend: 'Ext.data.Model',
    
    fields: [
        'id',
        {name: 'name',	type: 'string'},
        {name: 'email',	type: 'string'}
    ],
	
	proxy:{
		type:'direct',
		directFn:Bonusserver.Mitarbeiter.getSelect
	}

});

[bsbal]

I'm at the moment at the same point. When I include my user classes in app-all.js then my extDirect functions are broken, if I exclude my user classes from app-all.js, extDirect functions are working fine.

Is there no solution for this problem arround?

[bsbal]

I've managed it to get it working with 4.1 RC2 setting all directFn definitions (in models) in quotes and resetting directFn in controller code.

Only problem is, that proxy config has to be set in controller logic!

[mitchellsimoens]

You could set it in the constructor.

[bsbal]

Question 1: How
Question 2: Why is this necessary? Isn't it a Bug?

[mitchellsimoens]

It's not a bug. The reason is the directFn is trying to look for a JS namespaced function which until the provider returns doesn't exist. I wish there was a way to work around it which you could define as a string and then in a constructor handle that, either way there isn't an elegant solution.

Ext.define('MyApp.store.Direct', {
    extend : 'Ext.data.Store',

    ....

    constructor : function(config) {
        config = config || {};

        config.proxy = {
            ...
            directFn : Some.direct.Function
        };

        this.callParent([config]);
    }
});

[bsbal]

I've tried your suggestion but had no luck.

Store:

Ext.define('Iks.store.UserKontrolle', {
    extend: 'Ext.data.DirectStore',
    storeId: 'UserKontrolle',


    model: 'Iks.model.UserKontrolle',
    autoLoad: false,
    
   sorters: ['themengebietPos', 'themaPos'],


   constructor: function (config) {
       config = config || {};


       config.proxy = {
           type: 'direct',
           batchActions: false,
           paramOrder: 'id',
           api: {
               read: MyExt.IksService.readUserKontrolle,
               update: MyExt.IksService.updateUserKontrolle
           },
           reader: {
               type: 'json',
               root: 'result',
               idProperty: 'id'
           }


       };


       this.callParent(config);
   }
           
});

Model:

Ext.define('Iks.model.UserKontrolle', {
    extend: 'Ext.data.Model',
    fields: [
                { name: 'id', type: 'int' },
                { name: 'titel', type: 'string' },
                { name: 'beschrieb', type: 'string' },
                { name: 'verantwortlicherUser', type: 'string' },
                { name: 'reqFile', type: 'bool' },
                { name: 'bisDatum', type: 'date', dateFormat: 'MS' },
                { name: 'ergebnisText', type: 'string' },
                { name: 'status', type: 'int' },
                { name: 'modDatum', type: 'date', dateFormat: 'MS' },
                { name: 'modUser', type: 'string' },
                { name: 'thema', type: 'string' },
                { name: 'themaPos', type: 'int' },
                { name: 'themengebiet', type: 'string' },
                { name: 'themengebietPos', type: 'int' },
                { name: 'kombiPos', type: 'string' }
    ]


    
});

Without doing that in Controller,

onLaunch: function () {


        //Config Stores
        var UserKontrolleStore = Ext.getStore('UserKontrolle');
        UserKontrolleStore.proxy.api.read = MyExt.IksService.readUserKontrolle;
        UserKontrolleStore.proxy.api.update = MyExt.IksService.updateUserKontrolle;
...

it comes with following error:
'No direct function specified for this proxy' when calling method: [nsIDOMEventListener::handleEvent]