hardi
/
opt-cc
1
0
Fork 0
Code Pull Requests Releases 47 Activity

Use fraction Enum for war detail

pull/18/head
HardiReady 2017-11-08 14:37:13 +01:00
parent 89aa585b21
commit 3330eaa87f
3 changed files with 29 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
static/src/app/statistic/war-detail/war-detail.component.css
View File

@ -34,14 +34,6 @@
font-weight: bold; font-weight: bold;
} }
.text-opfor {
color: firebrick;
}
.text-blufor {
color: blue;
}
/* ########### TABS ########### */ /* ########### TABS ########### */
:host /deep/ .nav-tabs { :host /deep/ .nav-tabs {

52
static/src/app/statistic/war-detail/war-detail.component.html
View File

@ -5,16 +5,16 @@
<h2>{{war.title}} - vom {{war.date | date: 'dd.MM.yyyy'}}</h2> <h2>{{war.title}} - vom {{war.date | date: 'dd.MM.yyyy'}}</h2>
<div class="pull-left head-field" style="width: 250px"> <div class="pull-left head-field" style="width: 250px">
<h4>Endpunktestand:</h4> <h4>Endpunktestand:</h4>
<span class="text-blufor" style="font-weight: bold; margin-right: 10px">{{BLUFOR}} {{war.ptBlufor}}</span> <span [style.color]="fraction.COLOR_BLUFOR" style="font-weight: bold; margin-right: 10px">{{fraction.BLUFOR}} {{war.ptBlufor}}</span>
<span style="font-size: x-large">|</span> <span style="font-size: x-large">|</span>
<span class="text-opfor" style="font-weight: bold; margin-left: 10px;">{{war.ptOpfor}} {{OPFOR}}</span> <span [style.color]="fraction.COLOR_OPFOR" style="font-weight: bold; margin-left: 10px;">{{war.ptOpfor}} {{fraction.OPFOR}}</span>
</div> </div>
<div class="pull-left head-field " style="padding-left: 140px;"> <div class="pull-left head-field " style="padding-left: 140px;">
<h4 style="margin-bottom: 0;">Teilnehmer:</h4> <h4 style="margin-bottom: 0;">Teilnehmer:</h4>
<ngx-charts-pie-chart <ngx-charts-pie-chart
[view]="[120, 120]" [view]="[120, 120]"
[scheme]="{domain: ['#B22222', '#0000FF']}" [scheme]="{domain: [fraction.COLOR_OPFOR, fraction.COLOR_BLUFOR]}"
[results]="playerChart" [results]="playerChart"
[legend]="false" [legend]="false"
[explodeSlices]="false" [explodeSlices]="false"
@ -40,13 +40,13 @@
<input type="radio" name="fractSelect" value="BLUFOR" <input type="radio" name="fractSelect" value="BLUFOR"
[(ngModel)]="fractionRadioSelect" [(ngModel)]="fractionRadioSelect"
#fractRadioBufor #fractRadioBufor
(change)="filterPlayersByFraction(fractRadioBufor.value)">{{BLUFOR}} (change)="filterPlayersByFraction(fractRadioBufor.value)">{{fraction.BLUFOR}}
</label> </label>
<label class="radio-inline"> <label class="radio-inline">
<input type="radio" name="fractSelect" value="OPFOR" <input type="radio" name="fractSelect" value="OPFOR"
[(ngModel)]="fractionRadioSelect" [(ngModel)]="fractionRadioSelect"
#fractRadioOpfor #fractRadioOpfor
(change)="filterPlayersByFraction(fractRadioOpfor.value)">{{OPFOR}} (change)="filterPlayersByFraction(fractRadioOpfor.value)">{{fraction.OPFOR}}
</label> </label>
<br> <br>
</form> </form>
@ -73,14 +73,14 @@
<ngx-datatable-column name="Spieler" prop="name" [width]="210" style="padding-left:10px"> <ngx-datatable-column name="Spieler" prop="name" [width]="210" 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 class="player-name"
[ngClass]="row['fraction'] === 'BLUFOR' ? 'text-blufor' : 'text-opfor'"> [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 name="Fraktion" prop="fraction" [width]="100"> <ngx-datatable-column name="Fraktion" prop="fraction" [width]="100">
<ng-template ngx-datatable-cell-template let-value="value"> <ng-template ngx-datatable-cell-template let-value="value">
{{value === 'BLUFOR' ? BLUFOR : OPFOR}} {{value === 'BLUFOR' ? fraction.BLUFOR : fraction.OPFOR}}
</ng-template> </ng-template>
</ngx-datatable-column> </ngx-datatable-column>
<ngx-datatable-column [width]="90" name="Kills" prop="kill"></ngx-datatable-column> <ngx-datatable-column [width]="90" name="Kills" prop="kill"></ngx-datatable-column>
@ -98,35 +98,37 @@
</ng-template> </ng-template>
<!--<div class="btn-group" style="position: absolute; margin-left: 5%;" dropdown>--> <!--<div class="btn-group" style="position: absolute; margin-left: 5%;" dropdown>-->
<!--<button dropdownToggle type="button" class="btn btn-default dropdown-toggle dropdown-toggle-split">--> <!--<button dropdownToggle type="button" class="btn btn-default dropdown-toggle dropdown-toggle-split">-->
<!--{{dataMode}} <span class="caret"></span>--> <!--{{dataMode}} <span class="caret"></span>-->
<!--</button>--> <!--</button>-->
<!--<ul *dropdownMenu class="dropdown-menu" role="menu">--> <!--<ul *dropdownMenu class="dropdown-menu" role="menu">-->
<!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(0, 'Summe')">Summe</a></li>--> <!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(0, 'Summe')">Summe</a></li>-->
<!--<li class="divider dropdown-divider"></li>--> <!--<li class="divider dropdown-divider"></li>-->
<!--<li class="disabled" role="menuitem">--> <!--<li class="disabled" role="menuitem">-->
<!--<a class="dropdown-item" style="cursor: default!important;">Interval:</a>--> <!--<a class="dropdown-item" style="cursor: default!important;">Interval:</a>-->
<!--</li>--> <!--</li>-->
<!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(1, '1 Minute')">1 Minute</a></li>--> <!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(1, '1 Minute')">1 Minute</a></li>-->
<!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(5, '5 Minuten')">5 Minuten</a></li>--> <!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(5, '5 Minuten')">5 Minuten</a></li>-->
<!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(10, '10 Minuten')">10 Minuten</a>--> <!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(10, '10 Minuten')">10 Minuten</a>-->
<!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(20, '20 Minuten')">20 Minuten</a>--> <!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(20, '20 Minuten')">20 Minuten</a>-->
<!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(40, '40 Minuten')">40 Minuten</a>--> <!--<li role="menuitem"><a class="dropdown-item" (click)="toggleDataMode(40, '40 Minuten')">40 Minuten</a>-->
<!--</li>--> <!--</li>-->
<!--</ul>--> <!--</ul>-->
<!--</div>--> <!--</div>-->
<div class="chart-select-group btn-group" (click)="selectChart()"> <div class="chart-select-group btn-group" (click)="selectChart()">
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelPoints}}">{{labelPoints}}</label> <label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelPoints}}">{{labelPoints}}</label>
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelBudget}}">{{labelBudget}}</label> <label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelBudget}}">{{labelBudget}}</label>
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelKill}}">{{labelKill}}</label> <label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel"
btnRadio="{{labelKill}}">{{labelKill}}</label>
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelFriendlyFire}}">{{labelFriendlyFire}}</label> <label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelFriendlyFire}}">{{labelFriendlyFire}}</label>
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelRevive}}">{{labelRevive}}</label> <label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelRevive}}">{{labelRevive}}</label>
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" <label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel"
btnRadio="{{labelStabilize}}">{{labelStabilize}}</label> btnRadio="{{labelStabilize}}">{{labelStabilize}}</label>
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" <label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel"
btnRadio="{{labelTransport}}">{{labelTransport}}</label> btnRadio="{{labelTransport}}">{{labelTransport}}</label>
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelFlag}}">{{labelFlag}}</label> <label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel"
btnRadio="{{labelFlag}}">{{labelFlag}}</label>
</div> </div>
<div *ngIf="showLineChart" class="chart-container"> <div *ngIf="showLineChart" class="chart-container">

6
static/src/app/statistic/war-detail/war-detail.component.ts
View File

@ -17,9 +17,7 @@ import {Fraction} from "../../utils/fraction.enum";
}) })
export class WarDetailComponent { export class WarDetailComponent {
BLUFOR: string = Fraction.BLUFOR; readonly fraction = Fraction;
OPFOR: string = Fraction.OPFOR;
@ViewChild('overview') private overviewContainer: ElementRef; @ViewChild('overview') private overviewContainer: ElementRef;
@ -103,7 +101,7 @@ export class WarDetailComponent {
.subscribe(war => { .subscribe(war => {
this.war = war; this.war = war;
this.rows = war.players; this.rows = war.players;
this.playerChart = ChartUtils.getSingleDataArray(this.OPFOR, war.playersOpfor, this.BLUFOR, war.playersBlufor); this.playerChart = ChartUtils.getSingleDataArray(Fraction.OPFOR, war.playersOpfor, Fraction.BLUFOR, war.playersBlufor);
this.initialized = { this.initialized = {
basic: false, basic: false,