opt-cc/static/src/app/statistic/war/fraction-stats/fraction-stats.component.ts

import {Component, ElementRef, Input, OnChanges, OnInit, SimpleChanges, ViewChild} from '@angular/core';
import * as d3 from 'd3';
import {ChartUtils} from '../../../utils/chart-utils';
import {Fraction} from '../../../utils/fraction.enum';
import {War} from '../../../models/model-interfaces';


@Component({
  selector: 'war-detail-fraction',
  templateUrl: './fraction-stats.component.html',
  styleUrls: ['./fraction-stats.component.css', '../../../style/list-entry.css', '../../../style/hide-scrollbar.css']
})
export class FractionStatsComponent implements OnInit, OnChanges {

  readonly fraction = Fraction;

  @ViewChild('overview') private overviewContainer: ElementRef;

  @Input() war: War;

  @Input() logData: any;

  startDateObj: Date;

  initialized: any;

  public chartSelectModel: string;

  lineChartData: any[] = [];
  areaChartData: any[] = [];

  tmpPointData;
  tmpBudgetData;
  tmpKillData;
  tmpFrienlyFireData;
  tmpVehicleData;
  tmpTransportData;
  tmpReviveData;
  tmpStabilizeData;
  tmpFlagCaptureData;

  colorScheme = {
    domain: [Fraction.COLOR_BLUFOR, Fraction.COLOR_OPFOR]
  };

  labelPoints = 'Punkte';
  labelBudget = 'Budget';
  labelKill = 'Abschüsse';
  labelFriendlyFire = 'Friendly Fire';
  labelVehicle = 'Fahrzeug Abschüsse';
  labelTransport = 'Lufttransport';
  labelRevive = 'Revive';
  labelStabilize = 'Stabilisiert';
  labelFlag = 'Flaggenbesitz';
  lineChartLabel: string = this.labelPoints;

  showLineChart = true;
  stepCurve = d3.curveStepAfter;
  gradient = false;
  yAxis = true;
  xAxis = true;
  legend = false;
  legendTitle = false;
  showXAxisLabel = false;
  showYAxisLabel = true;
  autoscale = true;
  timeline = false;
  roundDomains = true;

  constructor() {
  }

  ngOnInit() {
  }

  ngOnChanges(changes: SimpleChanges) {
    if (changes.war || changes.logData) {
      this.initialized = {
        budget: false,
        kill: false,
        revive: false,
        transport: false,
        flag: false
      };
      Object.assign(this, [this.lineChartData, this.areaChartData]);
      this.chartSelectModel = this.labelPoints;

      this.startDateObj = new Date(this.war.date);
      this.startDateObj.setHours(0);
      this.startDateObj.setMinutes(1);
      this.loadFractionData();
    }
  }

  selectChart() {
    if (this.chartSelectModel !== this.labelFlag) {
      this.showLineChart = true;
      this.lineChartLabel = this.chartSelectModel;
      switch (this.chartSelectModel) {
        case this.labelPoints:
          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.labelVehicle:
          this.initVehicleData();
          this.lineChartData = this.tmpVehicleData;
          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;
    }
  }

  loadFractionData() {
    this.initializeTempCollections();
    this.initPointData();
    this.showLineChart = true;
    this.lineChartLabel = this.labelPoints;
    this.lineChartData = this.tmpPointData;
  }

  initPointData() {
    this.logData.points.forEach(pointEntry => {
      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;
      const fractionOld = budgetEntry.fraction !== 'BLUFOR' ? 0 : 1;

      if (this.isTwoMinutesAhead(budgetEntryDate, this.tmpBudgetData)) {
        this.tmpBudgetData[fractionChange].series.push(ChartUtils.getSeriesEntry(new Date(budgetEntry.time), budgetEntry.newBudget));
        this.tmpBudgetData[fractionOld].series.push(ChartUtils.getSeriesEntry(new Date(budgetEntry.time),
          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((kill, pos) => ({killEntry: kill, index: pos}))) {
      const killEntryDate = new Date(killEntry.time);
      if (killEntry.friendlyFire === false) {
        if (killEntry.fraction === 'BLUFOR') {
          killCountBlufor++;
        }
        if (killEntry.fraction === 'OPFOR') {
          killCountOpfor++;
        }
        if (this.isTwoMinutesAhead(killEntryDate, this.tmpKillData)) {
          this.tmpKillData[0].series.push(ChartUtils.getSeriesEntry(killEntryDate, killCountBlufor));
          this.tmpKillData[1].series.push(ChartUtils.getSeriesEntry(killEntryDate, killCountOpfor));
        }
      } else {
        if (killEntry.fraction === 'BLUFOR') {
          ffKillCountBlufor++;
        }
        if (killEntry.fraction === 'OPFOR') {
          ffKillCountOpfor++;
        }
        if (this.isTwoMinutesAhead(killEntryDate, this.tmpFrienlyFireData)) {
          this.tmpFrienlyFireData[0].series.push(ChartUtils.getSeriesEntry(killEntryDate, ffKillCountBlufor));
          this.tmpFrienlyFireData[1].series.push(ChartUtils.getSeriesEntry(killEntryDate, ffKillCountOpfor));
        }
      }
      if (index === this.logData.kill.length - 1) {
        this.tmpKillData[0].series.push(ChartUtils.getSeriesEntry(killEntryDate, killCountBlufor));
        this.tmpKillData[1].series.push(ChartUtils.getSeriesEntry(killEntryDate, killCountOpfor));
        this.tmpFrienlyFireData[0].series.push(ChartUtils.getSeriesEntry(killEntryDate, ffKillCountBlufor));
        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((revive, pos) => ({reviveEntry: revive, index: pos}))) {
      const reviveEntryDate = new Date(reviveEntry.time);
      if (reviveEntry.stabilized === false) {
        if (reviveEntry.fraction === 'BLUFOR') {
          reviveCountBlufor++;
        } else {
          reviveCountOpfor++;
        }
        if (this.isTwoMinutesAhead(reviveEntryDate, this.tmpReviveData)) {
          this.tmpReviveData[0].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, reviveCountBlufor));
          this.tmpReviveData[1].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, reviveCountOpfor));
        }
      } else {
        if (reviveEntry.fraction === 'BLUFOR') {
          stabilizeCountBlufor++;
        } else {
          stabilizeCountOpfor++;
        }
        if (this.isTwoMinutesAhead(reviveEntryDate, this.tmpStabilizeData)) {
          this.tmpStabilizeData[0].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, stabilizeCountBlufor));
          this.tmpStabilizeData[1].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, stabilizeCountOpfor));
        }
      }
      if (index === this.logData.revive.length - 1) {
        this.tmpReviveData[0].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, reviveCountBlufor));
        this.tmpReviveData[1].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, reviveCountOpfor));
        this.tmpStabilizeData[0].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, stabilizeCountBlufor));
        this.tmpStabilizeData[1].series.push(ChartUtils.getSeriesEntry(reviveEntryDate, stabilizeCountOpfor));
      }
    }
    this.addFinalTimeData(this.tmpReviveData);
    this.addFinalTimeData(this.tmpStabilizeData);
    this.initialized.revive = true;
  }

  initVehicleData() {
    if (this.initialized.vehicle) {
      return;
    }
    let vehicleKillCountBlufor = 0, vehicleKillCountOpfor = 0;
    for (const {transportEntry: vehicleEntry, index} of this.logData.vehicle.map((transport, pos) => ({
      transportEntry: transport,
      index: pos
    }))) {
      const vehicleEntryDate = new Date(vehicleEntry.time);
      if (vehicleEntry.fraction === 'BLUFOR') {
        vehicleKillCountBlufor++;
      } else {
        vehicleKillCountOpfor++;
      }
      if (this.isTwoMinutesAhead(vehicleEntryDate, this.tmpVehicleData) || index === this.logData.vehicle.length - 1) {
        this.tmpVehicleData[0].series.push(ChartUtils.getSeriesEntry(vehicleEntryDate, vehicleKillCountBlufor));
        this.tmpVehicleData[1].series.push(ChartUtils.getSeriesEntry(vehicleEntryDate, vehicleKillCountOpfor));
      }
    }
    this.addFinalTimeData(this.tmpVehicleData);
    this.initialized.vehicle = true;
  }

  initTransportData() {
    if (this.initialized.transport) {
      return;
    }
    let transportCountBlufor = 0, transportCountOpfor = 0;
    for (const {transportEntry, index} of this.logData.transport.map((transport, pos) => ({
      transportEntry: transport,
      index: pos
    }))) {
      const transportEntryDate = new Date(transportEntry.time);
      if (transportEntry.fraction === 'BLUFOR') {
        transportCountBlufor++;
      } else {
        transportCountOpfor++;
      }
      if (this.isTwoMinutesAhead(transportEntryDate, this.tmpTransportData) || index === this.logData.transport.length - 1) {
        this.tmpTransportData[0].series.push(ChartUtils.getSeriesEntry(transportEntryDate, transportCountBlufor));
        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));
    this.tmpFlagCaptureData[1].series.push(ChartUtils.getSeriesEntry(this.startDateObj, flagStatusOpfor));

    this.logData.flag.forEach(flagEntry => {
      if (flagEntry.flagFraction === 'BLUFOR') {
        flagStatusBlufor = !flagEntry.capture;
      } else {
        flagStatusOpfor = !flagEntry.capture;
      }
      this.tmpFlagCaptureData[flagEntry.flagFraction === 'BLUFOR' ? 0 : 1].series.push(
        ChartUtils.getSeriesEntry(new Date(flagEntry.time), flagEntry.flagFraction === 'BLUFOR' ? flagStatusBlufor : flagStatusOpfor)
      );
    });

    this.addFinalTimeData(this.tmpFlagCaptureData);
    this.initialized.flag = true;
  }

  protected isTwoMinutesAhead(entryDate: Date, tmpData: any): boolean {
    return entryDate.getTime() >= tmpData[0].series[tmpData[0].series.length - 1].name.getTime() + (1.5 * 60000);
  }

  initializeTempCollections() {
    this.tmpPointData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
    this.tmpBudgetData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
    this.tmpKillData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
    this.tmpFrienlyFireData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
    this.tmpVehicleData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
    this.tmpTransportData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
    this.tmpReviveData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
    this.tmpStabilizeData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);
    this.tmpFlagCaptureData = ChartUtils.getMultiDataArray(Fraction.BLUFOR, Fraction.OPFOR);

    [this.tmpKillData, this.tmpFrienlyFireData, this.tmpVehicleData, this.tmpReviveData, this.tmpStabilizeData,
      this.tmpTransportData].forEach(tmp => {
      [0, 1].forEach(index => {
        tmp[index].series.push(ChartUtils.getSeriesEntry(this.startDateObj, 0));
      });
    });
    this.tmpBudgetData[0].series.push(ChartUtils.getSeriesEntry(this.startDateObj, this.war.budgetBlufor));
    this.tmpBudgetData[1].series.push(ChartUtils.getSeriesEntry(this.startDateObj, this.war.budgetOpfor));
  }

  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 (const j in [0, 1]) {
        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)
          );
        }
      }
    }
  }

}