Add i18n for squad management

pull/46/head
HardiReady 2018-10-03 15:22:14 +02:00
parent 4eef29bd05
commit e902ed5ec4
18 changed files with 126 additions and 45 deletions

View File

@ -6,7 +6,7 @@
</mat-button-toggle-group> </mat-button-toggle-group>
<button mat-icon-button <button mat-icon-button
class="add-btn" class="add-btn"
matTooltip="{{addButton.tooltip}}" matTooltip="{{addButton.tooltip | translate}}"
(click)="add()"> (click)="add()">
<mat-icon svgIcon="{{addButton.svgIcon}}"> <mat-icon svgIcon="{{addButton.svgIcon}}">
</mat-icon> </mat-icon>

View File

@ -6,7 +6,7 @@
<span class="input-group-btn"> <span class="input-group-btn">
<button class="btn btn-default" type="button" <button class="btn btn-default" type="button"
(click)="emitSearch()"> (click)="emitSearch()">
Suchen {{'public.common.search.button' | translate}}
</button> </button>
</span> </span>
</div> </div>

View File

@ -6,7 +6,6 @@ import {DecorationPanelComponent} from './decoration-overview/decoration-panel/d
import {RankPanelComponent} from './rank-overview/rank-panel/rank-panel.component'; import {RankPanelComponent} from './rank-overview/rank-panel/rank-panel.component';
import {UserListSheetComponent} from './user-list-sheet/user-list-sheet.component'; import {UserListSheetComponent} from './user-list-sheet/user-list-sheet.component';
import {PublicComponent} from './public.component'; import {PublicComponent} from './public.component';
import {StatisticComponent} from '../statistic/stats.component';
export const publicRoutes: Routes = [ export const publicRoutes: Routes = [
{ {

View File

@ -1,44 +1,43 @@
<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview"> <form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3 *ngIf="squad._id">Squad editieren</h3> <h3 *ngIf="squad._id">{{'squad.submit.edit.headline' | translate}}</h3>
<h3 *ngIf="!squad._id">Neues Squad hinzufügen</h3> <h3 *ngIf="!squad._id">{{'squad.submit.new.headline' | translate}}</h3>
<div class="form-group"> <div class="form-group">
<label for="title">Name</label> <label for="title">{{'squad.submit.field.name' | translate}}</label>
<input type="text" class="form-control" <input type="text" class="form-control"
[(ngModel)]="squad.name" [(ngModel)]="squad.name"
name="title" name="title"
id="title" id="title"
required maxlength="50"/> required maxlength="50"/>
<show-error displayName="{{'squad.submit.field.name' | translate}}" controlPath="title"></show-error>
<show-error displayName="Name" controlPath="title"></show-error>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="fraction">Fraktion</label> <label for="fraction">{{'squad.submit.field.fraction' | translate}}</label>
<select id="fraction" name="fraction" class="form-control btn dropdown-toggle" <select id="fraction" name="fraction" class="form-control btn dropdown-toggle"
required required
[(ngModel)]="squad.fraction"> [(ngModel)]="squad.fraction">
<option value="OPFOR">{{fraction.OPFOR}}</option> <option value="OPFOR">{{fraction.OPFOR}}</option>
<option value="BLUFOR">{{fraction.BLUFOR}}</option> <option value="BLUFOR">{{fraction.BLUFOR}}</option>
</select> </select>
<show-error displayName="Fraktion" controlPath="fraction"></show-error> <show-error displayName="{{'squad.submit.field.fraction' | translate}}" controlPath="fraction"></show-error>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="sort">Sortierung</label> <label for="sort">{{'squad.submit.field.sort' | translate}}</label>
<input id="sort" name="sort" type="number" class="form-control btn dropdown-toggle" <input id="sort" name="sort" type="number" class="form-control btn dropdown-toggle"
[(ngModel)]="squad.sortingNumber"> [(ngModel)]="squad.sortingNumber">
<show-error displayName="Sortierung" controlPath="sort"></show-error> <show-error displayName="{{'squad.submit.field.sort' | translate}}" controlPath="sort"></show-error>
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="logo">Logo</label> <label for="logo">{{'squad.submit.field.logo' | translate}}</label>
<input id="logo" name="logo" class="ui-button form-control" type="file" <input id="logo" name="logo" class="ui-button form-control" type="file"
#fileInput #fileInput
accept="image/png" accept="image/png"
(change)="fileChange($event)"> (change)="fileChange($event)">
<span class="label label-bg label-danger center-block" style="font-size:small" *ngIf="showImageError"> <span class="label label-bg label-danger center-block" style="font-size:small" *ngIf="showImageError">
Bild muss im PNG Format vorliegen {{'squad.submit.error.logo.type' | translate}}
</span> </span>
<img class="preview-image" src="{{imagePreviewSrc}}"> <img class="preview-image" src="{{imagePreviewSrc}}">
@ -47,7 +46,7 @@
<button id="cancel" <button id="cancel"
(click)="cancel()" (click)="cancel()"
class="btn btn-default"> class="btn btn-default">
Abbrechen {{'squad.submit.button.cancel' | translate}}
</button> </button>
<button id="save" <button id="save"
@ -55,6 +54,6 @@
(click)="saveSquad(fileInput)" (click)="saveSquad(fileInput)"
class="btn btn-default" class="btn btn-default"
[disabled]="!form.valid"> [disabled]="!form.valid">
Bestätigen {{'squad.submit.button.submit' | translate}}
</button> </button>
</form> </form>

View File

@ -7,6 +7,7 @@ import {Subscription} from 'rxjs/Subscription';
import {Fraction} from '../../utils/fraction.enum'; import {Fraction} from '../../utils/fraction.enum';
import {SnackBarService} from '../../services/user-interface/snack-bar/snack-bar.service'; import {SnackBarService} from '../../services/user-interface/snack-bar/snack-bar.service';
import {Message} from '../../i18n/de.messages'; import {Message} from '../../i18n/de.messages';
import {TranslateService} from '@ngx-translate/core';
@Component({ @Component({
@ -34,7 +35,8 @@ export class EditSquadComponent implements OnInit, OnDestroy {
constructor(private route: ActivatedRoute, constructor(private route: ActivatedRoute,
private router: Router, private router: Router,
private squadService: SquadService, private squadService: SquadService,
private snackBarService: SnackBarService) { private snackBarService: SnackBarService,
private translate: TranslateService) {
} }
ngOnInit() { ngOnInit() {
@ -73,7 +75,12 @@ export class EditSquadComponent implements OnInit, OnDestroy {
this.router.navigate(['..'], {relativeTo: this.route}); this.router.navigate(['..'], {relativeTo: this.route});
}); });
} else { } else {
return window.alert(`Bild ist ein Pflichtfeld`); this.translate.get('squad.submit.field.logo').subscribe((fieldNameLogfile) => {
this.translate.get('public.error.message.required',
{fieldName: fieldNameLogfile}).subscribe((message) => {
return window.alert(message);
})
});
} }
} else { } else {
if (this.fileList) { if (this.fileList) {
@ -95,12 +102,4 @@ export class EditSquadComponent implements OnInit, OnDestroy {
this.router.navigate([this.squad._id ? '../..' : '..'], {relativeTo: this.route}); this.router.navigate([this.squad._id ? '../..' : '..'], {relativeTo: this.route});
return false; return false;
} }
canDeactivate(): boolean {
if (this.saved || !this.form.dirty) {
return true;
}
return window.confirm(`Ihr Formular besitzt ungespeicherte Änderungen, möchten Sie die Seite wirklich verlassen?`);
}
} }

View File

@ -12,7 +12,9 @@
<div class="col-xs-4"> <div class="col-xs-4">
<img src="{{imageSrc}}" height="50px" class="squad-list-preview"> <img src="{{imageSrc}}" height="50px" class="squad-list-preview">
<span (click)="delete(); $event.stopPropagation()" matTooltip="Löschen" class="glyphicon glyphicon-trash trash"></span> <span (click)="delete(); $event.stopPropagation()"
matTooltip="{{'squad.modify.delete' | translate}}"
class="glyphicon glyphicon-trash trash"></span>
</div> </div>
</div> </div>
</div> </div>

View File

@ -2,7 +2,7 @@
<cc-list-filter <cc-list-filter
[filterButtons]="[{label: fraction.BLUFOR, value: 'BLUFOR'}, [filterButtons]="[{label: fraction.BLUFOR, value: 'BLUFOR'},
{label: fraction.OPFOR, value: 'OPFOR'}]" {label: fraction.OPFOR, value: 'OPFOR'}]"
[addButton]="{svgIcon: 'add', tooltip: 'Neues Squad hinzufügen'}" [addButton]="{svgIcon: 'add', tooltip: 'squad.list.tooltip.new'}"
(executeSearch)="filterSquads($event)" (executeSearch)="filterSquads($event)"
(openAddFrom)="openNewSquadForm()"> (openAddFrom)="openNewSquadForm()">
</cc-list-filter> </cc-list-filter>

View File

@ -0,0 +1 @@
<router-outlet></router-outlet>

View File

@ -0,0 +1,14 @@
import {Component} from '@angular/core';
import {TranslateService} from '@ngx-translate/core';
@Component({
selector: 'cc-squad-root',
templateUrl: './squad.component.html',
styleUrls: ['./squad.component.scss']
})
export class SquadComponent {
constructor(private translate: TranslateService) {
this.translate.setDefaultLang('de');
}
}

View File

@ -4,11 +4,36 @@ import {SharedModule} from '../shared.module';
import {squadRouterModule, squadsRoutingComponents} from './squads.routing'; import {squadRouterModule, squadsRoutingComponents} from './squads.routing';
import {SquadStore} from '../services/stores/squad.store'; import {SquadStore} from '../services/stores/squad.store';
import {SquadService} from '../services/army-management/squad.service'; import {SquadService} from '../services/army-management/squad.service';
import {HttpClient} from '@angular/common/http';
import {TranslateHttpLoader} from '@ngx-translate/http-loader';
import {TranslateLoader, TranslateModule} from '@ngx-translate/core';
export function createTranslateLoader(http: HttpClient) {
return new TranslateHttpLoader(http, './assets/i18n/squad/', '.json');
}
@NgModule({ @NgModule({
declarations: squadsRoutingComponents, declarations: squadsRoutingComponents,
imports: [CommonModule, SharedModule, squadRouterModule],
providers: [SquadStore, SquadService] imports: [
CommonModule,
SharedModule,
squadRouterModule,
TranslateModule.forChild({
loader: {
provide: TranslateLoader,
useFactory: (createTranslateLoader),
deps: [HttpClient]
},
isolate: true
})
],
providers: [
SquadStore,
SquadService
]
}) })
export class SquadsModule { export class SquadsModule {
static routes = squadRouterModule; static routes = squadRouterModule;

View File

@ -3,8 +3,13 @@ import {SquadListComponent} from './squad-list/squad-list.component';
import {EditSquadComponent} from './edit-squad/edit-squad.component'; import {EditSquadComponent} from './edit-squad/edit-squad.component';
import {ModuleWithProviders} from '@angular/core'; import {ModuleWithProviders} from '@angular/core';
import {SquadItemComponent} from './squad-list/squad-item.component'; import {SquadItemComponent} from './squad-list/squad-item.component';
import {SquadComponent} from './squad.component';
export const squadsRoutes: Routes = [ export const squadsRoutes: Routes = [
{
path: '',
component: SquadComponent
},
{ {
path: '', path: '',
component: SquadListComponent, component: SquadListComponent,
@ -19,9 +24,10 @@ export const squadsRoutes: Routes = [
path: 'edit/:id', path: 'edit/:id',
component: EditSquadComponent, component: EditSquadComponent,
outlet: 'right' outlet: 'right'
}]; }
];
export const squadRouterModule: ModuleWithProviders = RouterModule.forChild(squadsRoutes); export const squadRouterModule: ModuleWithProviders = RouterModule.forChild(squadsRoutes);
export const squadsRoutingComponents = [SquadItemComponent, SquadListComponent, EditSquadComponent]; export const squadsRoutingComponents = [SquadComponent, SquadItemComponent, SquadListComponent, EditSquadComponent];

View File

@ -26,11 +26,11 @@
</div> </div>
<div class="form-group" *ngIf="!war._id"> <div class="form-group" *ngIf="!war._id">
<label for="log">Logfile</label> <label for="log">{{'stats.war.submit.logfile' | translate}}</label>
<input id="log" name="log" class="ui-button form-control" type="file" <input id="log" name="log" class="ui-button form-control" type="file"
(change)="fileChange($event)"> (change)="fileChange($event)">
<span class="label label-bg label-danger center-block" style="font-size:small" *ngIf="showFileError"> <span class="label label-bg label-danger center-block" style="font-size:small" *ngIf="showFileError">
Logfile muss im Format RPT, LOG oder TXT vorliegen {{'stats.war.submit.error.file.format' | translate}}
</span> </span>
</div> </div>

View File

@ -8,6 +8,7 @@ import {SnackBarService} from '../../../services/user-interface/snack-bar/snack-
import {SpinnerService} from '../../../services/user-interface/spinner/spinner.service'; import {SpinnerService} from '../../../services/user-interface/spinner/spinner.service';
import {Subscription} from 'rxjs'; import {Subscription} from 'rxjs';
import {Fraction} from '../../../utils/fraction.enum'; import {Fraction} from '../../../utils/fraction.enum';
import {TranslateService} from '@ngx-translate/core';
@Component({ @Component({
@ -38,6 +39,7 @@ export class WarSubmitComponent {
private warService: WarService, private warService: WarService,
private snackBarService: SnackBarService, private snackBarService: SnackBarService,
private spinnerService: SpinnerService, private spinnerService: SpinnerService,
private translate: TranslateService,
public campaignService: CampaignService) { public campaignService: CampaignService) {
this.subscription = this.route.params this.subscription = this.route.params
.map(params => params['id']) .map(params => params['id'])
@ -61,7 +63,12 @@ export class WarSubmitComponent {
saveWar() { saveWar() {
if (!this.fileList) { if (!this.fileList) {
return window.alert(`Logfile ist ein Pflichtfeld`); this.translate.get('stats.war.submit.logfile').subscribe((fieldNameLogfile) => {
this.translate.get('public.error.message.required',
{fieldName: fieldNameLogfile}).subscribe((message) => {
return window.alert(message);
})
})
} }
const file: File = this.fileList[0]; const file: File = this.fileList[0];
this.loading = true; this.loading = true;

View File

@ -1,4 +1,13 @@
{ {
"public.error.headline": "Oops, diese Seite kennen wir nicht...",
"public.error.message.required": "{{fieldName}} ist ein Pflichtfeld",
"public.error.message.min.length": "{{fieldName}} muss mindestens {{boundary}} Zeichen enthalten",
"public.error.message.max.length": "{{fieldName}} darf maximal {{boundary}} Zeichen enthalten",
"public.error.message.email": "Bitte geben Sie eine gültige E-Mail Adresse an",
"public.error.message.no.user": "Der eingetragene Benutzer existiert nicht.",
"public.error.message.default": "{{fieldName}} ist nicht valide",
"public.common.search.button": "Suchen",
"navigation.top.board": "Zum Forum", "navigation.top.board": "Zum Forum",
"navigation.top.overview": "Armeeübersicht", "navigation.top.overview": "Armeeübersicht",
"navigation.top.ranks": "Ränge", "navigation.top.ranks": "Ränge",
@ -33,13 +42,5 @@
"public.army.headline": "Übersicht über alle Spieler, Squads und Armeen", "public.army.headline": "Übersicht über alle Spieler, Squads und Armeen",
"public army.squad.members": "Mitglieder:", "public army.squad.members": "Mitglieder:",
"public.army.members": "Armeemitglieder:", "public.army.members": "Armeemitglieder:"
"public.error.headline": "Oops, diese Seite kennen wir nicht...",
"public.error.message.required": "{{fieldName}} ist ein Pflichtfeld",
"public.error.message.min.length": "{{fieldName}} muss mindestens {{boundary}} Zeichen enthalten",
"public.error.message.max.length": "{{fieldName}} darf maximal {{boundary}} Zeichen enthalten",
"public.error.message.email": "Bitte geben Sie eine gültige E-Mail Adresse an",
"public.error.message.no.user": "Der eingetragene Benutzer existiert nicht.",
"public.error.message.default": "{{fieldName}} ist nicht valide"
} }

View File

@ -0,0 +1,22 @@
{
"public.error.headline": "Oops, diese Seite kennen wir nicht...",
"public.error.message.required": "{{fieldName}} ist ein Pflichtfeld",
"public.error.message.min.length": "{{fieldName}} muss mindestens {{boundary}} Zeichen enthalten",
"public.error.message.max.length": "{{fieldName}} darf maximal {{boundary}} Zeichen enthalten",
"public.error.message.email": "Bitte geben Sie eine gültige E-Mail Adresse an",
"public.error.message.no.user": "Der eingetragene Benutzer existiert nicht.",
"public.error.message.default": "{{fieldName}} ist nicht valide",
"public.common.search.button": "Suchen",
"squad.list.tooltip.delete": "Löschen",
"squad.list.tooltip.new": "Neues Squad hinzufügen",
"squad.submit.new.headline": "Neues Squad hinzufügen",
"squad.submit.edit.headline": "Squad bearbeiten",
"squad.submit.field.name": "Name",
"squad.submit.field.fraction": "Fraktion",
"squad.submit.field.sort": "Sortierung",
"squad.submit.field.logo": "Logo",
"squad.submit.error.logo.type": "Bild muss im PNG Format vorliegen",
"squad.submit.button.submit": "Bestätigen",
"squad.submit.button.cancel": "Abbrechen"
}

View File

@ -0,0 +1,3 @@
{
}

View File

@ -63,10 +63,12 @@
"stats.war.submit.headline.edit": "Schlacht bearbeiten", "stats.war.submit.headline.edit": "Schlacht bearbeiten",
"stats.war.submit.title": "Titel", "stats.war.submit.title": "Titel",
"stats.war.submit.campaign": "Kampagne", "stats.war.submit.campaign": "Kampagne",
"stats.war.submit.logfile": "Logfile",
"stats.war.submit.points": "Punkte", "stats.war.submit.points": "Punkte",
"stats.war.submit.final.budget": "Endbudget", "stats.war.submit.final.budget": "Endbudget",
"stats.war.submit.button.submit": "Bestätigen", "stats.war.submit.button.submit": "Bestätigen",
"stats.war.submit.button.cancel": "Abbrechen", "stats.war.submit.button.cancel": "Abbrechen",
"stats.war.submit.error.file.format": "Logfile muss im Format RPT, LOG oder TXT vorliegen",
"stats.campaign.submit.headline.new": "Neue Kampagne hinzufügen", "stats.campaign.submit.headline.new": "Neue Kampagne hinzufügen",
"stats.campaign.submit.headline.edit": "Kampagne editieren", "stats.campaign.submit.headline.edit": "Kampagne editieren",
@ -79,5 +81,6 @@
"public.error.message.max.length": "{{fieldName}} darf maximal {{boundary}} Zeichen enthalten", "public.error.message.max.length": "{{fieldName}} darf maximal {{boundary}} Zeichen enthalten",
"public.error.message.email": "Bitte geben Sie eine gültige E-Mail Adresse an", "public.error.message.email": "Bitte geben Sie eine gültige E-Mail Adresse an",
"public.error.message.no.user": "Der eingetragene Benutzer existiert nicht.", "public.error.message.no.user": "Der eingetragene Benutzer existiert nicht.",
"public.error.message.default": "{{fieldName}} ist nicht valide" "public.error.message.default": "{{fieldName}} ist nicht valide",
"public.common.search.button": "Suchen"
} }