Add fraction mapping resolve in stats pages

release/v1.9.6
HardiReady 2019-10-10 20:17:00 +02:00
parent 12ca58d43e
commit 55c59612a6
13 changed files with 197 additions and 42 deletions

View File

@ -1,6 +1,6 @@
{
"name": "opt-cc",
"version": "1.9.5",
"version": "1.9.6",
"author": "Florian Hartwich <hardi@noarch.de>",
"private": true,
"scripts": {

View File

@ -19,8 +19,8 @@
[(ngModel)]="decoration.fraction">
<option value="{{fraction.ARF}}">{{fraction.ARF}}</option>
<option value="{{fraction.SWORD}}">{{fraction.SWORD}}</option>
<option value="{{fraction.OPFOR}}">{{fraction.OPFOR}}</option>
<option value="{{fraction.BLUFOR}}">{{fraction.BLUFOR}}</option>
<option value="OPFOR">{{fraction.OPFOR}}</option>
<option value="BLUFOR">{{fraction.BLUFOR}}</option>
<option value="GLOBAL">{{'decorations.submit.field.fraction.global' | translate}}</option>
</select>
<show-error displayName="{{'decorations.submit.field.fraction' | translate}}" controlPath="fraction"></show-error>

View File

@ -1,4 +1,5 @@
import {Observable} from 'rxjs';
import {Fraction} from '../utils/fraction.enum';
export interface AppUser {
_id?: string;
@ -59,6 +60,8 @@ export interface War {
endDate?: string;
ptBlufor?: number;
ptOpfor?: number;
fractionMappingBlufor?: Fraction.SWORD | Fraction.ARF | "BLUFOR" | "OPFOR";
fractionMappingOpfor?: Fraction.SWORD | Fraction.ARF | "BLUFOR" | "OPFOR";
playersBlufor?: number;
playersOpfor?: number;
budgetBlufor?: number;

View File

@ -3,6 +3,7 @@ import {ChartUtils} from '../../../utils/chart-utils';
import {Fraction} from '../../../utils/fraction.enum';
import {War} from '../../../models/model-interfaces';
import {TranslateService} from '@ngx-translate/core';
import {FractionHelpers} from '../../../utils/global.helpers';
@Component({
@ -12,8 +13,6 @@ import {TranslateService} from '@ngx-translate/core';
})
export class FractionStatsComponent implements OnInit, OnChanges {
readonly fraction = Fraction;
@ViewChild('overview') private overviewContainer: ElementRef;
@Input() war: War;
@ -41,10 +40,9 @@ export class FractionStatsComponent implements OnInit, OnChanges {
tmpStabilizeData;
tmpPlayerCountData;
colorScheme = {
domain: [Fraction.COLOR_BLUFOR, Fraction.COLOR_OPFOR, Fraction.COLOR_BLUFOR_LIGHT, Fraction.COLOR_OPFOR_LIGHT,
Fraction.COLOR_BLUFOR_DARK, Fraction.COLOR_OPFOR_DARK, Fraction.COLOR_BLUFOR_GREY, Fraction.COLOR_OPFOR_GREY]
};
colorScheme;
fractionNameBlufor;
fractionNameOpfor;
labels;
labelsKeys;
@ -77,6 +75,21 @@ export class FractionStatsComponent implements OnInit, OnChanges {
ngOnChanges(changes: SimpleChanges) {
if (changes.war || changes.logData) {
this.fractionNameBlufor = FractionHelpers.getFractionName(this.war, "BLUFOR");
this.fractionNameOpfor = FractionHelpers.getFractionName(this.war, "OPFOR");
this.colorScheme = {
domain: [
FractionHelpers.getFractionColor(this.war, "BLUFOR"),
FractionHelpers.getFractionColor(this.war, "OPFOR"),
FractionHelpers.getFractionColor(this.war, "BLUFOR", 'LIGHT'),
FractionHelpers.getFractionColor(this.war, "OPFOR", 'LIGHT'),
FractionHelpers.getFractionColor(this.war, "BLUFOR", 'DARK'),
FractionHelpers.getFractionColor(this.war, "OPFOR", 'DARK'),
FractionHelpers.getFractionColor(this.war, "BLUFOR", 'GREY'),
FractionHelpers.getFractionColor(this.war, "OPFOR", 'GREY'),
]
};
this.initialized = {
budget: false,
kill: false,
@ -433,7 +446,7 @@ export class FractionStatsComponent implements OnInit, OnChanges {
name: t,
series: [
{
name: Fraction.BLUFOR,
name: this.fractionNameBlufor,
value: flagStatusMap.blufor[lastExistingIdx] ? 1 : 0
}
]
@ -442,7 +455,7 @@ export class FractionStatsComponent implements OnInit, OnChanges {
name: t,
series: [
{
name: Fraction.OPFOR,
name: this.fractionNameOpfor,
value: flagStatusMap.opfor[lastExistingIdx] ? -1 : 0
}
]
@ -453,17 +466,17 @@ export class FractionStatsComponent implements OnInit, OnChanges {
}
initializeTempCollections() {
this.tmpPointData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpBudgetData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpKillData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpFrienlyFireData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpVehicleData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR,
Fraction.BLUFOR.concat(' Leicht'), Fraction.OPFOR.concat(' Leicht'), Fraction.BLUFOR.concat(' Schwer'),
Fraction.OPFOR.concat(' Schwer'), Fraction.BLUFOR.concat(' Luft'), Fraction.OPFOR.concat(' Luft'));
this.tmpTransportData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpReviveData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpStabilizeData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpPlayerCountData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
this.tmpPointData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor);
this.tmpBudgetData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor);
this.tmpKillData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor);
this.tmpFrienlyFireData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor);
this.tmpVehicleData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor,
this.fractionNameBlufor.concat(' Leicht'), this.fractionNameOpfor.concat(' Leicht'), this.fractionNameBlufor.concat(' Schwer'),
this.fractionNameOpfor.concat(' Schwer'), this.fractionNameBlufor.concat(' Luft'), this.fractionNameOpfor.concat(' Luft'));
this.tmpTransportData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor);
this.tmpReviveData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor);
this.tmpStabilizeData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor);
this.tmpPlayerCountData = ChartUtils.getMultiDataArray(this.fractionNameBlufor, this.fractionNameOpfor);
[this.tmpKillData, this.tmpFrienlyFireData, this.tmpVehicleData, this.tmpReviveData, this.tmpStabilizeData,
this.tmpTransportData].forEach(tmp => {
@ -509,10 +522,10 @@ export class FractionStatsComponent implements OnInit, OnChanges {
axisFormatY(val) {
if (val === 1) {
return Fraction.BLUFOR;
return this.fractionNameBlufor;
}
if (val === -1) {
return Fraction.OPFOR;
return this.fractionNameOpfor;
}
return '';
}

View File

@ -8,7 +8,7 @@
<mat-header-cell *matHeaderCellDef
mat-sort-header="{{tableHead[0].prop}}">{{tableHead[0].head | translate}}</mat-header-cell>
<mat-cell *matCellDef="let element"
[style.color]="element['fraction'] === 'BLUFOR' ? fraction.COLOR_BLUFOR : fraction.COLOR_OPFOR">
[style.color]="fractionHelpers.getFractionColor(war, element['fraction'])">
{{element.name}}
</mat-cell>
</ng-container>
@ -16,7 +16,7 @@
<ng-container matColumnDef="{{tableHead[1].prop}}">
<mat-header-cell *matHeaderCellDef
mat-sort-header="{{tableHead[1].prop}}">{{tableHead[1].head | translate}}</mat-header-cell>
<mat-cell *matCellDef="let element">{{element.fraction === 'BLUFOR' ? fraction.BLUFOR : fraction.OPFOR}}</mat-cell>
<mat-cell *matCellDef="let element">{{fractionHelpers.getFractionName(war, element.fraction)}}</mat-cell>
</ng-container>
<ng-container *ngFor="let column of tableHead.slice(2, tableHead.length)" matColumnDef="{{column.prop}}">

View File

@ -6,6 +6,7 @@ import {saveAs} from 'file-saver/FileSaver';
import {MatSort} from '@angular/material';
import {SortUtils} from '../../../utils/sort-utils';
import {TranslateService} from '@ngx-translate/core';
import {FractionHelpers} from '../../../utils/global.helpers';
@Component({
selector: 'cc-scoreboard',
@ -16,6 +17,8 @@ export class ScoreboardComponent implements OnChanges {
readonly fraction = Fraction;
readonly fractionHelpers = FractionHelpers;
@Input() war: War;
@Input() fractionFilterSelected: string;

View File

@ -2,20 +2,28 @@
<div class="war-header-container">
<div class="pull-left head-field">
<h4>{{'stats.scoreboard.standings' | translate}}</h4>
<span [style.color]="fraction.COLOR_BLUFOR"
style="font-weight: bold; margin-right: 10px">{{fraction.BLUFOR}} {{war.ptBlufor}}</span>
<span [style.color]="fractionHelpers.getFractionColor(war, 'BLUFOR')"
style="font-weight: bold; margin-right: 10px">
{{fractionHelpers.getFractionName(war, 'BLUFOR')}} {{war.ptBlufor}}
</span>
<span style="font-size: x-large">|</span>
<span [style.color]="fraction.COLOR_OPFOR"
style="font-weight: bold; margin-left: 10px;">{{war.ptOpfor}} {{fraction.OPFOR}}</span>
<span [style.color]="fractionHelpers.getFractionColor(war, 'OPFOR')"
style="font-weight: bold; margin-left: 10px;">
{{war.ptOpfor}} {{fractionHelpers.getFractionName(war, 'OPFOR')}}
</span>
</div>
<div class="pull-left head-field" style="margin-top:0" *ngIf="isSmallLayout">
<h4>{{'stats.scoreboard.participants' | translate}}</h4>
<span [style.color]="fraction.COLOR_BLUFOR"
style="font-weight: bold; margin-right: 10px">{{fraction.BLUFOR}} {{war.playersBlufor}}</span>
<span [style.color]="fractionHelpers.getFractionColor(war, 'BLUFOR')"
style="font-weight: bold; margin-right: 10px">
{{fractionHelpers.getFractionName(war, 'BLUFOR')}} {{war.playersBlufor}}
</span>
<span style="font-size: 13px;font-weight: bold;">vs</span>
<span [style.color]="fraction.COLOR_OPFOR"
style="font-weight: bold; margin-left: 10px;">{{war.playersOpfor}} {{fraction.OPFOR}}</span>
<span [style.color]="fractionHelpers.getFractionColor(war, 'OPFOR')"
style="font-weight: bold; margin-left: 10px;">
{{war.playersOpfor}} {{fractionHelpers.getFractionName(war, 'OPFOR')}}
</span>
</div>
<div class="pull-left head-field-pie-chart" *ngIf="!isSmallLayout">

View File

@ -8,6 +8,7 @@ import {LogsService} from '../../../services/logs/logs.service';
import {ScoreboardComponent} from '../scoreboard/scoreboard.component';
import {BaseConfig} from '../../../app.config';
import {Observable} from 'rxjs';
import {FractionHelpers} from '../../../utils/global.helpers';
@Component({
@ -19,6 +20,8 @@ export class WarHeaderComponent implements OnInit {
readonly fraction = Fraction;
readonly fractionHelpers = FractionHelpers;
war: War;
@ViewChild('scoreboard') scoreBoardComponent: ScoreboardComponent;
@ -43,9 +46,7 @@ export class WarHeaderComponent implements OnInit {
playerChart: any[] = [];
colorScheme = {
domain: [Fraction.COLOR_OPFOR, Fraction.COLOR_BLUFOR]
};
colorScheme;
constructor(private route: ActivatedRoute,
private warService: WarService,
@ -64,8 +65,18 @@ export class WarHeaderComponent implements OnInit {
this.fractionStatsInitialized = false;
this.fractionFilterSelected = undefined;
this.colorScheme = {
domain: [
FractionHelpers.getFractionColor(war, 'OPFOR'),
FractionHelpers.getFractionColor(war, 'BLUFOR')
]
};
this.playerChart =
ChartUtils.getSingleDataArray(Fraction.OPFOR, war.playersOpfor, Fraction.BLUFOR, war.playersBlufor);
ChartUtils.getSingleDataArray(
FractionHelpers.getFractionName(war, 'OPFOR'), war.playersOpfor,
FractionHelpers.getFractionName(war, 'BLUFOR'), war.playersBlufor
);
Object.assign(this, [this.playerChart]);
});

View File

@ -25,6 +25,33 @@
</select>
</div>
<div class="form-group">
<label for="fractionMappingBlufor">{{'stats.war.submit.mapping.blufor' | translate}}</label>
<select id="fractionMappingBlufor" name="fractionMappingBlufor" class="form-control btn dropdown-toggle"
required
[(ngModel)]="war.fractionMappingBlufor">
<option value="{{fraction.ARF}}">{{fraction.ARF}}</option>
<option value="{{fraction.SWORD}}">{{fraction.SWORD}}</option>
<option value="OPFOR">{{fraction.OPFOR}}</option>
<option value="BLUFOR">{{fraction.BLUFOR}}</option>
</select>
<show-error displayName="{{'stats.war.submit.mapping.blufor' | translate}}" controlPath="fraction"></show-error>
</div>
<div class="form-group">
<label for="fractionMappingOpfor">{{'stats.war.submit.mapping.blufor' | translate}}</label>
<select id="fractionMappingOpfor" name="fractionMappingOpfor" class="form-control btn dropdown-toggle"
required
[(ngModel)]="war.fractionMappingOpfor">
<option value="{{fraction.ARF}}">{{fraction.ARF}}</option>
<option value="{{fraction.SWORD}}">{{fraction.SWORD}}</option>
<option value="OPFOR">{{fraction.OPFOR}}</option>
<option value="BLUFOR">{{fraction.BLUFOR}}</option>
</select>
<show-error displayName="{{'stats.war.submit.mapping.blufor' | translate}}" controlPath="fraction"></show-error>
</div>
<div class="form-group" *ngIf="!war._id">
<label for="log">{{'stats.war.submit.logfile' | translate}}</label>
<input id="log" name="log" class="ui-button form-control" type="file"
@ -35,24 +62,24 @@
</div>
<div class="form-group" *ngIf="war._id">
<label for="ptBlufor">{{'stats.war.submit.points' | translate}} {{fraction.BLUFOR}}</label>
<label for="ptBlufor">{{'stats.war.submit.points' | translate}} {{fractionHelpers.getFractionName(war, "BLUFOR")}}</label>
<input type="number" class="form-control"
[(ngModel)]="war.ptBlufor"
name="ptBlufor"
id="ptBlufor"
required min="0"/>
<show-error displayName="{{'stats.war.submit.points' | translate}} {{fraction.BLUFOR}}"
<show-error displayName="{{'stats.war.submit.points' | translate}}"
controlPath="ptBlufor"></show-error>
</div>
<div class="form-group" *ngIf="war._id">
<label for="ptOpfor">{{'stats.war.submit.points' | translate}} {{fraction.OPFOR}}</label>
<label for="ptOpfor">{{'stats.war.submit.points' | translate}} {{fractionHelpers.getFractionName(war, "OPFOR")}}</label>
<input type="number" class="form-control"
[(ngModel)]="war.ptOpfor"
name="ptOpfor"
id="ptOpfor"
required min="0"/>
<show-error displayName="{{'stats.war.submit.points' | translate}} {{fraction.OPFOR}}"
<show-error displayName="{{'stats.war.submit.points' | translate}}"
controlPath="ptOpfor"></show-error>
</div>

View File

@ -9,6 +9,7 @@ import {SpinnerService} from '../../../services/user-interface/spinner/spinner.s
import {Subscription} from 'rxjs';
import {Fraction} from '../../../utils/fraction.enum';
import {TranslateService} from '@ngx-translate/core';
import {FractionHelpers} from '../../../utils/global.helpers';
@Component({
@ -28,6 +29,8 @@ export class WarSubmitComponent {
readonly fraction = Fraction;
readonly fractionHelpers = FractionHelpers;
showFileError = false;
loading = false;

View File

@ -1,8 +1,14 @@
export enum Fraction {
ARF = 'ARF',
COLOR_ARF = '#336699',
COLOR_ARF_GREY = '#336699',
COLOR_ARF_DARK = '#336699',
COLOR_ARF_LIGHT = '#336699',
SWORD = 'SWORD',
COLOR_SWORD = '#8b8b8b',
COLOR_SWORD_GREY = '#8b8b8b',
COLOR_SWORD_DARK = '#8b8b8b',
COLOR_SWORD_LIGHT = '#8b8b8b',
BLUFOR = 'NATO',
OPFOR = 'CSAT',
COLOR_BLUFOR = '#3c5fa1',

View File

@ -1,4 +1,6 @@
import {MatButtonToggleGroup} from '@angular/material';
import {War} from '../models/model-interfaces';
import {Fraction} from './fraction.enum';
export const CSSHelpers = {
getBackgroundCSS: (imageUrl) => {
@ -10,6 +12,83 @@ export const CSSHelpers = {
}
};
export const FractionHelpers = {
getFractionColor: (war: War, fraction, style?) => {
switch (fraction === 'BLUFOR' ? war.fractionMappingBlufor : war.fractionMappingOpfor) {
case Fraction.ARF:
switch (style) {
case 'LIGHT':
return Fraction.COLOR_ARF_LIGHT;
case 'DARK':
return Fraction.COLOR_ARF_DARK;
case 'GREY':
return Fraction.COLOR_ARF_GREY;
default:
return Fraction.COLOR_ARF;
}
case "BLUFOR":
switch (style) {
case 'LIGHT':
return Fraction.COLOR_BLUFOR_LIGHT;
case 'DARK':
return Fraction.COLOR_BLUFOR_DARK;
case 'GREY':
return Fraction.COLOR_BLUFOR_GREY;
default:
return Fraction.COLOR_BLUFOR;
}
case "OPFOR":
switch (style) {
case 'LIGHT':
return Fraction.COLOR_OPFOR_LIGHT;
case 'DARK':
return Fraction.COLOR_OPFOR_DARK;
case 'GREY':
return Fraction.COLOR_OPFOR_GREY;
default:
return Fraction.COLOR_OPFOR;
}
case Fraction.SWORD:
switch (style) {
case 'LIGHT':
return Fraction.COLOR_SWORD_LIGHT;
case 'DARK':
return Fraction.COLOR_SWORD_DARK;
case 'GREY':
return Fraction.COLOR_SWORD_GREY;
default:
return Fraction.COLOR_SWORD;
}
}
},
getFractionColors: (war: War, fraction) => {
switch (fraction === 'BLUFOR' ? war.fractionMappingBlufor : war.fractionMappingOpfor) {
case Fraction.ARF:
return Fraction.COLOR_ARF;
case "BLUFOR":
return Fraction.COLOR_BLUFOR;
case "OPFOR":
return Fraction.COLOR_OPFOR;
case Fraction.SWORD:
return Fraction.COLOR_SWORD;
}
},
getFractionName: (war: War, fraction) => {
switch (fraction === 'BLUFOR' ? war.fractionMappingBlufor : war.fractionMappingOpfor) {
case Fraction.ARF:
return Fraction.ARF;
case "BLUFOR":
return Fraction.BLUFOR;
case "OPFOR":
return Fraction.OPFOR;
case Fraction.SWORD:
return Fraction.SWORD;
}
}
};
export const UIHelpers = {
toggleReleaseButton: (currentVal, group?: MatButtonToggleGroup) => {
if (group) {

View File

@ -88,6 +88,8 @@
"stats.war.submit.button.submit": "Bestätigen",
"stats.war.submit.button.cancel": "Abbrechen",
"stats.war.submit.error.file.format": "Logfile muss im Format RPT, LOG oder TXT vorliegen",
"stats.war.submit.mapping.blufor": "Fraktion Zuordnung NATO",
"stats.war.submit.mapping.opfor": "Fraktion Zuordnung CSAT",
"stats.campaign.submit.headline.new": "Neue Kampagne hinzufügen",
"stats.campaign.submit.headline.edit": "Kampagne editieren",