Thursday, April 22, 2010

Quick add multiple language to extjs + grails application

Recently we quick added multiple language to our application. To see demo, you can login @ www.feyasoft.com/main

1: In database, we create a table which hold on the setting for language.

2: In grail MainController file, add the following code:
/**
 * Copyright (c) 2005 - 2010 FeyaSoft Inc. All Rights Reserved.
 */
import grails.converters.*

class MainController extends GeneralController {

    def index = {
        // get login user id
        User loginUser = getLoginUser()
        if (loginUser == null) {
            def json = [failure : "true", errorInfo : "Please login before post"]
            render json as JSON
        }

        def item = UserSetting.findByAuthor(loginUser);
        def lang = 'en'
        if (item) lang = item.language;

        render(view: 'main', model: [lang: lang])
    }
}

3: In main.gsp file, the following code are added, really simple:
    <~g:javascript library="extjs/src/locale/ext-lang-${lang}" /~>
    <~g:javascript library="feyaSoft/lang/${lang}" /~>
And you need create the related lang file now. For example, we have this lang file under my folder: web-app\js\feyaSoft\lang\en.js
/**
 * FeyaSoft Online MyActivity
 * Copyright(c) 2006-2010, FeyaSoft Inc. All right reserved.
 * info@feyasoft.com
 */
Ext.ns("feyaSoft");

feyaSoft.lang = {

    'common':{
        'accessories': 'Accessories',
        'align': 'Align',
        'average': 'Average',
        'brush': 'Brush',
        'calculate': 'Calculate',
....}
...
}

4: Now you can use something like this in your JS file:
    feyaSoft.lang.common['average']    
And you are on fly now.

No comments: