Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

Commit 3ee3778

Browse files
committed
docs(cb-i18n): revamped to System.import the translation file
1 parent fa90659 commit 3ee3778

File tree

13 files changed

+187
-154
lines changed

13 files changed

+187
-154
lines changed
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
// #docregion
2+
import { TRANSLATIONS, TRANSLATIONS_FORMAT, LOCALE_ID } from '@angular/core';
3+
4+
export function getTranslationProviders(): Promise<Object[]> {
5+
6+
// Get the locale id from the global
7+
const locale = document['locale'] as string;
8+
9+
// return no providers if fail to get translation file for locale
10+
const noProviders: Object[] = [];
11+
12+
// No locale or English: no translation providers
13+
if (!locale || locale === 'en') {
14+
return Promise.resolve(noProviders);
15+
}
16+
17+
// Ex: 'i18n/fr/messages.fr.xlf`
18+
const translationFile = `./i18n/${locale}/messages.${locale}.xlf`;
19+
20+
return getTranslationsWithSystemJs(translationFile)
21+
.then( (translations: string ) => [
22+
{ provide: TRANSLATIONS, useValue: translations },
23+
{ provide: TRANSLATIONS_FORMAT, useValue: 'xlf' },
24+
{ provide: LOCALE_ID, useValue: locale }
25+
])
26+
.catch(() => noProviders); // ignore if file not found
27+
}
28+
29+
declare var System: any;
30+
31+
function getTranslationsWithSystemJs(file: string) {
32+
return System.import(file + '!text'); // relies on text plugin
33+
}

public/docs/_examples/cb-i18n/ts/app/i18n/fr/main.ts

Lines changed: 0 additions & 33 deletions
This file was deleted.

public/docs/_examples/cb-i18n/ts/app/i18n/fr/messages.fr.1.ts

Lines changed: 0 additions & 5 deletions
This file was deleted.

public/docs/_examples/cb-i18n/ts/app/i18n/fr/messages.fr.ts

Lines changed: 0 additions & 17 deletions
This file was deleted.
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
// #docregion
2+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3+
4+
import { AppModule } from './app.module';
5+
6+
platformBrowserDynamic().bootstrapModule(AppModule);
Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
// #docregion
2-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
2+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3+
import { getTranslationProviders } from './i18n-providers';
34

45
import { AppModule } from './app.module';
56

6-
const platform = platformBrowserDynamic();
7-
platform.bootstrapModule(AppModule);
7+
getTranslationProviders().then(providers => {
8+
const options = { providers };
9+
platformBrowserDynamic().bootstrapModule(AppModule, options);
10+
});

public/docs/_examples/cb-i18n/ts/app/i18n/fr/messages.fr.xlf renamed to public/docs/_examples/cb-i18n/ts/i18n/fr/messages.fr.xlf

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44
<body>
55
<trans-unit id="af2ccf4b5dba59616e92cf1531505af02da8f6d2" datatype="html">
66
<source>Hello i18n!</source>
7-
<target/>
7+
<target>Bonjour i18n!</target>
88
<note priority="1" from="description">An introduction header for this sample</note>
99
<note priority="1" from="meaning">User welcome</note>
1010
</trans-unit>
1111
</body>
1212
</file>
13-
</xliff>
13+
</xliff>

public/docs/_examples/cb-i18n/ts/index.html

Lines changed: 15 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7,39 +7,33 @@
77
<meta name="viewport" content="width=device-width, initial-scale=1">
88
<link rel="stylesheet" href="styles.css">
99

10-
<!-- 1. Load libraries -->
11-
<!-- #docregion libraries -->
12-
<!-- #docregion polyfills -->
13-
<!-- Polyfill(s) for older browsers -->
1410
<script src="node_modules/core-js/client/shim.min.js"></script>
15-
<!-- #enddocregion polyfills -->
1611

1712
<script src="node_modules/zone.js/dist/zone.js"></script>
1813
<script src="node_modules/reflect-metadata/Reflect.js"></script>
1914
<script src="node_modules/systemjs/dist/system.src.js"></script>
20-
<!-- #enddocregion libraries -->
2115

22-
<!-- 2. Configure SystemJS -->
23-
<!-- #docregion systemjs -->
2416
<script src="systemjs.config.js"></script>
25-
<!-- #docregion main -->
17+
18+
<!-- #docregion i18n -->
2619
<script>
27-
var lang = 'fr';
28-
var main;
29-
switch (lang) {
30-
case 'fr': main = 'app/i18n/fr/main'; break;
31-
default: main = 'app'; break;
32-
}
33-
System.import(main).catch(function(err){ console.error(err); });
20+
// Get the locale id somehow
21+
document.locale = 'fr';
22+
23+
// Map to the text plugin
24+
System.config({
25+
map: {
26+
text: 'systemjs-text-plugin.js'
27+
}
28+
});
29+
30+
// Launch the app
31+
System.import('app').catch(function(err){ console.error(err); });
3432
</script>
35-
<!-- #enddocregion main -->
36-
<!-- #enddocregion systemjs -->
33+
<!-- #enddocregion i18n -->
3734
</head>
3835

39-
<!-- 3. Display the application -->
40-
<!-- #docregion my-app -->
4136
<body>
4237
<my-app>Loading...</my-app>
4338
</body>
44-
<!-- #enddocregion my-app -->
4539
</html>
Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
11
{
22
"description": "i18n",
33
"files": [
4-
"!**/*.d.ts",
5-
"!**/*.js",
4+
"app/**/*.css",
5+
"app/**/*.html",
6+
"app/**/*.ts",
7+
"i18n/messages.xlf",
8+
"i18n/fr/messages.fr.xlf",
9+
610
"!**/*.[1].*",
7-
"!**/*.metadata.json"
11+
12+
"styles.css",
13+
"systemjs-text-plugin.js",
14+
"index.html"
815
],
916
"tags": ["i18n"]
10-
}
17+
}
Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
// #docregion
2+
/*
3+
SystemJS Text plugin from
4+
https://github.com/systemjs/plugin-text/blob/master/text.js
5+
*/
6+
exports.translate = function(load) {
7+
if (this.builder && this.transpiler) {
8+
load.metadata.format = 'esm';
9+
return 'exp' + 'ort var __useDefault = true; exp' + 'ort default ' + JSON.stringify(load.source) + ';';
10+
}
11+
12+
load.metadata.format = 'amd';
13+
return 'def' + 'ine(function() {\nreturn ' + JSON.stringify(load.source) + ';\n});';
14+
}

0 commit comments

Comments
 (0)