Fix flag capture graph logic; Change initialization strategy
parent
e263ce050a
commit
ee6dc8bc5b
|
@ -54,7 +54,7 @@
|
|||
}
|
||||
|
||||
:host /deep/ .nav-link:hover {
|
||||
background: #286090;
|
||||
background: #afafaf;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
|
@ -100,6 +100,21 @@
|
|||
|
||||
/* ########### CHART-TAB ######## */
|
||||
|
||||
.btn-dark {
|
||||
background: #4b4b4b;
|
||||
color: #f5f5f5;
|
||||
border-color: #000;
|
||||
}
|
||||
|
||||
.btn-dark:hover {
|
||||
background: #afafaf;
|
||||
color: #f5f5f5;
|
||||
}
|
||||
|
||||
.btn-dark.active {
|
||||
background: #222222;
|
||||
}
|
||||
|
||||
.chart-container {
|
||||
width: 95%;
|
||||
margin: 2%;
|
||||
|
@ -117,6 +132,6 @@
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.dropdown-menu > li > a {
|
||||
cursor: pointer;
|
||||
}
|
||||
/*.dropdown-menu > li > a {*/
|
||||
/*cursor: pointer;*/
|
||||
/*}*/
|
||||
|
|
|
@ -29,7 +29,7 @@
|
|||
'left=20,top=20,width=1380,height=600,toolbar=1,resizable=0'); return false;"
|
||||
href="resource/logs/{{war._id}}/clean.log">
|
||||
Logfile anzeigen</a>
|
||||
<form class="form-group">
|
||||
<form *ngIf="staticTabs.tabs[0].active" class="form-group">
|
||||
<label class="radio-inline">
|
||||
<input type="radio" name="fractSelect"
|
||||
[checked]="(fractionRadioSelect == undefined) ? 'true' : 'false'"
|
||||
|
@ -117,16 +117,16 @@
|
|||
<!--</div>-->
|
||||
|
||||
<div class="chart-select-group btn-group" (click)="selectChart()">
|
||||
<label class="btn btn-default" [(ngModel)]="chartSelectModel" btnRadio="{{labelPoints}}">{{labelPoints}}</label>
|
||||
<label class="btn btn-default" [(ngModel)]="chartSelectModel" btnRadio="{{labelBudget}}">{{labelBudget}}</label>
|
||||
<label class="btn btn-default" [(ngModel)]="chartSelectModel" btnRadio="{{labelKill}}">{{labelKill}}</label>
|
||||
<label class="btn btn-default" [(ngModel)]="chartSelectModel" btnRadio="{{labelFriendlyFire}}">{{labelFriendlyFire}}</label>
|
||||
<label class="btn btn-default" [(ngModel)]="chartSelectModel" btnRadio="{{labelRevive}}">{{labelRevive}}</label>
|
||||
<label class="btn btn-default" [(ngModel)]="chartSelectModel"
|
||||
<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="{{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="{{labelRevive}}">{{labelRevive}}</label>
|
||||
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel"
|
||||
btnRadio="{{labelStabilize}}">{{labelStabilize}}</label>
|
||||
<label class="btn btn-default" [(ngModel)]="chartSelectModel"
|
||||
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel"
|
||||
btnRadio="{{labelTransport}}">{{labelTransport}}</label>
|
||||
<label class="btn btn-default" [(ngModel)]="chartSelectModel" btnRadio="{{labelFlag}}">{{labelFlag}}</label>
|
||||
<label class="btn btn-default btn-dark" [(ngModel)]="chartSelectModel" btnRadio="{{labelFlag}}">{{labelFlag}}</label>
|
||||
</div>
|
||||
|
||||
<div *ngIf="showLineChart" class="chart-container">
|
||||
|
|
|
@ -51,6 +51,8 @@ export class WarDetailComponent {
|
|||
tmpStabilizeData;
|
||||
tmpFlagCaptureData;
|
||||
|
||||
initialized;
|
||||
|
||||
colorScheme = {
|
||||
domain: ['#0000FF', '#B22222']
|
||||
};
|
||||
|
@ -77,7 +79,6 @@ export class WarDetailComponent {
|
|||
autoscale = true;
|
||||
timeline = false;
|
||||
roundDomains = true;
|
||||
fractionChartsInitialized: boolean = false;
|
||||
|
||||
startDateObj;
|
||||
|
||||
|
@ -101,7 +102,14 @@ export class WarDetailComponent {
|
|||
this.rows = war.players;
|
||||
this.playerChart = ChartUtils.getSingleDataArray('CSAT', war.playersOpfor, 'NATO', war.playersBlufor);
|
||||
|
||||
this.fractionChartsInitialized = false;
|
||||
this.initialized = {
|
||||
basic: false,
|
||||
budget: false,
|
||||
kill: false,
|
||||
revive: false,
|
||||
transport: false,
|
||||
flag: false
|
||||
};
|
||||
Object.assign(this, [this.playerChart, this.lineChartData, this.areaChartData]);
|
||||
this.chartSelectModel = this.labelPoints;
|
||||
|
||||
|
@ -134,25 +142,32 @@ export class WarDetailComponent {
|
|||
this.lineChartData = this.tmpPointData;
|
||||
break;
|
||||
case this.labelBudget:
|
||||
this.initBudgetData();
|
||||
this.lineChartData = this.tmpBudgetData;
|
||||
break;
|
||||
case this.labelKill:
|
||||
this.initKillData();
|
||||
this.lineChartData = this.tmpKillData;
|
||||
break;
|
||||
case this.labelFriendlyFire:
|
||||
this.initKillData();
|
||||
this.lineChartData = this.tmpFrienlyFireData;
|
||||
break;
|
||||
case this.labelRevive:
|
||||
this.initRevive();
|
||||
this.lineChartData = this.tmpReviveData;
|
||||
break;
|
||||
case this.labelStabilize:
|
||||
this.initRevive();
|
||||
this.lineChartData = this.tmpStabilizeData;
|
||||
break;
|
||||
case this.labelTransport:
|
||||
this.initTransportData();
|
||||
this.lineChartData = this.tmpTransportData;
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
this.initFlagHoldData();
|
||||
this.showLineChart = false;
|
||||
this.areaChartData = this.tmpFlagCaptureData;
|
||||
}
|
||||
|
@ -180,7 +195,7 @@ export class WarDetailComponent {
|
|||
}
|
||||
|
||||
loadFractionData() {
|
||||
if (this.fractionChartsInitialized) {
|
||||
if (this.initialized.basic) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -188,17 +203,11 @@ export class WarDetailComponent {
|
|||
|
||||
this.logsService.getFullLog(this.war._id).subscribe((data) => {
|
||||
this.logData = data;
|
||||
|
||||
this.initPointData();
|
||||
this.initBudgetData();
|
||||
this.initKillData();
|
||||
this.initRevive();
|
||||
this.initTransportData();
|
||||
this.initFlagHoldData();
|
||||
|
||||
this.addFinalTimeDataEntriesAndPopulate(new Date(this.war.endDate));
|
||||
|
||||
this.fractionChartsInitialized = true;
|
||||
this.showLineChart = true;
|
||||
this.lineChartLabel = this.labelPoints;
|
||||
this.lineChartData = this.tmpPointData;
|
||||
this.initialized.basic = true;
|
||||
});
|
||||
}
|
||||
|
||||
|
@ -207,9 +216,13 @@ export class WarDetailComponent {
|
|||
this.tmpPointData[0].series.push(ChartUtils.getSeriesEntry(new Date(pointEntry.time), pointEntry.ptBlufor));
|
||||
this.tmpPointData[1].series.push(ChartUtils.getSeriesEntry(new Date(pointEntry.time), pointEntry.ptOpfor));
|
||||
});
|
||||
this.addFinalTimeData(this.tmpPointData);
|
||||
}
|
||||
|
||||
initBudgetData() {
|
||||
if (this.initialized.budget) {
|
||||
return;
|
||||
}
|
||||
this.logData.budget.forEach(budgetEntry => {
|
||||
const budgetEntryDate = new Date(budgetEntry.time);
|
||||
const fractionChange = budgetEntry.fraction === 'BLUFOR' ? 0 : 1;
|
||||
|
@ -221,9 +234,14 @@ export class WarDetailComponent {
|
|||
this.tmpBudgetData[fractionOld].series[this.tmpBudgetData[fractionOld].series.length - 1].value));
|
||||
}
|
||||
});
|
||||
this.addFinalTimeData(this.tmpBudgetData);
|
||||
this.initialized.budget = true;
|
||||
}
|
||||
|
||||
initKillData() {
|
||||
if (!this.initialized.kill) {
|
||||
return;
|
||||
}
|
||||
let killCountBlufor = 0, killCountOpfor = 0, ffKillCountBlufor = 0, ffKillCountOpfor = 0;
|
||||
|
||||
for (const {killEntry, index} of this.logData.kill.map((killEntry, index) => ({killEntry, index}))) {
|
||||
|
@ -258,9 +276,16 @@ export class WarDetailComponent {
|
|||
this.tmpFrienlyFireData[1].series.push(ChartUtils.getSeriesEntry(killEntryDate, ffKillCountOpfor));
|
||||
}
|
||||
}
|
||||
|
||||
this.addFinalTimeData(this.tmpKillData);
|
||||
this.addFinalTimeData(this.tmpFrienlyFireData)
|
||||
this.initialized.kill = true;
|
||||
}
|
||||
|
||||
initRevive() {
|
||||
if (this.initialized.revive) {
|
||||
return;
|
||||
}
|
||||
let reviveCountBlufor = 0, reviveCountOpfor = 0, stabilizeCountBlufor = 0, stabilizeCountOpfor = 0;
|
||||
for (const {reviveEntry, index} of this.logData.revive.map((reviveEntry, index) => ({reviveEntry, index}))) {
|
||||
const reviveEntryDate = new Date(reviveEntry.time);
|
||||
|
@ -292,9 +317,15 @@ export class WarDetailComponent {
|
|||
this.tmpStabilizeData[1].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, stabilizeCountOpfor));
|
||||
}
|
||||
}
|
||||
this.addFinalTimeData(this.tmpReviveData);
|
||||
this.addFinalTimeData(this.tmpStabilizeData);
|
||||
this.initialized.revive = true;
|
||||
}
|
||||
|
||||
initTransportData() {
|
||||
if (this.initialized.transport) {
|
||||
return;
|
||||
}
|
||||
let transportCountBlufor = 0, transportCountOpfor = 0;
|
||||
for (const {transportEntry, index} of this.logData.transport.map((transportEntry, index) => ({
|
||||
transportEntry,
|
||||
|
@ -311,9 +342,15 @@ export class WarDetailComponent {
|
|||
this.tmpTransportData[1].series.push(ChartUtils.getSeriesEntry(transportEntryDate, transportCountOpfor));
|
||||
}
|
||||
}
|
||||
this.addFinalTimeData(this.tmpTransportData);
|
||||
this.initialized.transport = true;
|
||||
|
||||
}
|
||||
|
||||
initFlagHoldData() {
|
||||
if (this.initialized.flag) {
|
||||
return;
|
||||
}
|
||||
let flagStatusBlufor = true;
|
||||
let flagStatusOpfor = true;
|
||||
this.tmpFlagCaptureData[0].series.push(ChartUtils.getSeriesEntry(this.startDateObj, flagStatusBlufor));
|
||||
|
@ -321,14 +358,17 @@ export class WarDetailComponent {
|
|||
|
||||
this.logData.flag.forEach(flagEntry => {
|
||||
if (flagEntry.flagFraction === 'BLUFOR') {
|
||||
flagStatusBlufor = !flagEntry.capture
|
||||
flagStatusBlufor = !flagEntry.capture;
|
||||
} else {
|
||||
flagStatusOpfor = !flagEntry.capture;
|
||||
}
|
||||
this.tmpFlagCaptureData[flagEntry.flagFraction === 'BLUFOR' ? 0 : 1].series.push(
|
||||
ChartUtils.getSeriesEntry(new Date(flagEntry.time), flagEntry.fraction === 'BLUFOR' ? flagStatusBlufor : flagStatusOpfor)
|
||||
ChartUtils.getSeriesEntry(new Date(flagEntry.time), flagEntry.flagFraction === 'BLUFOR' ? flagStatusBlufor : flagStatusOpfor)
|
||||
)
|
||||
});
|
||||
|
||||
this.addFinalTimeData(this.tmpFlagCaptureData);
|
||||
this.initialized.flag = true;
|
||||
}
|
||||
|
||||
private static isTwoMinutesAhead(entryDate: Date, tmpData: any): boolean {
|
||||
|
@ -354,21 +394,18 @@ export class WarDetailComponent {
|
|||
this.tmpBudgetData[1].series.push(ChartUtils.getSeriesEntry(this.startDateObj, this.war.budgetOpfor));
|
||||
}
|
||||
|
||||
addFinalTimeDataEntriesAndPopulate(endDate) {
|
||||
[this.tmpPointData, this.tmpTransportData, this.tmpReviveData, this.tmpStabilizeData,
|
||||
this.tmpKillData, this.tmpFrienlyFireData, this.tmpFlagCaptureData].forEach(tmp => {
|
||||
addFinalTimeData(tmpCollection) {
|
||||
const endDate = new Date(this.war.endDate);
|
||||
if (tmpCollection === this.tmpBudgetData) {
|
||||
this.tmpBudgetData[0].series.push(ChartUtils.getSeriesEntry(endDate, this.war.endBudgetBlufor));
|
||||
this.tmpBudgetData[1].series.push(ChartUtils.getSeriesEntry(endDate, this.war.endBudgetOpfor));
|
||||
} else {
|
||||
for (let j in [0, 1]) {
|
||||
if (tmp[j].series[tmp[j].series.length - 1].name < endDate) {
|
||||
tmp[j].series.push(ChartUtils.getSeriesEntry(endDate, tmp[j].series[tmp[j].series.length - 1].value));
|
||||
if (tmpCollection[j].series[tmpCollection[j].series.length - 1].name < endDate) {
|
||||
tmpCollection[j].series.push(ChartUtils.getSeriesEntry(endDate, tmpCollection[j].series[tmpCollection[j].series.length - 1].value));
|
||||
}
|
||||
}
|
||||
});
|
||||
this.tmpBudgetData[0].series.push(ChartUtils.getSeriesEntry(endDate, this.war.endBudgetBlufor));
|
||||
this.tmpBudgetData[1].series.push(ChartUtils.getSeriesEntry(endDate, this.war.endBudgetOpfor));
|
||||
|
||||
this.showLineChart = true;
|
||||
this.lineChartLabel = this.labelPoints;
|
||||
this.lineChartData = this.tmpPointData;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue