diff --git a/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.html b/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.html
new file mode 100644
index 000000000..e4982c2a1
--- /dev/null
+++ b/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.html
@@ -0,0 +1,16 @@
+
+
+
+ {{'LANGUAGE.TITLE' | translate}}
+
+
+ close
+
+
+
+
+
+
+
diff --git a/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.scss b/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.scss
new file mode 100644
index 000000000..6fbd87e8d
--- /dev/null
+++ b/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.scss
@@ -0,0 +1,17 @@
+.form {
+ min-width: 150px;
+ max-width: 500px;
+ width: 100%;
+}
+
+.full-width {
+ width: 100%;
+}
+
+.close-btn {
+ cursor: pointer;
+}
+
+.language {
+ margin-bottom: 1.125rem;
+}
diff --git a/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.ts b/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.ts
new file mode 100644
index 000000000..a43dc91bb
--- /dev/null
+++ b/dmp-frontend/src/app/ui/language/dialog/language-dialog.component.ts
@@ -0,0 +1,31 @@
+import { Component, Inject } from '@angular/core';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+
+@Component({
+ selector: 'app-language-dialog',
+ templateUrl: './language-dialog.component.html',
+ styleUrls: ['./language-dialog.component.scss']
+})
+export class LanguageDialogComponent {
+
+ public isDialog: boolean;
+
+ constructor(
+ public dialogRef: MatDialogRef,
+ @Inject(MAT_DIALOG_DATA) public data: any
+ ) {
+ this.isDialog = data.isDialog;
+ }
+
+ cancel() {
+ this.dialogRef.close();
+ }
+
+ send() {
+ this.dialogRef.close(this.data);
+ }
+
+ close() {
+ this.dialogRef.close(false);
+ }
+}
diff --git a/dmp-frontend/src/app/ui/language/language-content/language.component.html b/dmp-frontend/src/app/ui/language/language-content/language.component.html
new file mode 100644
index 000000000..d23cad05b
--- /dev/null
+++ b/dmp-frontend/src/app/ui/language/language-content/language.component.html
@@ -0,0 +1,5 @@
+
diff --git a/dmp-frontend/src/app/ui/language/language-content/language.component.scss b/dmp-frontend/src/app/ui/language/language-content/language.component.scss
new file mode 100644
index 000000000..aea7dec4f
--- /dev/null
+++ b/dmp-frontend/src/app/ui/language/language-content/language.component.scss
@@ -0,0 +1,9 @@
+::ng-deep.lang-menu {
+ border-color: transparent;
+ padding: 8px;
+}
+
+::ng-deep.lang-button {
+ padding-top: 15px;
+ padding-bottom: 15px;
+}
diff --git a/dmp-frontend/src/app/ui/language/language-content/language.component.ts b/dmp-frontend/src/app/ui/language/language-content/language.component.ts
new file mode 100644
index 000000000..791ed94d1
--- /dev/null
+++ b/dmp-frontend/src/app/ui/language/language-content/language.component.ts
@@ -0,0 +1,61 @@
+import { Component, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
+import { AuthService } from '@app/core/services/auth/auth.service';
+import { LanguageService } from '@app/core/services/language/language.service';
+import { UserService } from '@app/core/services/user/user.service';
+import { takeUntil } from 'rxjs/operators';
+import { BaseComponent } from '@common/base/base.component';
+
+const availableLanguages: any[] = require('../../../../assets/resources/language.json');
+
+@Component({
+ selector: 'app-language',
+ templateUrl: './language.component.html',
+ styleUrls: ['./language.component.scss']
+})
+export class LanguageComponent extends BaseComponent implements OnInit {
+
+ languages = availableLanguages;
+
+ constructor(
+ private router: Router,
+ private authentication: AuthService,
+ private languageService: LanguageService,
+ private userService: UserService
+ ) { super(); }
+
+ ngOnInit() {
+ }
+
+ public isAuthenticated(): boolean {
+ return !(!this.authentication.current());
+}
+
+ public getCurrentLanguage(): any {
+ const lang = this.languages.find(lang => lang.value === this.languageService.getCurrentLanguage());
+ return lang;
+}
+
+ onLanguageSelected(selectedLanguage: any) {
+ if (this.isAuthenticated()) {
+ const langMap = new Map();
+ langMap.set('language', selectedLanguage.value);
+ this.userService.updateUserSettings({language: this.languages.find(lang => lang.value === selectedLanguage.value)})
+ .pipe(takeUntil(this._destroyed))
+ .subscribe((response) => {
+ this.languageService.changeLanguage(selectedLanguage.value);
+ this.authentication.me()
+ .pipe(takeUntil(this._destroyed))
+ .subscribe ( innerResponse =>
+ {this.router.navigateByUrl(this.router.url);});
+ },
+ error => {
+ console.log(error);
+ });
+ } else {
+ this.languageService.changeLanguage(selectedLanguage.value);
+ this.router.navigateByUrl(this.router.url);
+ }
+}
+
+}
diff --git a/dmp-frontend/src/app/ui/navbar/navbar.component.html b/dmp-frontend/src/app/ui/navbar/navbar.component.html
index 5aa660932..90b73b423 100644
--- a/dmp-frontend/src/app/ui/navbar/navbar.component.html
+++ b/dmp-frontend/src/app/ui/navbar/navbar.component.html
@@ -41,15 +41,7 @@
language
-
-
-
+
diff --git a/dmp-frontend/src/app/ui/navbar/navbar.component.scss b/dmp-frontend/src/app/ui/navbar/navbar.component.scss
index 552850e6a..fb7101ca8 100644
--- a/dmp-frontend/src/app/ui/navbar/navbar.component.scss
+++ b/dmp-frontend/src/app/ui/navbar/navbar.component.scss
@@ -25,13 +25,3 @@ $mat-card-header-size: 40px !default;
width: fit-content !important;
min-width: auto !important;
}
-
-::ng-deep.lang-menu {
- border-color: transparent;
- padding: 8px;
-}
-
-::ng-deep.lang-button {
- padding-top: 15px;
- padding-bottom: 15px;
-}
diff --git a/dmp-frontend/src/app/ui/navbar/navbar.component.ts b/dmp-frontend/src/app/ui/navbar/navbar.component.ts
index 511bc566f..47ffa62d6 100644
--- a/dmp-frontend/src/app/ui/navbar/navbar.component.ts
+++ b/dmp-frontend/src/app/ui/navbar/navbar.component.ts
@@ -37,8 +37,7 @@ export class NavbarComponent extends BaseComponent implements OnInit {
private authentication: AuthService,
private dialog: MatDialog,
private progressIndicationService: ProgressIndicationService,
- private languageService: LanguageService,
- private userService: UserService
+ private languageService: LanguageService
) {
super();
this.location = location;
@@ -211,26 +210,4 @@ export class NavbarComponent extends BaseComponent implements OnInit {
position: { top: '64px', right: '1em' }
});
}
-
- onLanguageSelected(selectedLanguage: any) {
- if (this.isAuthenticated()) {
- const langMap = new Map();
- langMap.set('language', selectedLanguage.value);
- this.userService.updateUserSettings({language: this.languages.find(lang => lang.value === selectedLanguage.value)})
- .pipe(takeUntil(this._destroyed))
- .subscribe((response) => {
- this.languageService.changeLanguage(selectedLanguage.value);
- this.authentication.me()
- .pipe(takeUntil(this._destroyed))
- .subscribe ( innerResponse =>
- {this.router.navigate([this.router.url]);});
- },
- error => {
- console.log(error);
- });
- } else {
- this.languageService.changeLanguage(selectedLanguage.value);
- this.router.navigate([this.router.url]);
- }
- }
}
diff --git a/dmp-frontend/src/app/ui/navbar/navbar.module.ts b/dmp-frontend/src/app/ui/navbar/navbar.module.ts
index 4d89a8027..78fd53053 100644
--- a/dmp-frontend/src/app/ui/navbar/navbar.module.ts
+++ b/dmp-frontend/src/app/ui/navbar/navbar.module.ts
@@ -5,13 +5,15 @@ import { SearchComponent } from '@app/ui/misc/search/search.component';
import { NavbarComponent } from '@app/ui/navbar/navbar.component';
import { CommonFormsModule } from '@common/forms/common-forms.module';
import { CommonUiModule } from '@common/ui/common-ui.module';
+import { LanguageModule } from '../language/language.module';
@NgModule({
imports: [
CommonUiModule,
CommonFormsModule,
RouterModule,
- BreadcrumbModule
+ BreadcrumbModule,
+ LanguageModule
],
declarations: [
NavbarComponent,
diff --git a/dmp-frontend/src/app/ui/sidebar/sidebar.component.html b/dmp-frontend/src/app/ui/sidebar/sidebar.component.html
index df25ff991..95839687b 100644
--- a/dmp-frontend/src/app/ui/sidebar/sidebar.component.html
+++ b/dmp-frontend/src/app/ui/sidebar/sidebar.component.html
@@ -29,8 +29,8 @@
-
-
+
+
{{ 'SIDE-BAR.ACCOUNT' | translate }}
@@ -47,6 +47,12 @@
{{ 'GENERAL.ACTIONS.LOG-IN' | translate }}
+
+
+ language
+ {{ 'GENERAL.TITLES.LANGUAGE' | translate }}
+
+
@@ -64,7 +70,7 @@
{{groupMenuItem.title | translate}}