Adding "game summary" page to add game component

src/app/components/add-game/add-game.component.html

@@ -54,7 +54,16 @@
 		</div>
 		<div id="extra-points" class="visible-{{this.currentPage === 5}}">
 			<p>Extra Points</p>
-			<button (click)="switchToNextPage()">Next</button>
+			<div *ngFor="let player of actualPlayers">
+				<p>{{player.firstName}}</p>
+				<input type="number" [(ngModel)]="player.foxesCaught" (change)="this.calculateCurrentScores()"/>
+			</div>
+			<p id="foxes-warn" *ngIf="!checkTotalFoxPoints()">Please check the number of caught foxes!</p>
+			<button (click)="switchToNextPage()" [disabled]="!checkAllExtraPoints()">Next</button>
+		</div>
+		<div id="summary" class="visible-{{this.currentPage === 5}}">
+			<p>Game Summary</p>
+			<button>Save Game</button>
 		</div>
 	</div>
 	<div id="scores">

src/app/components/add-game/add-game.component.ts

@@ -663,6 +663,9 @@ export class AddGameComponent implements OnInit {
 		this.soloPlayed = solo;
 	}
 
+	/**
+	 * Returns true if there is a solo selected, false otherwise
+	 */
 	noSoloSelectedYet(): boolean {
 		return this.soloPlayed === undefined;
 	}
@@ -675,5 +678,23 @@ export class AddGameComponent implements OnInit {
 	 * /_____/_/|_|\__/_/   \__,_/  /_/    \____/_/_/ /_/\__/____/
 	 */
 
+	/**
+	 * Checks if the number of caught foxes checks out
+	 */
+	checkTotalFoxPoints(): boolean {
+		let totalFoxPoints: number = 0;
 
+		for (let player of this.actualPlayers) {
+			totalFoxPoints += player.foxesCaught ?? 0;
+		}
+
+		return totalFoxPoints <= 2;
+	}
+
+	/**
+	 * Checks if all extra point types have valid entries
+	 */
+	checkAllExtraPoints(): boolean {
+		return this.checkTotalFoxPoints();
+	}
 }