#1076 Improve the TranslationLoader

ng2-components/ng2-alfresco-core/src/models/component.model.ts

@@ -0,0 +1,28 @@
+/*!
+ * @license
+ * Copyright 2016 Alfresco Software, Ltd.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export class ComponentTranslationModel {
+    name: string;
+    path: string;
+    json: string;
+
+    constructor(obj?: any) {
+        this.name = obj && obj.name;
+        this.path = obj && obj.path;
+        this.json = obj && obj.json || null;
+    }
+}

ng2-components/ng2-alfresco-core/src/services/AlfrescoTranslation.service.ts

@@ -29,13 +29,16 @@ export class AlfrescoTranslationService {
         translate.setDefaultLang(this.userLang);
     }
 
-    addTranslationFolder(name: string = '') {
+    addTranslationFolder(name: string = '', path: string = '') {
         let loader = <AlfrescoTranslationLoader> this.translate.currentLoader;
         if (!loader.existComponent(name)) {
-            loader.addComponentList(name);
+            loader.addComponentList(name, path);
-            this.translate.getTranslation(this.userLang);
+            this.translate.getTranslation(this.userLang).subscribe(
+                () => {
+                    this.translate.use(this.userLang);
+                }
+            );
         }
-        this.translate.use(this.userLang);
     }
 
     use(lang: string): Observable<any> {

ng2-components/ng2-alfresco-core/src/services/AlfrescoTranslationLoader.service.ts

@@ -19,54 +19,81 @@ import { Injectable } from '@angular/core';
 import { Response, Http } from '@angular/http';
 import { Observable } from 'rxjs/Observable';
 import { TranslateLoader } from 'ng2-translate/ng2-translate';
+import { ComponentTranslationModel } from '../models/component.model';
 
 @Injectable()
 export class AlfrescoTranslationLoader implements TranslateLoader {
 
     private prefix: string = 'i18n';
     private suffix: string = '.json';
-    private _componentList: string[] = [];
+    private _componentList: ComponentTranslationModel[] = [];
+    private queue: string[] = [];
 
     constructor(private http: Http) {
     }
 
-    addComponentList(name: string) {
+    addComponentList(nameInput: string, pathInput: string) {
-        this._componentList.push(name);
+        this._componentList.push(new ComponentTranslationModel({name: nameInput, path: pathInput}));
     }
 
-    existComponent(name: string) {
+    existComponent(name: string): boolean {
-        return this._componentList.indexOf(name) >= 0;
+        return this._componentList.find(x => x.name === name) ? true : false;
+    }
+
+    getComponentToFetch(lang: string) {
+        let observableBatch = [];
+        this._componentList.forEach((component) => {
+            if (!this.queue.find(x => x === component.name)) {
+                this.queue.push(component.name);
+                observableBatch.push(this.http.get(`${component.path}/${this.prefix}/${lang}${this.suffix}`)
+                    .map((res: Response) => {
+                        component.json = res.json();
+                    })
+                    .catch((/*err: any, source: Observable<any>, caught: Observable<any>*/) => {
+                        // Empty Observable just to go ahead
+                        return Observable.of('');
+                    }));
+            }
+        });
+        return observableBatch;
+    }
+
+    getFullTranslationJSON() {
+        let fullTranslation: string = '';
+        let cloneList = this._componentList.slice(0);
+        cloneList.reverse().forEach((component) => {
+            if (component.json !== undefined && component.json !== null) {
+                fullTranslation += JSON.stringify(component.json);
+            }
+        });
+        if (fullTranslation !== '') {
+            return JSON.parse(fullTranslation.replace(/}{/g, ','));
+        }
     }
 
     getTranslation(lang: string): Observable<any> {
-        let self = this;
+        let observableBatch = this.getComponentToFetch(lang);
-        let observableBatch = [];
-        this._componentList.forEach((component) => {
-            observableBatch.push(this.http.get(`${component}/${self.prefix}/${lang}${self.suffix}`)
-                .map((res: Response) => res.json())
-                .catch( (/*err: any, source: Observable<any>, caught: Observable<any>*/)  =>  {
-                    // Empty Observable just to go ahead
-                    return Observable.of('');
-                }));
-        });
 
         return Observable.create(observer => {
-            Observable.forkJoin(observableBatch).subscribe(
+            if (observableBatch.length > 0) {
-                (translations: any[]) => {
+                Observable.forkJoin(observableBatch).subscribe(
-                    let multiLanguage: any = '';
+                    () => {
-                    translations.forEach((translate) => {
+                        let fullTranslation  = this.getFullTranslationJSON();
-                        if (translate !== '') {
+                        if (fullTranslation) {
-                            multiLanguage += JSON.stringify(translate);
+                            observer.next(fullTranslation);
                         }
-                    });
+                        observer.complete();
-                    if (multiLanguage !== '') {
+                    },
-                        observer.next(JSON.parse(multiLanguage.replace(/}{/g, ',')));
+                    (err: any) => {
-                    }
-                    observer.complete();
-                },
-                (err: any) => {
                         console.error(err);
-                });
+                    });
+            } else {
+                let fullTranslation  = this.getFullTranslationJSON();
+                if (fullTranslation) {
+                    observer.next(fullTranslation);
+                }
+                observer.complete();
+            }
         });
     }
 }