Add i18n for stats fraction/scoreboard/overview

static/src/app/app.component.html

@@ -30,7 +30,7 @@
               class="dropdown">
             <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                aria-expanded="false">
-              {{'navigation.top.management' | translate}}57
+              {{'navigation.top.management' | translate}}
               <span class="caret"></span>
             </a>
             <ul class="dropdown-menu">

static/src/app/shared.module.ts

@@ -12,7 +12,7 @@ import {HttpClient} from '@angular/common/http';
 import {TranslateHttpLoader} from '@ngx-translate/http-loader';
 
 export function createTranslateLoader(http: HttpClient) {
-  return new TranslateHttpLoader(http, './assets/i18n/', '.json');
+  return new TranslateHttpLoader(http, './assets/i18n/app/', '.json');
 }
 
 @NgModule({

static/src/app/statistic/campaign/campaign-navigation/campaign-navigation.component.html

@@ -9,7 +9,7 @@
   <div class="campaign-entry"
        [ngClass]="{active : selectedCampaignId === 'all'}"
        (click)="select({_id:'all'})">
-    Ewige Übersicht
+    {{'stats.campaign.title.all.time.overview' | translate}}
   </div>
   <div class="campaign-entry"
        *ngFor="let campaign of campaigns"
@@ -27,11 +27,11 @@
       <mat-menu #menu="matMenu">
         <button mat-menu-item (click)="edit(campaign)">
           <mat-icon svgIcon="edit"></mat-icon>
-          <span>Bearbeiten</span>
+          <span>{{'stats.campaign.manage.edit' | translate}}</span>
         </button>
         <button mat-menu-item (click)="delete(campaign)">
           <mat-icon svgIcon="delete"></mat-icon>
-          <span>Löschen</span>
+          <span>{{'stats.campaign.manage.delete' | translate}}</span>
         </button>
       </mat-menu>
     </span>

static/src/app/statistic/campaign/campaign-player-detail/campaign-player-detail.component.html

@@ -1,9 +1,9 @@
 <div class="fade-in player-campaign-detail-container" xmlns="http://www.w3.org/1999/html">
-  <h2 class="pull-left">Kampagnendetails - {{campaignPlayer.name}}</h2>
+  <h2 class="pull-left">{{'stats.player.detail.headline' | translate}} {{campaignPlayer.name}}</h2>
 
   <button class="btn-back" mat-raised-button (click)="navigateBack()">
     <mat-icon svgIcon="chevron-left"></mat-icon>
-    Zurück
+    {{'stats.player.detail.button.back' | translate}}
   </button>
 
   <div class="sum-container">
@@ -15,7 +15,7 @@
         [previousValue]="1"
         [max]="maxKd"
         [min]="0"
-        [units]="'Kill/Death'">
+        [units]="translations['stats.player.detail.kill.death.ratio']">
       </ngx-charts-linear-gauge>
       <span style="height: 150px; display: block;"></span>
       <ngx-charts-linear-gauge
@@ -25,7 +25,7 @@
         [previousValue]="0.5"
         [max]="maxRespawnDeathRatio"
         [min]="0"
-        [units]="'Respawn/Death'">
+        [units]="translations['stats.player.detail.respawn.death.ratio']">
       </ngx-charts-linear-gauge>
     </div>
 

static/src/app/statistic/campaign/campaign-player-detail/campaign-player-detail.component.ts

@@ -3,6 +3,7 @@ import {CampaignPlayer} from '../../../models/model-interfaces';
 import {PlayerService} from '../../../services/logs/player.service';
 import {ChartUtils} from '../../../utils/chart-utils';
 import {PlayerUtils} from '../../../utils/player-utils';
+import {TranslateService} from '@ngx-translate/core';
 
 
 @Component({
@@ -24,7 +25,7 @@ export class CampaignPlayerDetailComponent implements OnInit {
   graphData: any[] = [];
   sumData: any[] = [];
 
-  avgLabel = 'Durchschnitt';
+  translations = {};
 
   colorScheme = {
     domain: ['#00ce12']
@@ -54,10 +55,19 @@ export class CampaignPlayerDetailComponent implements OnInit {
 
   playerAttributeNameMap = PlayerUtils.attributeDisplayNames.slice(2, PlayerUtils.attributeDisplayNames.length);
 
-  constructor(private playerService: PlayerService) {
+  constructor(private playerService: PlayerService,
+              private translate: TranslateService) {
   }
 
   ngOnInit() {
+    ['stats.player.detail.graph.average',
+      'stats.player.detail.kill.death.ratio',
+      'stats.player.detail.respawn.death.ratio'].forEach((i18n) => {
+      this.translate.get(i18n).subscribe((translated) => {
+        this.translations[i18n] = translated;
+      });
+    });
+
     this.playerService.getCampaignPlayer(this.campaignId, encodeURIComponent(this.playerName))
         .subscribe(campaignPlayer => {
           this.campaignPlayer = campaignPlayer;
@@ -105,7 +115,7 @@ export class CampaignPlayerDetailComponent implements OnInit {
       }
 
       dataSet.data = [killObj];
-      dataSet.refLine = [{value: total / playerLength, name: this.avgLabel}];
+      dataSet.refLine = [{value: total / playerLength, name: this.translations['stats.player.detail.graph.average']}];
       dataSet.total = total;
     });
   }

static/src/app/statistic/campaign/overview/campaign-overview.component.html

@@ -3,13 +3,13 @@
                            [value]="this.id !== 'all' ? '0' : '1'"
                            (change)="goToSlide(viewToggle.value)">
     <mat-button-toggle *ngIf="id != 'all'" value="0">
-      Gesamtpunktzahl
+      {{'stats.graph.select.sum.points' | translate}}
     </mat-button-toggle>
     <mat-button-toggle value="1">
-      Punkte je Schlacht
+      {{'stats.graph.select.battle.points' | translate}}
     </mat-button-toggle>
     <mat-button-toggle value="2">
-      Spielerzahlen
+      {{'stats.graph.select.player.count' | translate}}
     </mat-button-toggle>
   </mat-button-toggle-group>
 </div>

static/src/app/statistic/stats.component.ts

@@ -2,6 +2,7 @@ import {Component, OnInit} from '@angular/core';
 import {Campaign} from '../models/model-interfaces';
 import {CampaignService} from '../services/logs/campaign.service';
 import {ActivatedRoute, Router} from '@angular/router';
+import {TranslateService} from '@ngx-translate/core';
 
 @Component({
   selector: 'cc-stats',
@@ -18,13 +19,15 @@ export class StatisticComponent implements OnInit {
 
   constructor(private campaignService: CampaignService,
               private router: Router,
-              private route: ActivatedRoute) {
+              private route: ActivatedRoute,
+              private translate: TranslateService) {
+    this.translate.setDefaultLang('de');
   }
 
   ngOnInit() {
     this.campaignService.getAllCampaignsWithWars().subscribe((campaigns) => {
       this.campaigns = campaigns;
-      // TODO next line has to die!
+      // TODO: next line has to die!
       this.campaignService.campaigns = campaigns;
       this.selectedCampaign = this.resolveCampaignFromUrl();
       this.switchCampaign(this.selectedCampaign);
@@ -73,12 +76,14 @@ export class StatisticComponent implements OnInit {
   }
 
   deleteCampaign(campaign) {
-    if (confirm('Soll die Kampagne ' + campaign.title + ' wirklich gelöscht werden?')) {
+    this.translate.get('stats.campaign.manage.delete.confirm', {title: campaign.title}).subscribe((confirmQuestion: string) => {
-      this.campaignService.deleteCampaign(campaign._id)
+      if (confirm(confirmQuestion)) {
-          .subscribe((res) => {
+        this.campaignService.deleteCampaign(campaign._id)
-            this.campaigns.splice(this.campaigns.indexOf(campaign), 1);
+            .subscribe((res) => {
-          });
+              this.campaigns.splice(this.campaigns.indexOf(campaign), 1);
-    }
+            });
+      }
+    });
   }
 
   editCampaign(selectCampaign) {

static/src/app/statistic/stats.module.ts

@@ -8,13 +8,43 @@ import {CampaignService} from '../services/logs/campaign.service';
 import {PlayerService} from '../services/logs/player.service';
 import {LogsService} from '../services/logs/logs.service';
 import {MatButtonToggleModule, MatMenuModule, MatSortModule, MatTableModule} from '@angular/material';
+import {HttpClient} from '@angular/common/http';
+import {TranslateHttpLoader} from '@ngx-translate/http-loader';
+import {TranslateModule, TranslateLoader} from '@ngx-translate/core';
 
+export function createTranslateLoader(http: HttpClient) {
+  return new TranslateHttpLoader(http, './assets/i18n/statistics/', '.json');
+}
 
 @NgModule({
   declarations: statsRoutingComponents,
-  imports: [CommonModule, SharedModule, NgxChartsModule, MatButtonToggleModule, MatTableModule, MatSortModule,
+
-    MatMenuModule, statsRouterModule],
+  imports: [
-  providers: [WarService, CampaignService, PlayerService, LogsService]
+    CommonModule,
+    SharedModule,
+    NgxChartsModule,
+    MatButtonToggleModule,
+    MatTableModule,
+    MatSortModule,
+    MatMenuModule,
+    statsRouterModule,
+
+    TranslateModule.forChild({
+      loader: {
+        provide: TranslateLoader,
+        useFactory: (createTranslateLoader),
+        deps: [HttpClient]
+      },
+      isolate: true
+    })
+  ],
+
+  providers: [
+    WarService,
+    CampaignService,
+    PlayerService,
+    LogsService
+  ]
 })
 export class StatsModule {
   static routes = statsRouterModule;

static/src/app/statistic/war/fraction-stats/fraction-stats.component.html

@@ -5,7 +5,7 @@
                            [(ngModel)]="activeChartSelect"
                            (change)="selectChart(group.value)">
     <mat-button-toggle *ngFor="let label of labelsAsString" value="{{label}}">
-      {{label}}
+      {{label | translate}}
     </mat-button-toggle>
   </mat-button-toggle-group>
 

static/src/app/statistic/war/fraction-stats/fraction-stats.component.ts

@@ -3,6 +3,7 @@ import * as d3 from 'd3';
 import {ChartUtils} from '../../../utils/chart-utils';
 import {Fraction} from '../../../utils/fraction.enum';
 import {War} from '../../../models/model-interfaces';
+import {TranslateService} from '@ngx-translate/core';
 
 
 @Component({
@@ -21,7 +22,7 @@ export class FractionStatsComponent implements OnInit, OnChanges {
   @Input() logData: any;
 
   startDateObj: Date;
-  load
+
   initialized: any;
 
   public activeChartSelect: string;
@@ -45,19 +46,19 @@ export class FractionStatsComponent implements OnInit, OnChanges {
   };
 
   readonly labels = {
-    points: 'Punkte',
+    points: 'stats.fraction.select.points',
-    budget: 'Budget',
+    budget: 'stats.fraction.select.budget',
-    kill: 'Abschüsse',
+    kill: 'stats.fraction.select.kills',
-    friendlyFire: 'Friendly Fire',
+    friendlyFire: 'stats.fraction.select.friendly.fire',
-    vehicle: 'Fahrzeug Abschüsse',
+    vehicle: 'stats.fraction.select.vehicle.kills',
-    transport: 'Lufttransport',
+    transport: 'stats.fraction.select.air.transport',
-    revive: 'Revive',
+    revive: 'stats.fraction.select.revive',
-    stabilize: 'Stabilisiert',
+    stabilize: 'stats.fraction.select.stabilize',
-    flag: 'Flaggenbesitz'
+    flag: 'stats.fraction.select.flag'
   };
   readonly labelsAsString = Object.keys(this.labels).map((key) => this.labels[key]);
 
-  lineChartLabel: string = this.labels.points;
+  lineChartLabel: string;
 
   showLineChart = true;
   stepCurve = d3.curveStepAfter;
@@ -72,10 +73,11 @@ export class FractionStatsComponent implements OnInit, OnChanges {
   timeline = false;
   roundDomains = true;
 
-  constructor() {
+  constructor(private translate: TranslateService) {
   }
 
   ngOnInit() {
+    this.setLineChartLabel(this.labels.points);
   }
 
   ngOnChanges(changes: SimpleChanges) {
@@ -101,7 +103,7 @@ export class FractionStatsComponent implements OnInit, OnChanges {
     this.activeChartSelect = newSelection;
     if (this.activeChartSelect !== this.labels.flag) {
       this.showLineChart = true;
-      this.lineChartLabel = this.activeChartSelect;
+      this.setLineChartLabel(this.activeChartSelect);
       switch (this.activeChartSelect) {
         case this.labels.points:
           this.lineChartData = this.tmpPointData;
@@ -146,7 +148,6 @@ export class FractionStatsComponent implements OnInit, OnChanges {
     this.initializeTempCollections();
     this.initPointData();
     this.showLineChart = true;
-    this.lineChartLabel = this.labels.points;
     this.lineChartData = this.tmpPointData;
   }
 
@@ -412,4 +413,10 @@ export class FractionStatsComponent implements OnInit, OnChanges {
       }
     }
   }
+
+  setLineChartLabel(i18n: string) {
+    this.translate.get(i18n).subscribe((translated) => {
+      this.lineChartLabel = translated;
+    });
+  }
 }

static/src/app/statistic/war/war-list/war-item.component.html

@@ -17,16 +17,17 @@
       <mat-menu #menu="matMenu">
         <button mat-menu-item (click)="edit()">
           <mat-icon svgIcon="edit"></mat-icon>
-          <span>Bearbeiten</span>
+          <span>{{'stats.sidebar.battle.manage.edit' | translate}}</span>
         </button>
         <button mat-menu-item (click)="delete()">
           <mat-icon svgIcon="delete"></mat-icon>
-          <span>Löschen</span>
+          <span>{{'stats.sidebar.battle.manage.delete' | translate}}</span>
         </button>
       </mat-menu>
     </span>
     <div class="war-detail"
-         [ngClass]="{collapsed: collapsed}">vom {{war.date | date: 'dd.MM.yyyy'}}
+         [ngClass]="{collapsed: collapsed}">
+      {{'stats.sidebar.battles.battle.from.date' | translate}} {{war.date | date: 'dd.MM.yyyy'}}
     </div>
   </div>
 </div>

static/src/app/statistic/war/war-list/war-list.component.html

@@ -1,6 +1,6 @@
 <div class="war-list-header" *ngIf="!collapsed && loginService.hasPermission(3)">
   <button mat-stroked-button (click)="selectNewCampaign()">
-    Kampagne hinzufügen
+    {{'stats.campaign.manage.add' | translate}}
   </button>
   <button mat-stroked-button (click)="selectNewWar()">
     Schlacht hinzufügen
@@ -12,10 +12,10 @@
   <div class="select-indicator-container">
     <div class="select-indicator"></div>
   </div>
-  <mat-icon [matTooltip]="collapsed ? 'Übersicht' : ''"
+  <mat-icon [matTooltip]="collapsed ? toolTipTranslation['stats.sidebar.overview'] : ''"
             matTooltipPosition="right"
             svgIcon="stats-chart"></mat-icon>
-  <span *ngIf="!collapsed">Übersicht</span>
+  <span *ngIf="!collapsed">{{'stats.sidebar.overview' | translate}}</span>
 </div>
 
 <div class="list-header"
@@ -23,17 +23,17 @@
   <div class="select-indicator-container">
     <div class="select-indicator"></div>
   </div>
-  <mat-icon [matTooltip]="collapsed ? 'Highscore' : ''"
+  <mat-icon [matTooltip]="collapsed ? toolTipTranslation['stats.sidebar.highscore'] : ''"
             matTooltipPosition="right"
             svgIcon="highscore"></mat-icon>
-  <span *ngIf="!collapsed">Highscore</span>
+  <span *ngIf="!collapsed">{{'stats.sidebar.highscore' | translate}}</span>
 </div>
 
 <div class="list-header" style="cursor: default; border-bottom: 1px solid #f1f1f1;">
-  <mat-icon [matTooltip]="collapsed ? 'Schlachten' : ''"
+  <mat-icon [matTooltip]="collapsed ? toolTipTranslation['stats.sidebar.battles'] : ''"
             matTooltipPosition="right"
             svgIcon="battle"></mat-icon>
-  <span *ngIf="!collapsed">Schlachten</span>
+  <span *ngIf="!collapsed">{{'stats.sidebar.battles' | translate}}</span>
 </div>
 
 <div class="battle-list">

static/src/app/statistic/war/war-list/war-list.component.ts

@@ -5,6 +5,7 @@ import {WarService} from '../../../services/logs/war.service';
 import {LoginService} from '../../../services/app-user-service/login-service';
 import {CampaignService} from '../../../services/logs/campaign.service';
 import {RouteConfig} from '../../../app.config';
+import {TranslateService} from '@ngx-translate/core';
 
 @Component({
   selector: 'war-list',
@@ -21,13 +22,23 @@ export class WarListComponent implements OnChanges {
 
   changeCount = 0;
 
-  public readonly highscore = 'HIGHSCORE';
+  toolTipTranslation = {};
+
+  readonly highscore = 'HIGHSCORE';
 
   constructor(private warService: WarService,
               private campaignService: CampaignService,
               public loginService: LoginService,
               private router: Router,
-              private route: ActivatedRoute) {
+              private route: ActivatedRoute,
+              private translate: TranslateService) {
+    ['stats.sidebar.overview',
+      'stats.sidebar.highscore',
+      'stats.sidebar.battles'].forEach(i18n => {
+      this.translate.get(i18n).subscribe((translated) => {
+        this.toolTipTranslation[i18n] = translated;
+      })
+    });
   }
 
   ngOnChanges(changes: SimpleChanges) {
@@ -93,14 +104,17 @@ export class WarListComponent implements OnChanges {
   }
 
   deleteWar(war: War) {
-    if (confirm('Soll die Schlacht ' + war.title + ' wirklich gelöscht werden?')) {
+    this.translate.get('stats.sidebar.battle.manage.delete.confirm', {title: war.title})
-      this.warService.deleteWar(war._id)
+        .subscribe((confirmQuestion: string) => {
-        .subscribe((res) => {
+          if (confirm(confirmQuestion)) {
-          if (this.selectedWarId === war._id) {
+            this.warService.deleteWar(war._id)
-            this.selectOverview('all');
+                .subscribe((res) => {
+                  if (this.selectedWarId === war._id) {
+                    this.selectOverview('all');
+                  }
+                  this.campaign.wars.splice(this.campaign.wars.indexOf(war), 1);
+                });
           }
-          this.campaign.wars.splice(this.campaign.wars.indexOf(war), 1);
         });
-    }
   }
 }

static/src/assets/i18n/statistics/de.json

@@ -0,0 +1,57 @@
+{
+  "stats.campaign.manage.add": "Kampagne hinzufügen",
+  "stats.campaign.manage.edit": "Bearbeiten",
+  "stats.campaign.manage.delete": "Löschen",
+  "stats.campaign.manage.delete.confirm": "Soll die Kampagne \"{{title}}\" wirklich gelöscht werden?",
+  "stats.campaign.title.all.time.overview": "Ewige Übersicht",
+
+  "stats.sidebar.overview": "Übersicht",
+  "stats.sidebar.highscore": "Highscore",
+  "stats.sidebar.battles": "Schlachten",
+
+  "stats.sidebar.battles.battle.from.date": "vom",
+  "stats.sidebar.battle.manage.edit": "Bearbeiten",
+  "stats.sidebar.battle.manage.delete": "Löschen",
+  "stats.sidebar.battle.manage.delete.confirm": "Soll die Schlacht \"{{title}}\" wirklich gelöscht werden?",
+
+  "stats.graph.select.sum.points": "Gesamtpunktzahl",
+  "stats.graph.select.battle.points": "Punkte je Schlacht",
+  "stats.graph.select.player.count": "Spielerzahlen",
+
+  "stats.fraction.select.points": "Punkte",
+  "stats.fraction.select.budget": "Budget",
+  "stats.fraction.select.kills": "Abschüsse",
+  "stats.fraction.select.friendly.fire": "Friendly Fire",
+  "stats.fraction.select.vehicle.kills": "Fahrzeugabschüsse",
+  "stats.fraction.select.air.transport": "Lufttransport",
+  "stats.fraction.select.revive": "Revive",
+  "stats.fraction.select.stabilize": "Stabilisiert",
+  "stats.fraction.select.flag": "Flaggenbesitz",
+
+  "stats.player.detail.headline": "Kampagnendetails -",
+  "stats.player.detail.button.back": "Zurück",
+  "stats.player.detail.kill.death.ratio": "Kill/Death",
+  "stats.player.detail.respawn.death.ratio": "Respawn/Death",
+  "stats.player.detail.graph.average": "Durchschnitt",
+
+  "stats.scoreboard.standings": "Endpunktestand",
+  "stats.scoreboard.participants": "Teilnehmer",
+  "stats.scoreboard.show.logs": "Logfile anzeigen",
+  "stats.scoreboard.download.csv": "Download CSV",
+  "stats.scoreboard.tab.scoreboard": "Scoreboard",
+  "stats.scoreboard.tab.fractions": "Fraktionen",
+  "stats.scoreboard.tab.player": "Spieler",
+  "stats.scoreboard.fraction.filter.all": "Alle",
+  "stats.scoreboard.header.player": "Spieler",
+  "stats.scoreboard.header.fraction": "Fraktion",
+  "stats.scoreboard.header.kill": "Abschüsse",
+  "stats.scoreboard.header.friendly.fire": "Friendly Fire",
+  "stats.scoreboard.header.revive": "Revive",
+  "stats.scoreboard.header.capture": "Eroberungen",
+  "stats.scoreboard.header.vehicle.light": "Fahrzeug (leicht)",
+  "stats.scoreboard.header.vehicle.heavy": "Fahrzeug (schwer)",
+  "stats.scoreboard.header.vehicle.air": "Fahrzeug (Luft)",
+  "stats.scoreboard.header.death": "Tode",
+  "stats.scoreboard.header.respawn": "Respawn",
+  "stats.scoreboard.button.detail": "Kampagnenstatistik für {{name}}"
+}

static/src/assets/i18n/statistics/en.json

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