diff --git a/packages/app-shell/src/app-shell.js b/packages/app-shell/src/app-shell.js
index 15eb1cc0c0570511fcaa261f4a45d83a82403bf7..0c7d2a8805f13dafeeabff56f604b1d3a618fcb9 100644
--- a/packages/app-shell/src/app-shell.js
+++ b/packages/app-shell/src/app-shell.js
@@ -74,8 +74,7 @@ export class AppShell extends ScopedElementsMixin(DBPLitElement) {
this.initateOpenMenu = false;
this.auth = {};
- this.langFiles = '';
- this.overrideFiles = '';
+ this.langDir = '';
}
static get scopedElements() {
@@ -273,8 +272,7 @@ export class AppShell extends ScopedElementsMixin(DBPLitElement) {
buildTime: {type: String, attribute: 'build-time'},
env: {type: String},
auth: {type: Object},
- langFiles: {type: String, attribute: 'lang-files'},
- overrideFiles: {type: String, attribute: 'override-files'},
+ langDir: {type: String, attribute: 'lang-dir'},
};
}
diff --git a/packages/common/dbp-common-demo.js b/packages/common/dbp-common-demo.js
index 7893841f2cc52fcd43d518694fd00339ac0a5460..9448fb39dcdb7b073a64bdee94d73aa83c6e45a5 100644
--- a/packages/common/dbp-common-demo.js
+++ b/packages/common/dbp-common-demo.js
@@ -302,10 +302,8 @@ html {
</dbp-translated>
</div>
<div class="control" id="dbp-translation-demo">
- <p><dbp-translation key="toolkit-showcase" subscribe="lang, lang-files"></dbp-translation></p>
- <p><dbp-translation key="toolkit-showcase" subscribe="lang, lang-files, override-files"></dbp-translation></p>
- <p><dbp-translation key="toolkit-showcase-link" var='{"link1": "https://www.i18next.com/translation-function/interpolation"}' subscribe="lang, lang-files" unsafe></dbp-translation></p>
- <p><dbp-translation key="toolkit-showcase-link" var='{"link1": "https://dbp-demo.tugraz.at/"}' subscribe="lang, lang-files, override-files" unsafe></dbp-translation></p>
+ <dbp-translation key="toolkit-showcase" subscribe="lang, lang-dir"></dbp-translation>
+ <dbp-translation key="toolkit-showcase-link" var='{"link1": "https://www.i18next.com/translation-function/interpolation"}' subscribe="lang, lang-dir" unsafe></dbp-translation>
</div>
</div>
</section>
diff --git a/packages/common/src/i18n.js b/packages/common/src/i18n.js
index 67966f710d678fa566707cd814800d084720d629..63ed95a6151a8f98047f5b00c9390f68a8901716 100644
--- a/packages/common/src/i18n.js
+++ b/packages/common/src/i18n.js
@@ -7,30 +7,8 @@ export function createInstance() {
return _createInstance({en: en, de: de}, 'de', 'en');
}
-export async function createInstanceAsync(langFile, namespace) {
- if (namespace == undefined)
- namespace = 'translation';
- // check if a path to language files is given
- if(langFile) {
-
- // request german lang file asynchronously
- let result = await
- fetch(langFile + 'de/' + namespace +'.json', {
- headers: {'Content-Type': 'application/json'},
- });
- const dynDe = await result.json();
-
- // request english lang file asynchronously
- result = await
- fetch(langFile + 'en/' + namespace + '.json', {
- headers: {'Content-Type': 'application/json'},
- });
- const dynEn = await result.json();
-
- return _createInstance({en: dynEn, de: dynDe}, 'de', 'en', namespace);
- }
-
- return _createInstance({en: en, de: de}, 'de', 'en', namespace);
+export function createInstanceGivenResources(en, de) {
+ return _createInstance({en: en, de: de}, 'de', 'en');
}
export {setOverridesByFile};
diff --git a/packages/common/src/translation.js b/packages/common/src/translation.js
index 4600097101fd507d91b98f3d9e541ec4734a524f..53895066643df1619d1a597ac93f23df6eb93eac 100644
--- a/packages/common/src/translation.js
+++ b/packages/common/src/translation.js
@@ -1,18 +1,15 @@
import {css, html} from 'lit';
-import {until} from 'lit/directives/until.js';
import {unsafeHTML} from 'lit/directives/unsafe-html.js';
import DBPLitElement from '../dbp-lit-element';
-import {createInstanceAsync, setOverridesByFile} from './i18n.js';
+import {createInstanceGivenResources, setOverridesByFile} from './i18n.js';
export class Translation extends DBPLitElement {
constructor() {
super();
this.key = '';
this.lang = '';
- this.langFiles = '';
this.interpolation = '';
- this.namespace = '';
- this.overrideFiles = '';
+ this.langDir = '';
}
static get properties() {
@@ -20,11 +17,9 @@ export class Translation extends DBPLitElement {
...super.properties,
key: {type: String},
lang: {type: String},
- langFiles: {type: String, attribute: 'lang-files'},
interpolation: {type: Object, attribute: 'var'},
unsafe: {type: Boolean, attribute: 'unsafe'},
- namespace: {type: String, attribute: 'ns'},
- overrideFiles: {type: String, attribute: 'override-files'},
+ langDir: {type: String, attribute: 'lang-dir'},
};
}
@@ -39,22 +34,21 @@ export class Translation extends DBPLitElement {
connectedCallback() {
super.connectedCallback();
- if (this.namespace == '') {
- this._i18n = createInstanceAsync(this.langFiles);
- }
- else {
- this._i18n = createInstanceAsync(this.langFiles, this.namespace);
- }
- let local = this;
- let overrideFiles = this.overrideFiles;
+ // init objects with empty string as value for key
+ const de = {};
+ const en = {};
+ de[this.key] = "";
+ en[this.key] = "";
+
+ // create i18n instance with given translations
+ this._i18n = createInstanceGivenResources(en, de);
- if (this.overrideFiles) {
- this._i18n.then(function(response) {
- setOverridesByFile(response, local, overrideFiles).then(function(response) {
- local._i18n = response;
- local.requestUpdate();
- });
+ // after init of overrides rerender page
+ let local = this;
+ if (this.langDir) {
+ setOverridesByFile(this._i18n, this, this.langDir).then(function(response) {
+ local.requestUpdate();
});
}
}
@@ -64,9 +58,7 @@ export class Translation extends DBPLitElement {
changedProperties.forEach((oldValue, propName) => {
switch (propName) {
case 'lang':
- Promise.resolve(this._i18n).then(function(response) {
- response.changeLanguage(lang);
- });
+ this._i18n.changeLanguage(lang);
break;
}
});
@@ -75,24 +67,19 @@ export class Translation extends DBPLitElement {
}
render() {
- // save global key in local variable for async use
- let key = this.key;
- let interpolation = this.interpolation;
- let unsafe = this.unsafe;
-
- // async request to i18n translation
- const translation = Promise.resolve(this._i18n).then(function(response){
- if (interpolation && unsafe)
- return unsafeHTML(response.t(key, interpolation));
- else if (interpolation)
- return response.t(key, interpolation);
+ // request to i18n translation
+ const translation = (() => {
+ if (this.interpolation && this.unsafe)
+ return unsafeHTML(this._i18n.t(this.key, this.interpolation));
+ else if (this.interpolation)
+ return this._i18n.t(this.key, this.interpolation);
else
- return response.t(key);
- });
+ return this._i18n.t(this.key);
+ })();
- // load translation text when available, otherwise display "Loading.."
+ // load translation text
return html`
- ${until(translation, html`Loading..`)}
+ ${translation}
`;
}
}
diff --git a/toolkit-showcase/assets/common.metadata.json b/toolkit-showcase/assets/common.metadata.json
index 12f74b5c0ce45029eeb7b3144822d1b35d49aa98..de1f70c7ede8728cc3cd6b0b8922da8137310763 100644
--- a/toolkit-showcase/assets/common.metadata.json
+++ b/toolkit-showcase/assets/common.metadata.json
@@ -14,5 +14,5 @@
"de": "Gemeinsame Web Components",
"en": "Common web components"
},
- "subscribe": "lang,entry-point-url,lang-files"
+ "subscribe": "lang,entry-point-url"
}
diff --git a/toolkit-showcase/assets/dbp-toolkit-showcase.html.ejs b/toolkit-showcase/assets/dbp-toolkit-showcase.html.ejs
index 9d45cbe472fbff92215897635961c4ad821ab031..07b213117747aed86247d1a50c87cd681e226cf3 100644
--- a/toolkit-showcase/assets/dbp-toolkit-showcase.html.ejs
+++ b/toolkit-showcase/assets/dbp-toolkit-showcase.html.ejs
@@ -113,8 +113,7 @@
<<%= name %>
provider-root
lang="de"
- lang-files="<%= getPrivateUrl('i18n/') %>"
- override-files="<%= getPrivateUrl('i18n/overrides/') %>"
+ lang-dir="<%= getPrivateUrl('translation-overrides/') %>"
entry-point-url="<%= entryPointURL %>"
nextcloud-auth-url="<%= nextcloudWebAppPasswordURL %>"
nextcloud-web-dav-url="<%= nextcloudWebDavURL %>"
diff --git a/toolkit-showcase/assets/i18n/de/translation.json b/toolkit-showcase/assets/i18n/de/translation.json
deleted file mode 100644
index 2d759b357613307de3c66fb33a64b7924ed1b330..0000000000000000000000000000000000000000
--- a/toolkit-showcase/assets/i18n/de/translation.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "toolkit-showcase": "Dieser Text wird mithilfe von i18n aus einer benutzerdefinierten Sprachdatei gelesen und ins Englische übersetzt wenn man die Sprache auf Englisch stellt.",
- "toolkit-showcase-link": "Es können sogar links mittels <a href=\"{{- link1}}\">interpolation</a> und escaping dargestellt werden."
-}
diff --git a/toolkit-showcase/assets/i18n/en/translation.json b/toolkit-showcase/assets/i18n/en/translation.json
deleted file mode 100644
index 5d133a064344bdd33837bf6a58d92d77778b278b..0000000000000000000000000000000000000000
--- a/toolkit-showcase/assets/i18n/en/translation.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "toolkit-showcase": "This text will be translated to german using i18n with a user defined language file when the language is changed to german.",
- "toolkit-showcase-link": "Furthermore its possible to display links through <a href=\"{{- link1}}\">interpolation</a> and escaping."
-}
diff --git a/toolkit-showcase/assets/i18n/overrides/de/translation.json b/toolkit-showcase/assets/i18n/overrides/de/translation.json
deleted file mode 100644
index b3b136fbef6577c800f678f3b15957a3dd029a6e..0000000000000000000000000000000000000000
--- a/toolkit-showcase/assets/i18n/overrides/de/translation.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
- "dbp-translation": {
- "toolkit-showcase": "Ãœberschriebener i18n toolkit-showcase Text",
- "toolkit-showcase-link": "Ãœberschriebener i18n toolkit-showcase-link Text mit <a href=\"{{- link1}}\">TestLink</a>"
- }
-}
diff --git a/toolkit-showcase/assets/i18n/overrides/en/translation.json b/toolkit-showcase/assets/i18n/overrides/en/translation.json
deleted file mode 100644
index 3892525bd8e50e661a30f65057a10d43526b8015..0000000000000000000000000000000000000000
--- a/toolkit-showcase/assets/i18n/overrides/en/translation.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
- "dbp-translation": {
- "toolkit-showcase": "Overriden i18n toolkit-showcase text",
- "toolkit-showcase-link": "Overriden i18n toolkit-showcase-link text with a <a href=\"{{- link1}}\">test link</a>"
- }
-}
diff --git a/toolkit-showcase/assets/translation-overrides/de/translation.json b/toolkit-showcase/assets/translation-overrides/de/translation.json
new file mode 100644
index 0000000000000000000000000000000000000000..27d226ddd06de5cf6471160a27d98a31f25a8f79
--- /dev/null
+++ b/toolkit-showcase/assets/translation-overrides/de/translation.json
@@ -0,0 +1,6 @@
+{
+ "dbp-translation": {
+ "toolkit-showcase": "Dieser Text wird mithilfe von i18n aus einer benutzerdefinierten Sprachdatei gelesen und ins Englische übersetzt wenn man die Sprache auf Englisch stellt.",
+ "toolkit-showcase-link": "Es können sogar links mittels <a href=\"{{- link1}}\">interpolation</a> und escaping dargestellt werden."
+ }
+}
diff --git a/toolkit-showcase/assets/translation-overrides/en/translation.json b/toolkit-showcase/assets/translation-overrides/en/translation.json
new file mode 100644
index 0000000000000000000000000000000000000000..e3cd5c3858abaac1396241f2235a71fdb2f17d86
--- /dev/null
+++ b/toolkit-showcase/assets/translation-overrides/en/translation.json
@@ -0,0 +1,6 @@
+{
+ "dbp-translation": {
+ "toolkit-showcase": "This text will be translated to german using i18n with a user defined language file when the language is changed to german.",
+ "toolkit-showcase-link": "Furthermore its possible to display links through <a href=\"{{- link1}}\">interpolation</a> and escaping."
+ }
+}
diff --git a/toolkit-showcase/rollup.config.js b/toolkit-showcase/rollup.config.js
index e02d2ed12240c81c9454e81546d209657c6ba969..5320e77ed687b0b881ccfab0f897f88527849982 100644
--- a/toolkit-showcase/rollup.config.js
+++ b/toolkit-showcase/rollup.config.js
@@ -168,7 +168,7 @@ Dependencies:
{src: 'assets/icon-*.png', dest: 'dist/' + (await getDistPath(pkg.name))},
{src: 'assets/apple-*.png', dest: 'dist/' + (await getDistPath(pkg.name))},
{src: 'assets/safari-*.svg', dest: 'dist/' + (await getDistPath(pkg.name))},
- {src: 'assets/i18n', dest: 'dist/' + (await getDistPath(pkg.name))},
+ {src: 'assets/translation-overrides', dest: 'dist/' + (await getDistPath(pkg.name))},
{
src: 'assets/manifest.json',
dest: 'dist',
diff --git a/toolkit-showcase/src/dbp-common-demo-activity.js b/toolkit-showcase/src/dbp-common-demo-activity.js
index 7dee8d6b61bfbf8e7501d1b39daeac1026504a03..fc633b9d37f5ba3362f6bbe99f6b75f8ab107010 100644
--- a/toolkit-showcase/src/dbp-common-demo-activity.js
+++ b/toolkit-showcase/src/dbp-common-demo-activity.js
@@ -13,7 +13,6 @@ class DbpCommonDemoActivity extends ScopedElementsMixin(AdapterLitElement) {
super();
this.lang = 'en';
this.entryPointUrl = '';
- this.langFiles = '';
}
static get scopedElements() {
@@ -26,7 +25,6 @@ class DbpCommonDemoActivity extends ScopedElementsMixin(AdapterLitElement) {
return {
...super.properties,
lang: {type: String},
- langFiles: {type: String, attribute: 'lang-files'},
entryPointUrl: {type: String, attribute: 'entry-point-url'},
};
}
@@ -65,7 +63,6 @@ class DbpCommonDemoActivity extends ScopedElementsMixin(AdapterLitElement) {
<dbp-common-demo
id="demo"
lang="${this.lang}"
- lang-files="${this.langFiles}"
entry-point-url="${this.entryPointUrl}"></dbp-common-demo>
`;
}