opt-cc/static/src/app/statistic/campaign/overview/campaign-overview.component.ts

import {Component, 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';
import {WarService} from '../../../services/logs/war.service';
import {FractionHelpers} from '../../../utils/global.helpers';
import {War} from '../../../models/model-interfaces';


@Component({
  selector: 'cc-campaign-overview',
  templateUrl: './campaign-overview.component.html',
  styleUrls: ['./campaign-overview.component.scss']
})
export class StatisticOverviewComponent implements OnInit {

  id: string;

  initialized = false;

  pointData: any[] = [];
  pointSumData: any[] = [];
  playerData: any[] = [];
  currentData: any[] = [];

  colorScheme;
  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,
              private warService: WarService) {
  }

  ngOnInit() {
    this.route.params
        .map(params => params['id'])
        .subscribe((id) => {
          this.id = id;
          this.initWars();
        });
  }

  initWars() {
    if (this.id === 'all') {
      this.warService.getAllWars().subscribe((wars) => {
        this.initChart(wars);
      });
      this.timeline = true;
    } else {
      this.warService.wars$.subscribe((wars) => {
        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: War[]) {
    const fractions: string[] = [];
    this.colorScheme = {
      domain: []
    };

    if (wars.find(war => war.fractionMappingBlufor === 'BLUFOR' || war.fractionMappingOpfor === 'BLUFOR')) {
      fractions.push(Fraction.BLUFOR);
      this.colorScheme.domain.push(FractionHelpers.getFractionColor('BLUFOR'));
    }
    if (wars.find(war => war.fractionMappingBlufor === 'OPFOR' || war.fractionMappingOpfor === 'OPFOR')) {
      fractions.push(Fraction.OPFOR);
      this.colorScheme.domain.push(FractionHelpers.getFractionColor('OPFOR'));
    }
    if (wars.find(war => war.fractionMappingBlufor === Fraction.ARF || war.fractionMappingOpfor === Fraction.ARF)) {
      fractions.push(Fraction.ARF);
      this.colorScheme.domain.push(FractionHelpers.getFractionColor(Fraction.ARF));
    }
    if (wars.find(war => war.fractionMappingBlufor === Fraction.SWORD || war.fractionMappingOpfor === Fraction.SWORD)) {
      fractions.push(Fraction.SWORD);
      this.colorScheme.domain.push(FractionHelpers.getFractionColor(Fraction.SWORD));
    }

    const pointsObj = ChartUtils.getMultiDataArray(...fractions);
    const pointsSumObj = ChartUtils.getMultiDataArray(...fractions);
    const playersObj = ChartUtils.getMultiDataArray(...fractions);

    for (let i = wars.length - 1; i >= 0; i--) {
      const war = wars[i];
      if (!war) {
        continue;
      }

      const bluforIndex = fractions.findIndex(fraction =>
        fraction === FractionHelpers.getFractionName(war, 'BLUFOR'));
      const opforIndex = fractions.findIndex(
        fraction => fraction === FractionHelpers.getFractionName(war, 'OPFOR'));

      const j = wars.length - i - 1;
      const warDate = (this.id === 'all') ? new Date(war.date) : ChartUtils.getShortDateString(war.date);
      pointsObj[bluforIndex].series.push({
        name: warDate,
        value: war.ptBlufor
      });
      pointsObj[opforIndex].series.push({
        name: warDate,
        value: war.ptOpfor
      });
      pointsSumObj[bluforIndex].series.push({
        name: warDate,
        value: pointsSumObj[bluforIndex].series[j - 1] ?
          pointsSumObj[bluforIndex].series[j - 1].value + war.ptBlufor :
          war.ptBlufor
      });
      pointsSumObj[opforIndex].series.push({
        name: warDate,
        value: pointsSumObj[opforIndex].series[j - 1]
          ? pointsSumObj[opforIndex].series[j - 1].value + war.ptOpfor :
          war.ptOpfor
      });
      playersObj[bluforIndex].series.push({
        name: warDate,
        value: war.playersBlufor
      });
      playersObj[opforIndex].series.push({
        name: warDate,
        value: war.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);

    setTimeout(() => {
      this.initialized = true;
    }, 250);
  }
}