66 lines
3.8 KiB
HTML
66 lines
3.8 KiB
HTML
<app-header></app-header>
|
|
<div id="add-game">
|
|
<div id="game-infos">
|
|
<!-- The following divs get displayed one after another, kinda wizard-like -->
|
|
<div id="which-players" class="visible-{{this.currentPage === 0}}">
|
|
<p>Select the active players for the game:</p>
|
|
<div class="togglebtn active-{{isPlayerActive(player)}}" *ngFor="let player of potentialPlayers" (click)="togglePlayer(player)">{{player.firstName}}</div>
|
|
<p id="player-amount-warn" *ngIf="not4Players()">Illegal amount of players!</p>
|
|
<button (click)="switchToNextPage()" [disabled]="not4Players()">Next</button>
|
|
</div>
|
|
<div id="announcements" class="visible-{{this.currentPage === 1}}">
|
|
<p>Players: {{getPlayerNamesAsString()}}</p>
|
|
<p>Select the announcements for this game:</p>
|
|
<div class="togglebtn active-{{isAnnouncementActive(announcement)}}" *ngFor="let announcement of getAllPossibleAnnouncements()" (click)="toggleAnnouncement(announcement)">{{announcement.toString()}}</div>
|
|
<p id="announcement-warn" *ngIf="!checkAnnouncementsValid()">Illegal set of announcements!</p>
|
|
<button (click)="switchToNextPage()" [disabled]="!checkAnnouncementsValid()">Next</button>
|
|
</div>
|
|
<div id="player-teams" class="visible-{{this.currentPage === 2}}">
|
|
<p>Players: {{getPlayerNamesAsString()}}</p>
|
|
<p>Highest Announcements: {{getHighestAnnouncements()}}</p>
|
|
<p>Please select the elder(s):</p>
|
|
<div class="togglebtn elder-player-{{isPlayerElder(player)}}" *ngFor="let player of actualPlayers" (click)="toggleElderPlayer(player)">{{player.firstName}}</div>
|
|
<p id="team-warn" *ngIf="!checkValidTeamAssignment()">Illegal game teams!</p>
|
|
<button (click)="switchToNextPage()" [disabled]="!checkValidTeamAssignment()">Next</button>
|
|
</div>
|
|
<div id="player-card-scores" class="visible-{{this.currentPage === 3}}">
|
|
<p>Please enter the points that every player has collected:</p>
|
|
<table class="point-entry">
|
|
<tr *ngIf="this.actualPlayers[0]">
|
|
<td><p>{{this.actualPlayers[0].firstName}}</p></td>
|
|
<td><input type="number" [(ngModel)]="this.actualPlayers[0].finalCardScore" (change)="this.calculateCurrentScores()"/></td>
|
|
</tr>
|
|
<tr *ngIf="this.actualPlayers[1]">
|
|
<td><p>{{this.actualPlayers[1].firstName}}</p></td>
|
|
<td><input type="number" [(ngModel)]="this.actualPlayers[1].finalCardScore" (change)="this.calculateCurrentScores()"/></td>
|
|
</tr>
|
|
<tr *ngIf="this.actualPlayers[2]">
|
|
<td><p>{{this.actualPlayers[2].firstName}}</p></td>
|
|
<td><input type="number" [(ngModel)]="this.actualPlayers[2].finalCardScore" (change)="this.calculateCurrentScores()"/></td>
|
|
</tr>
|
|
<tr *ngIf="this.actualPlayers[3]">
|
|
<td><p>{{this.actualPlayers[3].firstName}}</p></td>
|
|
<td><input type="number" [(ngModel)]="this.actualPlayers[3].finalCardScore" (change)="this.calculateCurrentScores()"/></td>
|
|
</tr>
|
|
</table>
|
|
<p id="score-warn" *ngIf="calculatePointSum() !== 240">Total score doesn't add up ({{getScoreDifferenceText()}})</p>
|
|
<button (click)="switchToNextPage()" [disabled]="!calculatePointSum()">Next</button>
|
|
</div>
|
|
<div id="which-solo" class="visible-{{this.currentPage === 4}}">
|
|
<p>Select the Solo that has been played:</p>
|
|
<div class="togglebtn active-{{isSoloActive(solo)}}" *ngFor="let solo of getAllPossibleSolos()" (click)="toggleSolo(solo)">{{solo.toString()}}</div>
|
|
<p id="solo-warn" *ngIf="noSoloSelectedYet()">Please select a solo to continue</p>
|
|
<button (click)="switchToNextPage()" [disabled]="noSoloSelectedYet()">Next</button>
|
|
</div>
|
|
<div id="extra-points" class="visible-{{this.currentPage === 5}}">
|
|
<p>Extra Points</p>
|
|
<button (click)="switchToNextPage()">Next</button>
|
|
</div>
|
|
</div>
|
|
<div id="scores">
|
|
<p class="team-{{player.team}}" *ngFor="let player of actualPlayers">
|
|
{{player.firstName}}: {{player.gamePoints}}
|
|
</p>
|
|
</div>
|
|
</div>
|