Upstream/harbor
1
0
Fork 0
mirror of https://github.com/goharbor/harbor.git synced 2024-12-23 09:08:26 +01:00
Code Issues Projects Releases Wiki Activity

Use service in harbor-ui library for i18n support

Browse Source
This commit is contained in:
Steven Zou 2017-06-15 23:27:54 +08:00
parent df61fb355b
commit 6e789d7d46
10 changed files with 118 additions and 158 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/ui_ng/lib/src/create-edit-endpoint/create-edit-endpoint.component.html.ts
View File

@ -1,6 +1,6 @@
export const CREATE_EDIT_ENDPOINT_TEMPLATE: string = `<clr-modal [(clrModalOpen)]="createEditDestinationOpened" [clrModalStaticBackdrop]="staticBackdrop" [clrModalClosable]="closable">
<h3 class="modal-title">{{modalTitle}}</h3>
<inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></inline-alert>
<hbr-inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></hbr-inline-alert>
<div class="modal-body">
<div class="alert alert-warning" *ngIf="!editable">
<div class="alert-item">

2
src/ui_ng/lib/src/create-edit-rule/create-edit-rule.component.html.ts
View File

@ -1,7 +1,7 @@
export const CREATE_EDIT_RULE_TEMPLATE: string = `
<clr-modal [(clrModalOpen)]="createEditRuleOpened" [clrModalStaticBackdrop]="staticBackdrop" [clrModalClosable]="closable">
<h3 class="modal-title">{{modalTitle}}</h3>
<inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></inline-alert>
<hbr-inline-alert class="modal-title" (confirmEvt)="confirmCancel($event)"></hbr-inline-alert>
<div class="modal-body" style="max-height: 85vh;">
<form #ruleForm="ngForm">
<section class="form-block">

9
src/ui_ng/lib/src/i18n/translate-init.service.ts
View File

@ -13,8 +13,9 @@ export class TranslateServiceInitializer {
public init(config: i18nConfig = {}): void {
let selectedLang: string = config.defaultLang ? config.defaultLang : DEFAULT_LANG;
let supportedLangs: string[] = config.supportedLangs ? config.supportedLangs : DEFAULT_SUPPORTING_LANGS;
this.translateService.addLangs(config.supportedLangs ? config.supportedLangs : DEFAULT_SUPPORTING_LANGS);
this.translateService.addLangs(supportedLangs);
this.translateService.setDefaultLang(selectedLang);
if (config.enablei18Support) {
@ -25,12 +26,14 @@ export class TranslateServiceInitializer {
langSetting = this.translateService.getBrowserCultureLang().toLowerCase();
}
if (config.supportedLangs && config.supportedLangs.length > 0) {
if (config.supportedLangs.find(lang => lang === langSetting)) {
if (langSetting && langSetting.trim() !== "") {
if (supportedLangs && supportedLangs.length > 0) {
if (supportedLangs.find(lang => lang === langSetting)) {
selectedLang = langSetting;
}
}
}
}
this.translateService.use(selectedLang);
}

2
src/ui_ng/lib/src/inline-alert/inline-alert.component.ts
View File

@ -22,7 +22,7 @@ import { INLINE_ALERT_STYLE } from './inline-alert.component.css';
import { INLINE_ALERT_TEMPLATE } from './inline-alert.component.html';
@Component({
selector: 'inline-alert',
selector: 'hbr-inline-alert',
template: INLINE_ALERT_TEMPLATE,
styles: [ INLINE_ALERT_STYLE ]
})

2
src/ui_ng/lib/src/push-image/push-image.html.ts
View File

@ -17,7 +17,7 @@ export const PUSH_IMAGE_HTML: string = `
</span>
</section>
<section>
<inline-alert #copyAlert></inline-alert>
<hbr-inline-alert #copyAlert></hbr-inline-alert>
</section>
<section>
<article class="commands-section">

2
src/ui_ng/package.json
View File

@ -32,8 +32,10 @@
"clarity-icons": "^0.9.0",
"clarity-ui": "^0.9.0",
"core-js": "^2.4.1",
"harbor-ui": "^0.1.67",
"intl": "^1.2.5",
"mutationobserver-shim": "^0.3.2",
"ngx-clipboard": "^8.0.2",
"ngx-cookie": "^1.0.0",
"rxjs": "^5.0.1",
"ts-helpers": "^1.1.1",

20
src/ui_ng/src/app/app.component.ts
View File

@ -31,20 +31,6 @@ export class AppComponent {
private session: SessionService,
private appConfigService: AppConfigService,
private titleService: Title) {
translate.addLangs(supportedLangs);
translate.setDefaultLang(enLang);
//If user has selected lang, then directly use it
let langSetting = this.cookie.get("harbor-lang");
if (!langSetting || langSetting.trim() === "") {
//Use browser lang
langSetting = translate.getBrowserCultureLang().toLowerCase();
}
let selectedLang = this.isLangMatch(langSetting, supportedLangs) ? langSetting : enLang;
translate.use(selectedLang);
//Override page title
let key: string = "APP_TITLE.HARBOR";
if (this.appConfigService.isIntegrationMode()) {
@ -55,10 +41,4 @@ export class AppComponent {
this.titleService.setTitle(res);
});
}
isLangMatch(browserLang: string, supportedLangs: string[]) {
if (supportedLangs && supportedLangs.length > 0) {
return supportedLangs.find(lang => lang === browserLang);
}
}
}

26
src/ui_ng/src/app/app.module.ts
View File

@ -13,9 +13,6 @@
// limitations under the License.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, APP_INITIALIZER, LOCALE_ID } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { ClarityModule } from 'clarity-angular';
import { AppComponent } from './app.component';
import { BaseModule } from './base/base.module';
@ -24,17 +21,9 @@ import { SharedModule } from './shared/shared.module';
import { AccountModule } from './account/account.module';
import { ConfigurationModule } from './config/config.module';
import { TranslateModule, TranslateLoader, TranslateService, MissingTranslationHandler } from "@ngx-translate/core";
import { MyMissingTranslationHandler } from './i18n/missing-trans.handler';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { Http } from '@angular/http';
import { TranslateService } from "@ngx-translate/core";
import { AppConfigService } from './app-config.service';
export function HttpLoaderFactory(http: Http) {
return new TranslateHttpLoader(http, 'i18n/lang/', '-lang.json');
}
export function initConfig(configService: AppConfigService) {
return () => configService.load();
}
@ -52,18 +41,7 @@ export function getCurrentLanguage(translateService: TranslateService) {
BaseModule,
AccountModule,
HarborRoutingModule,
ConfigurationModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: (HttpLoaderFactory),
deps: [Http]
},
missingTranslationHandler: {
provide: MissingTranslationHandler,
useClass: MyMissingTranslationHandler
}
})
ConfigurationModule
],
providers: [
AppConfigService,

22
src/ui_ng/src/app/core/core.module.ts
View File

@ -19,6 +19,20 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { ClarityModule } from 'clarity-angular';
import { CookieModule } from 'ngx-cookie';
import {
IServiceConfig,
SERVICE_CONFIG,
HarborLibraryModule
} from 'harbor-ui';
const uiLibConfig: IServiceConfig = {
enablei18Support: true,
langCookieKey: "harbor-lang",
langMessageLoader: "http",
langMessagePathForHttpLoader: "src/i18n/lang/",
langMessageFileSuffixForHttpLoader: "-lang.json",
};
@NgModule({
imports: [
BrowserModule,
@ -26,14 +40,18 @@ import { CookieModule } from 'ngx-cookie';
HttpModule,
ClarityModule.forRoot(),
CookieModule.forRoot(),
BrowserAnimationsModule
BrowserAnimationsModule,
HarborLibraryModule.forRoot({
config: { provide: SERVICE_CONFIG, useValue: uiLibConfig }
})
],
exports: [
BrowserModule,
FormsModule,
HttpModule,
ClarityModule,
BrowserAnimationsModule
BrowserAnimationsModule,
HarborLibraryModule
]
})
export class CoreModule {

21
src/ui_ng/src/app/i18n/missing-trans.handler.ts
View File

@ -1,21 +0,0 @@
// Copyright (c) 2017 VMware, Inc. All Rights Reserved.
//
// 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.
import { MissingTranslationHandler, MissingTranslationHandlerParams } from '@ngx-translate/core';
export class MyMissingTranslationHandler implements MissingTranslationHandler {
handle(params: MissingTranslationHandlerParams) {
const missingText = "{Miss Harbor Text}";
return params.key || missingText;
}
}