Optimize style & fix username encoding

package.json

@@ -1,6 +1,6 @@
 {
   "name": "opt-cc",
-  "version": "1.4.4",
+  "version": "1.5.0",
   "license": "MIT",
   "private": true,
   "scripts": {

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

@@ -15,6 +15,13 @@ h2 {
   padding: 10px;
 }
 
+.btn-back {
+  clear: both;
+  float: left;
+  width: 120px;
+  margin-left: 10px;
+}
+
 .sum-container {
   width: 100%;
   margin: auto;

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

@@ -3,6 +3,8 @@
   <h2 class="pull-left">Spielerstatistik - {{campaignPlayer.name}}</h2>
   <h2 class="pull-right">{{campaignPlayer.campaign.title}} Kampagne</h2>
 
+  <span class="btn btn-default btn-back" (click)="navigateBack()">< Zurück</span>
+
 
   <div class="sum-container">
     <div class="gauge-container pull-left">
@@ -15,7 +17,7 @@
         [min]="0"
         [units]="'Kill/Death'">
       </ngx-charts-linear-gauge>
-      <span style="height: 150px"></span>
+      <span style="height: 150px; display: block;"></span>
       <ngx-charts-linear-gauge
         [view]="[200, 100]"
         [scheme]="colorScheme"

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

@@ -3,6 +3,7 @@ import {ActivatedRoute} from "@angular/router";
 import {CampaignPlayer} from "../../models/model-interfaces";
 import {PlayerService} from "../../services/player-service/player.service";
 import {ChartUtils} from "../../utils/chart-utils";
+import {Location} from '@angular/common';
 
 
 @Component({
@@ -28,7 +29,7 @@ export class CampaignPlayerDetailComponent {
   yAxisRespawn = 'Respawn';
   yAxisRevive = 'Revive';
   yAxisCapture = 'Eroberungen';
-
+  avgLabel = 'Durchschnitt';
 
   colorScheme = {
     domain: ['#00ce12']
@@ -58,8 +59,6 @@ export class CampaignPlayerDetailComponent {
   timeline = false;
   roundDomains = true;
 
-  avgLabel = 'Durchschnitt';
-
   totalKills;
   totalFriendlyFire;
   totalDeath;
@@ -73,13 +72,14 @@ export class CampaignPlayerDetailComponent {
 
 
   constructor(private route: ActivatedRoute,
+              private location: Location,
               private playerService: PlayerService) {
   }
 
   ngOnInit() {
     this.route.params
       .map(params => [params['id'], params['playerName']])
-      .flatMap(id => this.playerService.getCampaignPlayer(id[0], id[1]))
+      .flatMap(id => this.playerService.getCampaignPlayer(id[0], encodeURIComponent(id[1])))
       .subscribe(campaignPlayer => {
         this.campaignPlayer = campaignPlayer;
         this.killData = this.assignData(this.yAxisKill, "kill");
@@ -109,7 +109,7 @@ export class CampaignPlayerDetailComponent {
           },
           {
             name: this.yAxisRespawn,
-            value: this.totalDeath
+            value: this.totalRespawn
           },
           {
             name: this.yAxisRevive,
@@ -170,4 +170,8 @@ export class CampaignPlayerDetailComponent {
     return [killObj];
   }
 
+  navigateBack() {
+    this.location.back();
+  }
+
 }