simplify code for highscore and use icons in highscore
parent
e8ea7dc6a9
commit
819f8ee469
|
@ -1,4 +1,4 @@
|
||||||
"use strict";
|
'use strict';
|
||||||
|
|
||||||
// HTTP status codes by name
|
// HTTP status codes by name
|
||||||
const codes = require('./http-codes');
|
const codes = require('./http-codes');
|
||||||
|
|
|
@ -15,8 +15,9 @@
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div *ngFor="let attributeMap of playerAttributeDisplayNames.slice(2, playerAttributeDisplayNames.length)">
|
||||||
<ngx-datatable
|
<ngx-datatable
|
||||||
[rows]="players.kill"
|
[rows]="players[attributeMap.prop]"
|
||||||
[messages]="emptyMessage"
|
[messages]="emptyMessage"
|
||||||
[headerHeight]="cellHeight"
|
[headerHeight]="cellHeight"
|
||||||
[rowHeight]="cellHeight"
|
[rowHeight]="cellHeight"
|
||||||
|
@ -33,176 +34,23 @@
|
||||||
</span>
|
</span>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</ngx-datatable-column>
|
</ngx-datatable-column>
|
||||||
<ngx-datatable-column [width]="valueColWidth" name="Kills" prop="kill"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
|
||||||
|
|
||||||
<ngx-datatable
|
<ngx-datatable-column [width]="valueColWidth" prop="{{attributeMap.prop}}">
|
||||||
[rows]="players.friendlyFire"
|
<ng-template ngx-datatable-header-template let-sort="sortFn">
|
||||||
[messages]="emptyMessage"
|
<span class="datatable-header-cell-wrapper">
|
||||||
[headerHeight]="cellHeight"
|
<span class="datatable-header-cell-label text-truncate" title="{{attributeMap.head}}" (click)="sort()">
|
||||||
[rowHeight]="cellHeight"
|
<img src="../../../../assets/scoreboard/{{attributeMap.prop}}.png" alt="{{attributeMap.head}}">
|
||||||
[cssClasses]='customClasses'
|
</span>
|
||||||
[columnMode]="'force'"
|
</span>
|
||||||
[scrollbarV]="true"
|
</ng-template>
|
||||||
[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">
|
<ng-template ngx-datatable-cell-template let-row="row" let-value="value">
|
||||||
<span class="player-name"
|
<span style="padding-left: 7px;">
|
||||||
[style.color]="row['fraction'] === 'BLUFOR' ? fraction.COLOR_BLUFOR : fraction.COLOR_OPFOR">
|
|
||||||
{{value}}
|
{{value}}
|
||||||
</span>
|
</span>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</ngx-datatable-column>
|
</ngx-datatable-column>
|
||||||
<ngx-datatable-column [width]="valueColWidth" name="FriendlyFire" prop="friendlyFire"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
|
||||||
|
|
||||||
<ngx-datatable
|
|
||||||
[rows]="players.death"
|
|
||||||
[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" name="Tode" prop="death"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
|
||||||
|
|
||||||
<ngx-datatable
|
|
||||||
[rows]="players.respawn"
|
|
||||||
[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" name="Respawn" prop="respawn"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
|
||||||
|
|
||||||
<ngx-datatable
|
|
||||||
[rows]="players.revive"
|
|
||||||
[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" name="Revive" prop="revive"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
|
||||||
|
|
||||||
<ngx-datatable
|
|
||||||
[rows]="players.flagTouch"
|
|
||||||
[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" name="Eroberung" prop="flagTouch"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
|
||||||
|
|
||||||
<ngx-datatable
|
|
||||||
[rows]="players.vehicleLight"
|
|
||||||
[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" name="Fzg (Light)" prop="vehicleLight"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
|
||||||
|
|
||||||
<ngx-datatable
|
|
||||||
[rows]="players.vehicleHeavy"
|
|
||||||
[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" name="Fzg (Heavy)" prop="vehicleHeavy"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
|
||||||
|
|
||||||
<ngx-datatable
|
|
||||||
[rows]="players.vehicleAir"
|
|
||||||
[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" name="Fzg (Air)" prop="vehicleAir"></ngx-datatable-column>
|
|
||||||
</ngx-datatable>
|
</ngx-datatable>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -6,6 +6,7 @@ import {Fraction} from '../../../utils/fraction.enum';
|
||||||
import {FormControl} from '@angular/forms';
|
import {FormControl} from '@angular/forms';
|
||||||
import {Observable} from 'rxjs/Observable';
|
import {Observable} from 'rxjs/Observable';
|
||||||
import {Player} from '../../../models/model-interfaces';
|
import {Player} from '../../../models/model-interfaces';
|
||||||
|
import {PlayerUtils} from "../../../utils/player-utils";
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -27,13 +28,15 @@ export class StatisticHighScoreComponent implements OnInit {
|
||||||
|
|
||||||
playersStored = {};
|
playersStored = {};
|
||||||
|
|
||||||
|
playerAttributeDisplayNames = PlayerUtils.attributeDisplayNames;
|
||||||
|
|
||||||
cellHeight = 40;
|
cellHeight = 40;
|
||||||
|
|
||||||
numberColWidth = 60;
|
numberColWidth = 60;
|
||||||
|
|
||||||
nameColWidth = 210;
|
nameColWidth = 210;
|
||||||
|
|
||||||
valueColWidth = 110;
|
valueColWidth = 50;
|
||||||
|
|
||||||
emptyMessage = {emptyMessage: 'Keine Einträge'};
|
emptyMessage = {emptyMessage: 'Keine Einträge'};
|
||||||
|
|
||||||
|
|
|
@ -45,9 +45,9 @@ export class FractionStatsComponent implements OnInit, OnChanges {
|
||||||
|
|
||||||
labelPoints = 'Punkte';
|
labelPoints = 'Punkte';
|
||||||
labelBudget = 'Budget';
|
labelBudget = 'Budget';
|
||||||
labelKill = 'Kills';
|
labelKill = 'Abschüsse';
|
||||||
labelFriendlyFire = 'Friendly Fire';
|
labelFriendlyFire = 'Friendly Fire';
|
||||||
labelVehicle = 'Fahrzeug-Kills';
|
labelVehicle = 'Fahrzeug Abschüsse';
|
||||||
labelTransport = 'Lufttransport';
|
labelTransport = 'Lufttransport';
|
||||||
labelRevive = 'Revive';
|
labelRevive = 'Revive';
|
||||||
labelStabilize = 'Stabilisiert';
|
labelStabilize = 'Stabilisiert';
|
||||||
|
|
|
@ -19,13 +19,7 @@ export class ScoreboardComponent implements OnChanges {
|
||||||
|
|
||||||
@Output() playerTabSwitch = new EventEmitter();
|
@Output() playerTabSwitch = new EventEmitter();
|
||||||
|
|
||||||
tableHead = [
|
tableHead = PlayerUtils.attributeDisplayNames;
|
||||||
{prop: 'name', head: 'Spieler'}, {prop: 'fraction', head: 'Fraktion'}, {prop: 'kill', head: 'Abschüsse'},
|
|
||||||
{prop: 'friendlyFire', head: 'Friendly Fire'}, {prop: 'vehicleLight', head: 'Fahrzeug (leicht)'},
|
|
||||||
{prop: 'vehicleHeavy', head: 'Fahrzeug (schwer)'}, {prop: 'vehicleAir', head: 'Fahrzeug (Luft)'},
|
|
||||||
{prop: 'revive', head: 'Revive'}, {prop: 'flagTouch', head: 'Eroberungen'}, {prop: 'death', head: 'Tode'},
|
|
||||||
{prop: 'respawn', head: 'Respawn'}
|
|
||||||
];
|
|
||||||
|
|
||||||
isSteamUUID = PlayerUtils.isSteamUUID;
|
isSteamUUID = PlayerUtils.isSteamUUID;
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,13 @@
|
||||||
export class PlayerUtils {
|
export class PlayerUtils {
|
||||||
|
|
||||||
|
public static readonly attributeDisplayNames = [
|
||||||
|
{prop: 'name', head: 'Spieler'}, {prop: 'fraction', head: 'Fraktion'}, {prop: 'kill', head: 'Abschüsse'},
|
||||||
|
{prop: 'friendlyFire', head: 'Friendly Fire'}, {prop: 'vehicleLight', head: 'Fahrzeug (leicht)'},
|
||||||
|
{prop: 'vehicleHeavy', head: 'Fahrzeug (schwer)'}, {prop: 'vehicleAir', head: 'Fahrzeug (Luft)'},
|
||||||
|
{prop: 'revive', head: 'Revive'}, {prop: 'flagTouch', head: 'Eroberungen'}, {prop: 'death', head: 'Tode'},
|
||||||
|
{prop: 'respawn', head: 'Respawn'}
|
||||||
|
];
|
||||||
|
|
||||||
public static isSteamUUID(input: string): boolean {
|
public static isSteamUUID(input: string): boolean {
|
||||||
const steamUIDPattern = new RegExp('[0-9]{17}');
|
const steamUIDPattern = new RegExp('[0-9]{17}');
|
||||||
return steamUIDPattern.test(input);
|
return steamUIDPattern.test(input);
|
||||||
|
|
Loading…
Reference in New Issue