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.css', '../../../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; 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[7].total === 0 ? 1 : this.graphData[7].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[8].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}); }); this.sumData = tmpSumData; }); } private initDataArray() { this.graphData.forEach(dataSet => { const killObj = { 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 value = this.campaignPlayer.players[i][dataSet.key]; killObj.series.push({ name: warDateString, value: value }); total += value; } dataSet.data = [killObj]; dataSet.refLine = [{value: total / playerLength, name: this.translations['stats.player.detail.graph.average']}]; dataSet.total = total; }); } navigateBack() { this.switchTab.emit(0); } }