91 lines
3.6 KiB
HTML
91 lines
3.6 KiB
HTML
<div class="highscore-container fade-in">
|
|
<h2>{{title}} ⟶ Highscore</h2>
|
|
|
|
<div class="input-group search-field">
|
|
<input id="search-tasks"
|
|
markForCheck
|
|
placeholder="Spielername (mehrere mit '&' trennen)"
|
|
type="text" #query class="form-control"
|
|
(keyup.enter)="filterPlayers()"
|
|
[formControl]="searchTerm">
|
|
<span class="input-group-btn">
|
|
<button class="btn btn-default" type="button"
|
|
(click)="filterPlayers()">
|
|
Filter
|
|
</button>
|
|
</span>
|
|
</div>
|
|
|
|
<div *ngFor="let attributeMap of playerAttributeDisplayNames">
|
|
<div class="highscore-table-container">
|
|
<table mat-table matSort
|
|
[dataSource]="players[attributeMap.prop]"
|
|
class="mat-elevation-z8 highscore-table">
|
|
|
|
<ng-container matColumnDef="num">
|
|
<th mat-header-cell *matHeaderCellDef>#</th>
|
|
<td mat-cell *matCellDef="let element">{{element.num}}</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="name">
|
|
<th mat-header-cell *matHeaderCellDef>Name</th>
|
|
<td mat-cell *matCellDef="let element"
|
|
[style.color]="element['fraction'] === 'BLUFOR' ? fraction.COLOR_BLUFOR : fraction.COLOR_OPFOR">
|
|
{{element.name}}
|
|
</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="{{attributeMap.prop}}">
|
|
<th mat-header-cell *matHeaderCellDef>
|
|
<img src="../../../../assets/scoreboard/{{attributeMap.prop}}.png"
|
|
matTooltip="{{attributeMap.head}}"
|
|
alt="{{attributeMap.head}}">
|
|
</th>
|
|
<td mat-cell *matCellDef="let element"> {{element[attributeMap.prop]}}</td>
|
|
</ng-container>
|
|
|
|
<tr mat-header-row *matHeaderRowDef="['num', 'name', attributeMap.prop];"></tr>
|
|
<tr mat-row *matRowDef="let row; columns: ['num', 'name', attributeMap.prop];"></tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!--<ngx-datatable-->
|
|
<!--[rows]="players[attributeMap.prop]"-->
|
|
<!--[messages]="emptyMessage"-->
|
|
<!--[headerHeight]="cellHeight"-->
|
|
<!--[rowHeight]="cellHeight"-->
|
|
<!--[cssClasses]='customClasses'-->
|
|
<!--[columnMode]="'force'"-->
|
|
<!--[scrollbarV]="true"-->
|
|
<!--[selectionType]="'single'">-->
|
|
<!--<ngx-datatable-column [width]="numberColWidth" name="#" prop="num"></ngx-datatable-column>-->
|
|
<!--<ngx-datatable-column name="Spieler" prop="name" [width]="nameColWidth" style="padding-left:10px">-->
|
|
<!--<ng-template ngx-datatable-cell-template let-row="row" let-value="value">-->
|
|
<!--<span class="player-name"-->
|
|
<!--[style.color]="row['fraction'] === 'BLUFOR' ? fraction.COLOR_BLUFOR : fraction.COLOR_OPFOR">-->
|
|
<!--{{value}}-->
|
|
<!--</span>-->
|
|
<!--</ng-template>-->
|
|
<!--</ngx-datatable-column>-->
|
|
|
|
<!--<ngx-datatable-column [width]="valueColWidth" prop="{{attributeMap.prop}}">-->
|
|
<!--<ng-template ngx-datatable-header-template let-sort="sortFn">-->
|
|
<!--<span class="datatable-header-cell-wrapper">-->
|
|
<!--<span class="datatable-header-cell-label text-truncate" matTooltip="{{attributeMap.head}}" (click)="sort()">-->
|
|
<!--<img src="../../../../assets/scoreboard/{{attributeMap.prop}}.png" alt="{{attributeMap.head}}">-->
|
|
<!--</span>-->
|
|
<!--</span>-->
|
|
<!--</ng-template>-->
|
|
<!--<ng-template ngx-datatable-cell-template let-row="row" let-value="value">-->
|
|
<!--<span style="padding-left: 7px;">-->
|
|
<!--{{value}}-->
|
|
<!--</span>-->
|
|
<!--</ng-template>-->
|
|
<!--</ngx-datatable-column>-->
|
|
<!--</ngx-datatable>-->
|
|
<!--</div>-->
|
|
|
|
</div>
|
|
|