Localization with json file

[Petitbomber]

Hello,
I tried to implement a possibility to translate my Sencha Touch interface by putting the text in a json file.

The solution with Ux.locale.Manager is too complicated for me (make myself the overriden of several components).
Here is a proposal. I wait for your notes and improvements...

In app.js :

Ext.application({
    ...
    requires: [
    ...
    'myapp.util.locale'
    ],
... 

The locale.js (in app/util):

Ext.define('myapp.util.locale', {
    singleton: true,
    alternateClassName: 'locale',
    requires: ['Ext.Ajax'],
    config: {
        st: ""
    },
    constructor : function(config) {
            me=this;
            Ext.Ajax.request({
                       url: './resources/locales/lang.json',
                       async:false,
                       method: 'POST',
                       success: function(result){
                            me.config.st = Ext.decode(result.responseText, true);
                            me.initConfig(config);
                            //me.callParent([config]);
                       },
                       failure: function(response) {
                            Ext.Msg.alert('Error localization');
                       }
        });
    }
}); 

An exemple of lang.json (in resources/locales):

{
"tabs": {
    "board": " Dashboard",
    "clocks": "clocks"
},
"msg": {
    "loading": " loading",
    "error": "Error"
}
} 

And a use in panel :

Ext.define("myapp.view.tablet.Main", {
...
{
            xtype: 'myboard',
           title: locale.getSt().tabs.board,
... 

[mitchellsimoens]

The reason the manager is more complicated as it supports changing the text dynamically. It started off something like what you're doing but would not work for changing text dynamically. The overrides aren't complicated, they are used because there are different ways of changing the text dynamically for different components. For example you do a setHtml method call on a Ext.Component but a setText on a Ext.Button.

[Petitbomber]

Hello,
I agree with you. Your solution is more powerful than mine.
It's just that I don't need to change the text dynamically and that the overrides is not complicated for you but difficult for me: I try it but I was fast discouraged...

If you have advice to improve my method. It's welcome.

[Scorpie]

I use https://github.com/elmasse/Ext.i18n.Bundle-touch for this. Works great.

[Petitbomber]

Thanks.
I will try that.

[Petitbomber]

I have test that i18n.bundle.touch solution.
The old version have issues in MVC applications.
The new version with css is great but you can't use it for fields (in placeholder, options...) and to translate text in a function.
Too bad...