Change designe and routing handling for explainer watchdog

src/app/game/game.component.html

@@ -33,10 +33,12 @@
     </h2>
   </mat-card>
   <br>
-  <button mat-raised-button color="primary" (click)="rightAnswer()">Richtig &#10004;</button>
-  <button mat-raised-button color="accent" style="margin: 40px" (click)="newCard()">Überspringen &#187;</button>
+  <button *ngIf="isExplainer" mat-raised-button color="primary" (click)="rightAnswer()">Richtig &#10004;</button>
+  <button *ngIf="isExplainer" mat-raised-button color="accent" style="margin: 40px" (click)="newCard()">Überspringen &#187;</button>
   <button mat-raised-button color="warn" (click)="wrongAnswer()">Tabu &#10008;</button>
   <br>
+  <br>
+  <br>
   <mat-card class="transparent">
     <mat-card-title>Spielstand</mat-card-title>
     <mat-card-content>

src/app/game/game.component.ts

@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import {ProgressSpinnerMode} from '@angular/material/progress-spinner';
 import {CardInfo} from '../interface/cardInfo';
 import {TabuMiddlewareService} from '../dao/TabuMiddlewareService';
-import {ActivatedRoute} from '@angular/router';
+import {ActivatedRoute, Router} from '@angular/router';
 import {GameStatus} from '../interface/gameStatus';
 
 @Component({
@@ -13,6 +13,8 @@ import {GameStatus} from '../interface/gameStatus';
 export class GameComponent implements OnInit {
 
   sessionName = '';
+  isWatchdog = false;
+  isExplainer = false;
   cardInfo: CardInfo = {
     cardID: -1,
     solution: '',
@@ -37,11 +39,19 @@ export class GameComponent implements OnInit {
   mode: ProgressSpinnerMode = 'determinate';
   value = 50;
   constructor(private service: TabuMiddlewareService,
+              private router: Router,
               private activatedRoute: ActivatedRoute) {}
 
   ngOnInit(): void {
     this.activatedRoute.paramMap.subscribe(params => {
       this.sessionName = String(params.get('sessionName'));
+      const url = this.router.url.split('/');
+      const checkUser = url[url.length - 1];
+      if (checkUser === 'watchdog') {
+        this.isWatchdog = true;
+      } else if (checkUser === 'explainer') {
+        this.isExplainer = true;
+      }
       this.service.getGamestatus({spielname: this.sessionName}).then(value => {
         const status = JSON.parse(value.status);
         if (status) {

src/app/overview/overview.component.ts

@@ -11,7 +11,7 @@ import {GameStatus} from '../interface/gameStatus';
 export class OverviewComponent implements OnInit {
   red = 'choose';
   blue = 'choose';
-  nextTeam = '';
+  nextTeam = 'Blau';
   team = '';
   buttonPlayDisabled = true;
   sessionName = '';
@@ -53,12 +53,6 @@ export class OverviewComponent implements OnInit {
         this.router.navigate(['error']);
         return;
       }
-      if (this.gameStatus.redTurn){
-        this.nextTeam = 'Rot';
-      }
-      else{
-        this.nextTeam = 'Blau';
-      }
       this.service.getGamestatus({spielname: this.sessionName}).then(value => {
         const status = JSON.parse(value.status);
         if (status) {
@@ -68,6 +62,12 @@ export class OverviewComponent implements OnInit {
           this.gameStatus.redTurn = JSON.parse(value.redTurn);
           this.gameStatus.activeExplainer = JSON.parse(value.activeExplainer);
           this.gameStatus.activeWatchdog = JSON.parse(value.activeWatchdog);
+          if (this.gameStatus.redTurn){
+            this.nextTeam = 'Rot';
+          }
+          else{
+            this.nextTeam = 'Blau';
+          }
         }
         console.log(this.gameStatus);
       }).catch(reason => console.log(reason));
@@ -76,7 +76,7 @@ export class OverviewComponent implements OnInit {
 
   startGame(): void {
     if (this.team === 'red' || this.team === 'blue') {
-      this.router.navigate([this.router.url + '/watchdog']);
+      this.router.navigate([this.router.url + '/explainer']);
     }
   }
   joinTeam(team: string): void {