136 lines
4.2 KiB
TypeScript
136 lines
4.2 KiB
TypeScript
import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
|
|
import {CampaignPlayer} from '../../../models/model-interfaces';
|
|
import {PlayerService} from '../../../services/logs/player.service';
|
|
import {ChartUtils} from '../../../utils/chart-utils';
|
|
import {PlayerUtils} from '../../../utils/player-utils';
|
|
import {TranslateService} from '@ngx-translate/core';
|
|
|
|
|
|
@Component({
|
|
selector: 'campaign-player-detail',
|
|
templateUrl: './campaign-player-detail.component.html',
|
|
styleUrls: ['./campaign-player-detail.component.scss', '../../../style/list-entry.css',
|
|
'../../../style/hide-scrollbar.css', '../../../style/overview.css']
|
|
})
|
|
export class CampaignPlayerDetailComponent implements OnInit {
|
|
|
|
@Input() campaignId: string;
|
|
|
|
@Input() playerName: string;
|
|
|
|
@Output() switchTab = new EventEmitter();
|
|
|
|
campaignPlayer: CampaignPlayer = {name: '', campaign: {}, players: []};
|
|
|
|
graphData: any[] = [];
|
|
sumData: any[] = [];
|
|
|
|
translations = {};
|
|
|
|
colorScheme = {
|
|
domain: ['#00ce12']
|
|
};
|
|
colorSchemeBar = {
|
|
domain: [
|
|
'#2d5a00', '#455600', '#00561f', '#3f3b00', '#003c19', '#083c00'
|
|
]
|
|
};
|
|
showRefLines = true;
|
|
showRefLabels = true;
|
|
gradient = false;
|
|
xAxis = true;
|
|
yAxis = true;
|
|
legend = false;
|
|
showXAxisLabel = true;
|
|
showYAxisLabel = true;
|
|
autoscale = false;
|
|
timeline = false;
|
|
roundDomains = true;
|
|
animations = false;
|
|
|
|
kdRatio = 0;
|
|
maxKd = 1.7;
|
|
|
|
respawnDeathRatio = 0;
|
|
maxRespawnDeathRatio = 1;
|
|
|
|
playerAttributeNameMap = PlayerUtils.attributeDisplayNames.slice(2, PlayerUtils.attributeDisplayNames.length);
|
|
|
|
constructor(private playerService: PlayerService,
|
|
private translate: TranslateService) {
|
|
}
|
|
|
|
ngOnInit() {
|
|
['stats.player.detail.graph.average',
|
|
'stats.player.detail.kill.death.ratio',
|
|
'stats.player.detail.respawn.death.ratio'].forEach((i18n) => {
|
|
this.translate.get(i18n).subscribe((translated) => {
|
|
this.translations[i18n] = translated;
|
|
});
|
|
});
|
|
|
|
this.playerService.getCampaignPlayer(this.campaignId, encodeURIComponent(this.playerName))
|
|
.subscribe(campaignPlayer => {
|
|
this.campaignPlayer = campaignPlayer;
|
|
|
|
for (let i = 0; i < this.playerAttributeNameMap.length; i++) {
|
|
const attr = this.playerAttributeNameMap[i];
|
|
this.translate.get(attr.head).subscribe((translated) => {
|
|
this.graphData.push({key: attr.prop, label: translated});
|
|
});
|
|
}
|
|
|
|
this.initDataArray();
|
|
|
|
const totalDeathDiv = this.graphData[9].total === 0 ? 1 : this.graphData[9].total;
|
|
this.kdRatio = parseFloat((this.graphData[0].total / totalDeathDiv).toFixed(2));
|
|
if (this.kdRatio > 1) {
|
|
this.maxKd = this.kdRatio * 1.7;
|
|
}
|
|
|
|
this.respawnDeathRatio = parseFloat((this.graphData[10].total / totalDeathDiv).toFixed(2));
|
|
|
|
// we can not directly push to target array, since only full reference changes trigger the refresh of data
|
|
const tmpSumData = [];
|
|
this.graphData.forEach(dataSet => {
|
|
tmpSumData.push({name: dataSet.label, value: dataSet.total ? dataSet.total : 0});
|
|
});
|
|
this.sumData = tmpSumData;
|
|
});
|
|
}
|
|
|
|
private initDataArray() {
|
|
this.graphData.forEach(dataSet => {
|
|
const dataObj = {
|
|
name: dataSet.label,
|
|
series: []
|
|
};
|
|
const playerLength = this.campaignPlayer.players.length;
|
|
let total = 0;
|
|
for (let i = 0; i < playerLength; i++) {
|
|
const warDateString = ChartUtils.getShortDateString(this.campaignPlayer.players[i].warId.date);
|
|
|
|
const valueField = this.campaignPlayer.players[i][dataSet.key];
|
|
let value = valueField ? valueField : 0;
|
|
if (dataSet.key === 'travelDistance' || dataSet.key === 'driverDistance') {
|
|
value = Math.round(value / 1000); // meters to km
|
|
}
|
|
|
|
dataObj.series.push({
|
|
name: warDateString,
|
|
value: value
|
|
});
|
|
total += value;
|
|
}
|
|
|
|
dataSet.data = [dataObj];
|
|
dataSet.refLine = [{value: total / playerLength, name: this.translations['stats.player.detail.graph.average']}];
|
|
dataSet.total = total;
|
|
});
|
|
}
|
|
|
|
navigateBack() {
|
|
this.switchTab.emit(0);
|
|
}
|
|
}
|