Always show substitutes if applicable

src/app/components/match-result/match-result.component.html

@@ -19,7 +19,12 @@
 
     <mat-grid-tile colspan="2">
       <div class="w-100" [ngClass]="{'winner': validateResult() == 1}">
-        {{ data.match.team1 | teamText }}
+        <app-team-display
+          [team]="data.match.team1"
+          [event]="data.event"
+          [tournament]="data.tournament"
+          [inline]="true">
+        </app-team-display>
       </div>
     </mat-grid-tile>
 
@@ -41,7 +46,12 @@
 
     <mat-grid-tile colspan="2">
       <div class="w-100" [ngClass]="{'winner': validateResult() == -1}">
-        {{ data.match.team2 | teamText }}
+        <app-team-display
+          [team]="data.match.team2"
+          [event]="data.event"
+          [tournament]="data.tournament"
+          [inline]="true">
+        </app-team-display>
       </div>
     </mat-grid-tile>
     <mat-grid-tile>

src/app/components/match-result/match-result.component.ts

@@ -19,6 +19,9 @@ import {MatGridList, MatGridTile} from "@angular/material/grid-list";
 import {Round} from "../../model/round";
 import {Group} from "../../model/group";
 import {Game} from "../../model/game";
+import {TeamDisplayComponent} from "../team-display/team-display.component";
+import {Event} from "../../model/event";
+import {Tournament} from "../../model/tournament";
 
 @Component({
   selector: 'app-match-result',
@@ -28,14 +31,14 @@ import {Game} from "../../model/game";
     MatButton,
     MatDialogClose,
     MatDialogTitle,
-    TeamPipe,
     MatInput,
     ReactiveFormsModule,
     FormsModule,
     MatFormField,
     MatGridList,
     MatGridTile,
-    NgClass
+    NgClass,
+    TeamDisplayComponent
   ],
   providers: [
     FullNamePipe,
@@ -49,7 +52,7 @@ export class MatchResultComponent {
 
   result: Result = new Result();
 
-  constructor(@Inject(MAT_DIALOG_DATA) public data: {match: Match, group: Group, round: Round}) {
+  constructor(@Inject(MAT_DIALOG_DATA) public data: {match: Match, tournament: Tournament, event: Event, group: Group, round: Round}) {
     this.result.matchId = this.data.match.id;
 
     if (data.match.games.length == 0) {

src/app/components/match-sheets/match-sheets.component.html

@@ -8,7 +8,14 @@
         <br>
         <div class="row">
           <div class="col-6">
-            <b>{{ match.team1 | teamText }}</b>
+            <b>
+              <app-team-display
+                [team]="match.team1"
+                [event]="this.event"
+                [tournament]="this.tournament"
+                [inline]="true">
+              </app-team-display>
+            </b>
           </div>
           <div class="col-2">
             <mat-form-field appearance="outline">
@@ -28,7 +35,12 @@
         </div>
         <div class="row">
           <div class="col-6">
-            <b>{{ match.team2 | teamText }}</b>
+            <app-team-display
+              [team]="match.team2"
+              [event]="this.event"
+              [tournament]="this.tournament"
+              [inline]="true">
+            </app-team-display>
           </div>
           <div class="col-2">
             <mat-form-field appearance="outline">

src/app/components/match-sheets/match-sheets.component.ts

@@ -11,16 +11,18 @@ import {MatFormField} from "@angular/material/form-field";
 import {MatInput} from "@angular/material/input";
 import {ReactiveFormsModule} from "@angular/forms";
 import {HeaderService} from "../../service/header.service";
+import {TeamDisplayComponent} from "../team-display/team-display.component";
+import {Event} from "../../model/event";
 
 @Component({
   selector: 'app-match-sheets',
   imports: [
     MatCard,
     MatCardContent,
-    TeamPipe,
     MatFormField,
     MatInput,
-    ReactiveFormsModule
+    ReactiveFormsModule,
+    TeamDisplayComponent
   ],
   providers: [
     TeamPipe,
@@ -33,6 +35,7 @@ import {HeaderService} from "../../service/header.service";
 export class MatchSheetsComponent implements OnInit, OnDestroy {
 
   tournament: Tournament;
+  event: Event;
   group: Group;
   round: Round;
 
@@ -54,6 +57,7 @@ export class MatchSheetsComponent implements OnInit, OnDestroy {
         for (let group of event.groups) {
           for (let round of group.rounds) {
             if (round.id == roundId) {
+              this.event = event;
               this.group = group;
               this.round = round;
               this.headerService.setTitle(`Wedstrijdbriefjes ${this.group.name} ${this.round.name}`);

src/app/components/player-display/player-display.component.ts

@@ -14,9 +14,7 @@ import {MatTooltip} from '@angular/material/tooltip';
     @let substitute = getSubstituteForEvent(player, event);
     <span [class.has-substitute]="substitute"
           [matTooltip]="substitute ? 'Valt in voor ' + (player | fullName) : ''"
-          matTooltipPosition="below">
+          matTooltipPosition="below">{{ substitute || (player | fullName) }}</span>
-      {{ substitute || (player | fullName) }}
-    </span>
   `
 })
 export class PlayerDisplayComponent {

src/app/components/round-overview/round-overview.component.html

@@ -5,9 +5,23 @@
       <tbody>
         @for (match of round.matches; track match.id) {
           <tr>
-            <td class="align-middle" style="width: 45%;">{{ match.team1 | teamText }}</td>
+            <td class="align-middle" style="width: 45%;">
+              <app-team-display
+                [team]="match.team1"
+                [event]="this.event"
+                [tournament]="this.tournament"
+                [inline]="false">
+              </app-team-display>
+            </td>
             <td class="align-middle w-sep">-</td>
-            <td class="align-middle" style="width: 45%;">{{ match.team2 | teamText }}</td>
+            <td class="align-middle" style="width: 45%;">
+              <app-team-display
+                [team]="match.team2"
+                [event]="this.event"
+                [tournament]="this.tournament"
+                [inline]="true">
+              </app-team-display>
+            </td>
             <td class="align-middle w-sep"></td>
           </tr>
         }
@@ -24,18 +38,20 @@
         @for (match of round.matches; track match.id) {
           <tr>
             <td class="align-middle" style="width: 30%;">
-              @if (event.doublesEvent) {
+              <app-team-display
-                {{ match.team1.player1 | fullName }} /<br>{{ match.team1.player2 | fullName }}
+                [team]="match.team1"
-              } @else {
+                [event]="this.event"
-                {{ match.team1.player1 | fullName }}
+                [tournament]="this.tournament"
-              }
+                [inline]="true">
+              </app-team-display>
             <td class="align-middle w-sep">-</td>
             <td class="align-middle" style="width: 30%;">
-              @if (event.doublesEvent) {
+              <app-team-display
-                {{ match.team2.player1 | fullName }} /<br>{{ match.team2.player2 | fullName }}
+                [team]="match.team2"
-              } @else {
+                [event]="this.event"
-                {{ match.team2.player1 | fullName }}
+                [tournament]="this.tournament"
-              }
+                [inline]="true">
+              </app-team-display>
             </td>
             <td class="align-middle" style="width: 35%;">
               <div class="row result align-items-center">
@@ -87,7 +103,14 @@
         @for (entry of round.standings.entries; track entry.position) {
           <tr>
             <td class="align-middle">{{ entry.position }}</td>
-            <td class="align-middle">{{ entry.team | teamText }}</td>
+            <td class="align-middle">
+              <app-team-display
+                [team]="entry.team"
+                [event]="this.event"
+                [tournament]="this.tournament"
+                [inline]="true">
+              </app-team-display>
+            </td>
             <td class="align-middle">{{ entry.played }}</td>
             <td class="align-middle">{{ entry.points / entry.played | number: '1.0-2' }}</td>
             <td class="align-middle">{{ (entry.gamesWon - entry.gamesLost) / entry.played | number: '1.0-2' }}</td>

src/app/components/round-overview/round-overview.component.ts

@@ -8,13 +8,14 @@ import {ActivatedRoute, Router} from "@angular/router";
 import {DecimalPipe} from "@angular/common";
 import {TeamPipe} from "../../pipes/team-pipe";
 import {FullNamePipe} from "../../pipes/fullname-pipe";
+import {TeamDisplayComponent} from "../team-display/team-display.component";
 
 @Component({
   selector: 'app-round-overview',
   imports: [
     TeamPipe,
     DecimalPipe,
-    FullNamePipe
+    TeamDisplayComponent
   ],
   providers: [
     TeamPipe,

src/app/components/tournament-manage/tournament-manage.component.html

@@ -157,7 +157,7 @@
                       <div class="col-md-2">Duur: {{ getDuration(activeMatch.match.startTime) | date: 'mm:ss' }}</div>
                     </div>
                     <mat-action-row>
-                      <button class="align-baseline" mat-button (click)="editResult(activeMatch.match, activeMatch.group, activeMatch.round)">
+                      <button class="align-baseline" mat-button (click)="editResult(activeMatch.match, activeMatch.event, activeMatch.group, activeMatch.round)">
                         <mat-icon>edit</mat-icon>
                         Uitslag invoeren
                       </button>
@@ -325,7 +325,7 @@
                                           Wedstrijd starten
                                         </button>
                                       } @else if (match.status == 'IN_PROGRESS') {
-                                        <button mat-button (click)="editResult(match, group, round)">
+                                        <button mat-button (click)="editResult(match, event, group, round)">
                                           <mat-icon>edit</mat-icon>
                                           Uitslag invoeren
                                         </button>
@@ -346,7 +346,7 @@
                                             <mat-icon>more_vert</mat-icon>
                                           </button>
                                           <mat-menu #finishedMatchMenu="matMenu">
-                                            <button mat-menu-item (click)="editResult(match, group, round)">
+                                            <button mat-menu-item (click)="editResult(match, event, group, round)">
                                               <mat-icon>edit</mat-icon>
                                               Uitslag bewerken
                                             </button>

src/app/components/tournament-manage/tournament-manage.component.ts

@@ -368,9 +368,9 @@ export class TournamentManageComponent implements OnInit, OnDestroy {
   matchResultDialog = inject(MatDialog);
   courtSelectionDialog = inject(MatDialog);
 
-  editResult(match: Match, group: Group, round: Round) {
+  editResult(match: Match, event: Event, group: Group, round: Round) {
     this.matchResultDialog.open(MatchResultComponent, {
-      data: {match: match, group: group, round: round},
+      data: {match: match, tournament: this.tournament, event: event, group: group, round: round},
       minWidth: '800px'
     }).afterClosed().subscribe(result => {
       if (result != undefined) {