Add war detail player count chart

api/package-lock.json

@@ -2239,9 +2239,9 @@
       }
     },
     "kareem": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/kareem/-/kareem-1.4.1.tgz",
-      "integrity": "sha1-7XYgAET6BB7zK02oJh4lU/EXNTE="
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/kareem/-/kareem-1.5.0.tgz",
+      "integrity": "sha1-4+QQHZ3P3imXadr0tNtk2JXRdEg="
     },
     "kind-of": {
       "version": "3.2.2",
@@ -2800,20 +2800,20 @@
       }
     },
     "mongoose": {
-      "version": "4.11.1",
-      "resolved": "https://registry.npmjs.org/mongoose/-/mongoose-4.11.1.tgz",
-      "integrity": "sha1-JWC22J50SwWFfQJMq4sxYGZxbj4=",
+      "version": "4.11.4",
+      "resolved": "https://registry.npmjs.org/mongoose/-/mongoose-4.11.4.tgz",
+      "integrity": "sha1-PXQREQXui2GescHXkOe/xOjLp7s=",
       "requires": {
         "async": "2.1.4",
         "bson": "1.0.4",
         "hooks-fixed": "2.0.0",
-        "kareem": "1.4.1",
+        "kareem": "1.5.0",
         "mongodb": "2.2.27",
         "mpath": "0.3.0",
         "mpromise": "0.5.5",
         "mquery": "2.3.1",
         "ms": "2.0.0",
-        "muri": "1.2.1",
+        "muri": "1.2.2",
         "regexp-clone": "0.0.1",
         "sliced": "1.0.1"
       },
@@ -2953,9 +2953,9 @@
       }
     },
     "muri": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/muri/-/muri-1.2.1.tgz",
-      "integrity": "sha1-7H6lzmympSPrGrNbrNpfqBbJqjw="
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/muri/-/muri-1.2.2.tgz",
+      "integrity": "sha1-YxmBMmUNsIoEzHnM0A3Tia/SYxw="
     },
     "negotiator": {
       "version": "0.5.3",
@@ -3641,7 +3641,7 @@
     "require_optional": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/require_optional/-/require_optional-1.0.1.tgz",
-      "integrity": "sha1-TPNaQkf2TKPfjC7yCMxJSxyo/C4=",
+      "integrity": "sha512-qhM/y57enGWHAe3v/NcwML6a3/vfESLe/sGM2dII+gEO0BpKRUkWZow/tyloNqJyN6kXSl3RyyM8Ll5D/sJP8g==",
       "requires": {
         "resolve-from": "2.0.0",
         "semver": "5.3.0"

api/package.json

@@ -24,7 +24,7 @@
     "jsonwebtoken": "^7.4.0",
     "lodash": "^4.17.4",
     "mkdirp": "^0.5.1",
-    "mongoose": "^4.11.1",
+    "mongoose": "^4.11.4",
     "morgan": "~1.6.1",
     "multer": "^1.3.0",
     "node-sha1": "^1.0.1",

static/package.json

@@ -40,7 +40,6 @@
   "devDependencies": {
     "@types/jasmine": "2.5.38",
     "@types/node": "~6.0.60",
-    "@types/socket.io-client": "^1.4.26",
     "codelyzer": "~2.0.0-beta.1",
     "jasmine-core": "^2.5.2",
     "jasmine-spec-reporter": "^3.2.0",

static/src/app/models/model-interfaces.ts

@@ -33,6 +33,8 @@ export interface War {
   date?: string;
   ptBlufor?: number;
   ptOpfor?: number;
+  playersBlufor?: number;
+  playersOpfor?: number;
   bestPlayerId?: Player;
   players: Player[];
 }

static/src/app/wars/war-detail.component.html

@@ -9,7 +9,22 @@
       <span class="text-opfor" style="font-weight: bold; margin-left: 10px;">{{war.ptOpfor}} CSAT</span>
     </h3>
 
-    <div style="margin-left: 500px; margin-top:1%">
+    <h3 class="pull-left" style="padding-left: 10%;">
+      <h4>Teilnehmer:</h4>
+      <ngx-charts-pie-chart
+        [view]="[150, 150]"
+        [scheme]="{domain: ['#B22222', '#0000FF']}"
+        [results]="playerChart"
+        [legend]="false"
+        [explodeSlices]="false"
+        [labels]="false"
+        [doughnut]="false"
+        [gradient]="false"
+        (select)="onSelect($event)">
+      </ngx-charts-pie-chart>
+    </h3>
+
+    <div style="margin-left: 600px; margin-top:1%">
       <a class="btn btn-default" style="margin: 20px" target="_blank" href="resource/logs/{{war._id}}/clean.log">Logfile
         anzeigen</a>
       <button *ngIf="loginService.hasPermission(3)" class="btn btn-warning" style="margin: 20px" (click)="delete()">

static/src/app/wars/war-detail.component.ts

@@ -22,10 +22,13 @@ export class WarDetailComponent {
 
   sortOrder = "desc";
 
+  playerChart: any[] = [];
+
   constructor(private router: Router,
               private route: ActivatedRoute,
               private warService: WarService,
               private loginService: LoginService) {
+    Object.assign(this, this.playerChart)
   }
 
   ngOnInit() {
@@ -36,6 +39,16 @@ export class WarDetailComponent {
       .subscribe(war => {
         this.war = war;
         this.players = war.players;
+        this.playerChart = [
+          {
+            "name": "CSAT",
+            "value": war.playersOpfor
+          },
+          {
+            "name": "NATO",
+            "value": war.playersBlufor
+          }
+        ];
       });
   }