138 lines
3.7 KiB
TypeScript
138 lines
3.7 KiB
TypeScript
import {Component, Input, OnInit} from '@angular/core';
|
|
import {ActivatedRoute} from '@angular/router';
|
|
import {CampaignService} from '../../../services/logs/campaign.service';
|
|
import {ChartUtils} from '../../../utils/chart-utils';
|
|
import {Fraction} from '../../../utils/fraction.enum';
|
|
|
|
|
|
@Component({
|
|
selector: 'cc-campaign-overview',
|
|
templateUrl: './campaign-overview.component.html',
|
|
styleUrls: ['./campaign-overview.component.css']
|
|
})
|
|
export class StatisticOverviewComponent implements OnInit {
|
|
|
|
@Input() campaigns;
|
|
|
|
id = '';
|
|
title = '';
|
|
|
|
pointData: any[] = [];
|
|
pointSumData: any[] = [];
|
|
playerData: any[] = [];
|
|
currentData: any[] = [];
|
|
|
|
colorScheme = {
|
|
domain: [Fraction.COLOR_BLUFOR, Fraction.COLOR_OPFOR]
|
|
};
|
|
gradient = false;
|
|
xAxis = true;
|
|
yAxis = true;
|
|
roundDomains = true;
|
|
legend = true;
|
|
legendTitle = '';
|
|
showXAxisLabel = true;
|
|
showYAxisLabel = true;
|
|
yAxisLabel = '';
|
|
autoscale = true;
|
|
timeline = false;
|
|
|
|
constructor(private route: ActivatedRoute,
|
|
private campaignService: CampaignService) {
|
|
}
|
|
|
|
ngOnInit() {
|
|
this.route.params
|
|
.map(params => params['id'])
|
|
.subscribe((id) => {
|
|
this.id = id;
|
|
this.campaignService.getAllCampaignsWithWars().subscribe(campaigns => {
|
|
this.initWars(campaigns);
|
|
});
|
|
});
|
|
}
|
|
|
|
initWars(campaigns) {
|
|
let wars = [];
|
|
let itemsProcessed = 0;
|
|
campaigns = campaigns.filter(campaign => this.id === 'all' || campaign._id === this.id);
|
|
campaigns.forEach(campaign => {
|
|
wars = wars.concat(campaign.wars);
|
|
itemsProcessed++;
|
|
if (itemsProcessed === campaigns.length) {
|
|
if (this.id === 'all') {
|
|
this.timeline = true;
|
|
}
|
|
this.initChart(wars);
|
|
}
|
|
});
|
|
}
|
|
|
|
goToSlide(index) {
|
|
switch (parseInt(index, 10)) {
|
|
case 0:
|
|
this.currentData = this.pointSumData;
|
|
this.yAxisLabel = 'stats.graph.select.sum.points';
|
|
break;
|
|
case 1:
|
|
this.currentData = this.pointData;
|
|
this.yAxisLabel = 'stats.graph.select.battle.points';
|
|
break;
|
|
case 2:
|
|
this.currentData = this.playerData;
|
|
this.yAxisLabel = 'stats.graph.select.player.count';
|
|
break;
|
|
}
|
|
}
|
|
|
|
initChart(wars: any[]) {
|
|
const pointsObj = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
|
|
const pointsSumObj = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
|
|
const playersObj = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
|
|
|
|
for (let i = wars.length - 1; i >= 0; i--) {
|
|
const j = wars.length - i - 1;
|
|
const warDate = (this.id === 'all') ? new Date(wars[i].date) : ChartUtils.getShortDateString(wars[i].date);
|
|
|
|
pointsObj[0].series.push({
|
|
name: warDate,
|
|
value: wars[i].ptBlufor
|
|
});
|
|
pointsObj[1].series.push({
|
|
name: warDate,
|
|
value: wars[i].ptOpfor
|
|
});
|
|
pointsSumObj[0].series.push({
|
|
name: warDate,
|
|
value: pointsSumObj[0].series[j - 1] ?
|
|
pointsSumObj[0].series[j - 1].value + wars[i].ptBlufor :
|
|
wars[i].ptBlufor
|
|
});
|
|
pointsSumObj[1].series.push({
|
|
name: warDate,
|
|
value: pointsSumObj[1].series[j - 1]
|
|
? pointsSumObj[1].series[j - 1].value + wars[i].ptOpfor :
|
|
wars[i].ptOpfor
|
|
});
|
|
playersObj[0].series.push({
|
|
name: warDate,
|
|
value: wars[i].playersBlufor
|
|
});
|
|
playersObj[1].series.push({
|
|
name: warDate,
|
|
value: wars[i].playersOpfor
|
|
});
|
|
}
|
|
|
|
this.pointData = pointsObj;
|
|
this.pointSumData = pointsSumObj;
|
|
this.playerData = playersObj;
|
|
if (this.id !== 'all') {
|
|
this.goToSlide(0);
|
|
} else {
|
|
this.goToSlide(1);
|
|
}
|
|
Object.assign(this, this.currentData);
|
|
}
|
|
}
|