Merge pull request #518 from hainingzhang/master

update i18n guide
This commit is contained in:
Haining Henry Zhang 2016-07-12 18:05:01 +08:00 committed by GitHub
commit 4f1960a6eb
2 changed files with 60 additions and 55 deletions

View File

@ -0,0 +1,60 @@
## Developer's Guide for Internationalization (i18n)
*NOTE: All the files you created should use UTF-8 encoding.*
### Steps to localize the UI in your language
1. Copy the file `static/resources/js/services/i18n/locale_messages_en-US.js` to a new file in the same directory named `locale_messages_<language>_<locale>.js` .
The file contains a JSON object named `locale_messages`, which consists of key-value pairs of UI strings:
```
var local_messages = {
'sign_in': 'Sign In',
'sign_up': 'Sign Up',
...
};
```
In the file `locale_messages_<language>_<locale>.js`, translate all the values into your language. Do not change any keys.
2. After creating your locale file, you should include it from the HTML page header template.
In the file `views/sections/header-include.htm`, look for a `if` statement which switch langauges based on the current language (`.Lang`) value. Add in a `else if` statement for your language:
```
{{ if eq .Lang "zh-CN" }}
<script src="/static/resources/js/services/i18n/locale_messages_zh-CN.js"></script>
{{ else if eq .Lang "en-US"}}
<script src="/static/resources/js/services/i18n/locale_messages_en-US.js"></script>
{{ else if eq .Lang "<language>-<locale>"}}
<script src="/static/resources/js/services/i18n/locale_messages_<language>-<locale>.js"></script>
{{ end }}
```
3. Add the new language to the `I18nService` module.
In the file `static/resources/js/services/i18n/services.i18n.js`, append a new key-value item to the `supportLanguages` object. This value will be displayed in the language dropdown list in the UI.
```
var supportLanguages = {
'en-US': 'English',
'zh-CN': '中文',
'<language>-<locale>': '<language_name>'
};
```
**NOTE: Don't miss the comma before the new key-value item you've added.**
4. In the directory `static/i18n/`, copy the file `locale_en-US.ini` to a new file named `locale_<language>-<locale>.ini`. In this file, translate all the values on the right hand side into your language. Do not change any keys.
5. Add the new language to the `app.conf` file.
In the file `Deploy/config/ui/app.conf`, append a new item to the configuration section.
```
[lang]
types = en-US|zh-CN|<language>-<locale>
names = en-US|zh-CN|<language>-<locale>
```
6. Next, change to `Deploy/` directory, rebuild and restart the Harbor by the below command:
```
docker-compose down
docker-compose up --build -d
```

View File

@ -1,55 +0,0 @@
# Developer's guide for internationalization
*NOTE: All the files you created should be in UTF-8 encoding.*
>**For the front-end i18n works,**
1. You need to create a JavaScript i18n source file under the diretory `/static/resources/js/services/i18n`, it should be named as `locale_messages_<language>_<locale>.js` with your localized translations.
This file contains a JSON object named `locale_messages`, and the sample pattern should be like below,
```
var local_messages = {
'sign_in': 'Sign In'
};
```
**NOTE: Please refer the keys which already exist in other i18n files to make your corresponding translations as your locale.**
2. After creating this locale file, you should include it into the HTML page header template.
In the file, `/views/sections/header-include.htm`. This template would be rendered by the back-end controller, with checking the current language (`.Lang`) value from the request scope, at each time there is only one script tag would be rendered at front-end page.
```
{{ if eq .Lang "zh-CN" }}
<script src="/static/resources/js/services/i18n/locale_messages_zh-CN.js"></script>
{{ else if eq .Lang "en-US"}}
<script src="/static/resources/js/services/i18n/locale_messages_en-US.js"></script>
{{ else if eq .Lang "<language>-<locale>"}}
<script src="/static/resources/js/services/i18n/locale_messages_<language>-<locale>.js"></script>
{{ end }}
```
3. Add the new coming language to the `I18nService` module.
In the file, `/static/resources/js/services/i18n/services.i18n.js`, append new key-value item to the `supportLanguages` object.
```
var supportLanguages = {
'en-US': 'English',
'zh-CN': '中文',
'<language>-<locale>': '<language_name>'
};
```
**NOTE: Don't miss to add a comma ahead of the new key-value item you've added.**
>**For the back-end i18n works,**
1. Create a file under the directory `/static/i18n/`, named as `locale_<language>-<locale>.ini`.
**NOTE: Please refer the keys which already exist in other i18n files to make your corresponding translations as your locale.**
2. Add the new comming language to the `app.conf` file.
In the file, `/Deploy/config/ui/app.conf`, append new item to the configuration section.
```
[lang]
types = en-US|zh-CN|<language>-<locale>
names = en-US|zh-CN|<language>-<locale>
```
>**Rebuild and start the Harbor project by using 'docker-compose' command.**