Globalizeを使ってメッセージのローカライズを行う


Globalizeとsprintfを使って、UIのメッセージやValidateメッセージのローカライズに対応します。
Globalizeはメッセージのローカライズを、sprintfはプレースホルダとして使用します。

## Install

Globalizeは下記のリンクからcheckoutして必要なファイルをコピーします。
https://github.com/jquery/globalize/

sprintfは下記のリンクからダウンロードします。
http://sprintf.googlecode.com/files/sprintf-0.7-beta1.js


globalize.cultures.jsのサイズが大きいので、culturesの下にある必要な言語のみ残して、minifyすることをお勧めします。

```html
<script src="lib/sprintf.js"></script>
<script src="lib/globalize.js"></script>
<script src="lib/cultures/globalize.cultures.js"></script>
<script src="src/msg.js"></script>
```

## ローカライズメッセージの作成

UI用メッセージやValidateエラー時に出力するメッセージ、エラーメッセージなどを記述します。
普通は言語ごとに作成した方がよいでしょう。

```javascript:src/msg.js
(function(global) {
var Globalize;
Globalize = global.Globalize;

Globalize.addCultureInfo('en', {
  messages: {
    // UI messages.
    'loading': 'Loading',
    'save': 'Save',
    'edit': 'Edit',

    // Validate messages.
    'empty_attr': '%(attr)s is empty',

    // Error messages.
    'err_not_found': 'Not found %s',
    'err_tech_support': '%s. Please contact the technical support'
  }
});

Globalize.addCultureInfo('ja', {
  messages: {
    // UI messages.
    'loading': '読み込み中',
    'save': '保存',
    'edit': '編集',

   // Validate messages.
   'empty_attr': '%(attr)s が空です',

   // Error messages.
   'err_not_found': '%s が見つかりません',
   'err_tech_support': '%s。テクニカルサポートにご連絡ください'
  }
});
}(this));
```

##メッセージユーティリティーの作成

sprintfとglobalizeを組み合わせて使用するので、ユーティリティーを作成した方がよいでしょう。それ以外にも、Globalizeは数値/日時/通貨のフォーマットやパースが可能なのでそちらもあわせて使ってみるとよいでしょう。

```Javascript
  /*!
   * Globalize wrapper functions.
   */
  module.Message = {
    /**
     * @param {string} key
     *    A localize message key.
     * @param {(string|Object)=} options
     *    sprintf named arguments OR string.
     * @param {string=} culture
     *    Culture names,
     *    "en", ["en-US", "ja"], "fr;q=0.4, es;q=0.5, he"(RFC2616 sec 14.4.).
     * @return {string} the replaced message.
     */
    getMessage: function(key, options, culture) {
      var opts = options || {},
          locStr = Globalize.localize(key, culture);
      return sprintf(locStr, opts);
    },
    /**
     * @param {(Date|number)} value
     *    A value according to the given format string.
     * @param {string} format
     *    A format string of globalize.
     * @param {string=} culture
     *    Culture names,
     *    "en", ["en-US", "ja"], "fr;q=0.4, es;q=0.5, he"(RFC2616 sec 14.4.).
     * @return {string} the formatted value.
     */
    format: function(value, format, culture) {
      return Globalize.format(value, format, culture);
    }
  };

```

##使う

###UI message

```Javascript
var msg = Message.getMessage('loading');
$('#loading span').text(msg);
```

###データ属性のvalidate

Backbone.Modelのvalidateのエラーメッセージとして使います。

```Javascript
var model = Backbone.Model.extend({
  [… snip …]
  // Backbone.Modelのvalidate(問題なければnullを返し、そうでなければ何か返す)
  validate: function(attrs) {
    var errors = [];
    if (!(_.isString(this.get('id')) && this.get('id').length > 0)) {
      var msg = Message.getMessage('empty_attr', {attr: 'id'});
      errors.push(msg);
    }
    if (!(_.isString(this.get('title')) && this.get('title').length > 0)) {
      var msg = Message.getMessage('empty_attr', {attr: 'title'});
      errors.push(msg);
    }
    return _.any(errors) ? errors : null;
  },
  [… snip …]
});

```

##参考

[Going Global with JavaScript and Globalize.js](http://www.bytelevelbooks.com/books/global_javascript.html, "Going Global with JavaScript and Globalize.js")
[JavaScript sprintf - Dive Into JavaScript](http://www.diveintojavascript.com/projects/javascript-sprintf, "JavaScript sprintf - Dive Into JavaScript")