From cb1e893ebdbaf779cdde50834aa41ca55e848937 Mon Sep 17 00:00:00 2001
From: Ahmet C <cetin.ahmet@live.de>
Date: Sun, 2 May 2021 07:37:53 +0200
Subject: [PATCH] Adding translation-service and adding text
---
.../cloud-configuration.component.html | 29 ++++++++++---------
.../cloud-configuration.component.ts | 5 ++--
src/assets/i18n/home/de.json | 17 +++++++++++
src/assets/i18n/home/en.json | 17 +++++++++++
4 files changed, 52 insertions(+), 16 deletions(-)
diff --git a/src/app/components/shared/_dialogs/cloud-configuration/cloud-configuration.component.html b/src/app/components/shared/_dialogs/cloud-configuration/cloud-configuration.component.html
index 0c9fc2052..8b2a5f3da 100644
--- a/src/app/components/shared/_dialogs/cloud-configuration/cloud-configuration.component.html
+++ b/src/app/components/shared/_dialogs/cloud-configuration/cloud-configuration.component.html
@@ -74,9 +74,9 @@
>
<form [formGroup]="cloudConfigForm" fxLayout="column">
- <h2>Tag Cloud Configuration</h2>
+ <h2>{{'tag-cloud.title' | translate}}</h2>
- <h3>General options</h3>
+ <h3>{{'tag-cloud.general' | translate}}</h3>
<div
class="input-row"
fxLayout="row"
@@ -84,6 +84,7 @@
fxLayout.xs="column"
>
<mat-form-field fxFlex fxLayout.xs="column">
+ <mat-label>{{'tag-cloud.height' | translate}}</mat-label>
<input
matInput
type="number"
@@ -102,10 +103,10 @@
fxLayout.xs="column"
>
<mat-slide-toggle fxFlex formControlName="overflow"
- >Overflow</mat-slide-toggle
+ >{{'tag-cloud.overflow' | translate}}</mat-slide-toggle
>
<mat-slide-toggle fxFlex formControlName="randomizeAngle"
- >Randomize angle</mat-slide-toggle
+ >{{'tag-cloud.random-angle' | translate}}</mat-slide-toggle
>
</div>
<div
@@ -115,7 +116,7 @@
fxLayout.xs="column"
>
<mat-slide-toggle fxFlex formControlName="realignOnResize"
- >Realign on resize</mat-slide-toggle
+ >{{'tag-cloud.realign' | translate}}</mat-slide-toggle
>
</div>
@@ -137,7 +138,7 @@
<div fxFlex="48%" fxFlex.xs="100%">
<div fxLayout="row" fxLayoutGap="10px">
<mat-form-field fxFlex="80%">
- <mat-label>Background</mat-label>
+ <mat-label>{{'tag-cloud.background' | translate}}</mat-label>
<input
matInput
[colorPicker]="
@@ -162,7 +163,7 @@
</div>
<div fxFlex="50%" fxFlex.xs="100%">
- <mat-label class="label-text">Delay</mat-label>
+ <mat-label class="label-text">{{'tag-cloud.word-delay' | translate}}</mat-label>
<mat-slider
min="0"
max="1000"
@@ -173,7 +174,7 @@
</div>
</div>
- <h3>Zoom on hover options</h3>
+ <h3>{{'tag-cloud.hover-title' | translate}}</h3>
<div formGroupName="zoomOnHover">
<div
class="input-row"
@@ -184,7 +185,7 @@
<div fxFlex="48%" fxFlex.xs="100%">
<div fxLayout="row" fxLayoutGap="10px">
<mat-form-field fxFlex="80%">
- <mat-label>Color</mat-label>
+ <mat-label>{{'tag-cloud.hover-color' | translate}}</mat-label>
<input
matInput
[colorPicker]="
@@ -210,7 +211,7 @@
</div>
<div fxFlex="50%" fxFlex.xs="100%">
- <mat-label class="label-text">Scale</mat-label>
+ <mat-label class="label-text">{{'tag-cloud.hover-scale' | translate}}</mat-label>
<mat-slider
min="1"
max="2"
@@ -228,7 +229,7 @@
fxLayoutGap="20px"
>
<div fxFlex="50%" fxFlex.xs="100%">
- <mat-label class="label-text">Time</mat-label>
+ <mat-label class="label-text">{{'tag-cloud.hover-time' | translate}}</mat-label>
<mat-slider
min="0"
max="2"
@@ -238,7 +239,7 @@
></mat-slider>
</div>
<div fxFlex="50%" fxFlex.xs="100%">
- <mat-label class="label-text">Delay</mat-label>
+ <mat-label class="label-text">{{'tag-cloud.hover-delay' | translate}}</mat-label>
<mat-slider
min="0"
max="2"
@@ -293,8 +294,8 @@
</div> -->
<br>
<div class="button-row">
- <button mat-button class="secondary">cancel</button>
- <button mat-button class="primary">Save</button>
+ <button mat-button class="secondary">{{'tag-cloud.cancel-btn' | translate}}</button>
+ <button mat-button class="primary">{{'tag-cloud.save-btn' | translate}}</button>
</div>
</form>
diff --git a/src/app/components/shared/_dialogs/cloud-configuration/cloud-configuration.component.ts b/src/app/components/shared/_dialogs/cloud-configuration/cloud-configuration.component.ts
index 797d801d0..fa15c5aa7 100644
--- a/src/app/components/shared/_dialogs/cloud-configuration/cloud-configuration.component.ts
+++ b/src/app/components/shared/_dialogs/cloud-configuration/cloud-configuration.component.ts
@@ -4,7 +4,7 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { MatSnackBar } from '@angular/material/snack-bar';
-
+import { TranslateService } from '@ngx-translate/core';
import { CloudData, CloudOptions, ZoomOnHoverOptions } from 'angular-tag-cloud-module';
import { Observable, of } from 'rxjs';
@@ -56,9 +56,10 @@ export class CloudConfigurationComponent implements OnInit {
data: JSON.stringify(this.data, null, 2),
};
- constructor(private fb: FormBuilder, private snackBar: MatSnackBar) {}
+ constructor(private fb: FormBuilder, private snackBar: MatSnackBar,private translateService: TranslateService) {}
ngOnInit() {
+ this.translateService.use(localStorage.getItem('currentLang'));
this.cloudDataForm = this.fb.group({
...this.exampleDataOptions,
});
diff --git a/src/assets/i18n/home/de.json b/src/assets/i18n/home/de.json
index f999f46bb..a08149f3c 100644
--- a/src/assets/i18n/home/de.json
+++ b/src/assets/i18n/home/de.json
@@ -292,5 +292,22 @@
},
"qr-dialog": {
"session": "Raum"
+ },
+ "tag-cloud":{
+ "title":"Tag-Cloud Einstellungen",
+ "general":"Allgemeine Einstellungen",
+ "overflow":"Ãœberlauf",
+ "height":"Höhe",
+ "random-angle":"Zufällige Winkel",
+ "realign":"Neu ausrichten",
+ "background":"Hintergrundfarbe",
+ "word-delay":"Verzögerung beim zeichnen",
+ "hover-color":"Schriftfarbe",
+ "hover-scale":"Skalierung fürs Schweben",
+ "hover-time":"Zeit fürs Schweben",
+ "hover-title":"Einstellungen Schweben",
+ "hover-delay":"Verzögerung beim Schweben",
+ "cancel-btn":"Abbruch",
+ "save-btn":"Speichern"
}
}
diff --git a/src/assets/i18n/home/en.json b/src/assets/i18n/home/en.json
index 8344ffe9c..a8f73b13c 100644
--- a/src/assets/i18n/home/en.json
+++ b/src/assets/i18n/home/en.json
@@ -294,5 +294,22 @@
},
"qr-dialog": {
"session": "Key code"
+ },
+ "tag-cloud":{
+ "title":"Tag-Cloud Options",
+ "general":"General Options",
+ "overflow":"Overflow",
+ "height":"Height",
+ "random-angle":"Randomize angle",
+ "realign":"Realign on resize",
+ "background":"Background-color",
+ "word-delay":"Word delay",
+ "hover-color":"Font-color",
+ "hover-scale":"Scale",
+ "hover-time":"Hover time",
+ "hover-title":"Hover Options",
+ "hover-delay":"Hover Delay",
+ "cancel-btn":"Cancel",
+ "save-btn":"Save"
}
}
--
GitLab