import {Component, ElementRef, ViewChild} from "@angular/core";
import {ActivatedRoute, Router} from "@angular/router";
import {WarService} from "../../services/logs/war.service";
import {War} from "../../models/model-interfaces";
import {LogsService} from "../../services/logs/logs.service";
import {TabsetComponent} from "ngx-bootstrap";
import * as d3 from "d3";


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

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

  @ViewChild('staticTabs') staticTabs: TabsetComponent;

  war: War = {players: []};

  fractionRadioSelect: string;

  playerChart: any[] = [];

  cellHeight = 40;

  rows = [];

  reorderable: boolean = false;

  customClasses = {
    sortAscending: 'glyphicon glyphicon-triangle-top',
    sortDescending: 'glyphicon glyphicon-triangle-bottom',
  };

  pointData: any[] = [];
  budgetData: any[] = [];
  killData: any[] = [];
  friendlyFireData: any[] = [];
  transportData: any[] = [];
  reviveData: any[] = [];
  stabilizedData: any[] = [];
  flagData: any[] = [];

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

  colorScheme = {
    domain: ['#0000FF', '#B22222']
  };

  yAxisLabelPoints = 'Punkte';
  yAxisLabelBudget = 'Budget';
  yAxisLabelKill = 'Kills';
  yAxisLabelFriendlyFire = 'FriendlyFire';
  yAxisLabelTransport = 'Lufttransport';
  yAxisLabelRevive = 'Revive';
  yAxisLabelStabilize = 'Stabilisiert';
  yAxisLabelFlag = 'Flaggenbesitz';

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

  constructor(private route: ActivatedRoute,
              private router: Router,
              private warService: WarService,
              private logsService: LogsService) {
  }

  ngOnInit() {
    this.route.params
      .map(params => params['id'])
      .filter(id => id != undefined)
      .flatMap(id => this.warService.getWar(id))
      .subscribe(war => {
        this.war = war;
        this.rows = war.players;
        this.playerChart = [
          {
            "name": "CSAT",
            "value": war.playersOpfor
          },
          {
            "name": "NATO",
            "value": war.playersBlufor
          }
        ];
        this.tmpPointData = [
          {
            "name": "NATO",
            "series": []
          },
          {
            "name": "CSAT",
            "series": []
          }
        ];
        this.tmpBudgetData = JSON.parse(JSON.stringify(this.tmpPointData));
        this.tmpKillData = JSON.parse(JSON.stringify(this.tmpPointData));
        this.tmpFrienlyFireData = JSON.parse(JSON.stringify(this.tmpPointData));
        this.tmpTransportData = JSON.parse(JSON.stringify(this.tmpPointData));
        this.tmpReviveData = JSON.parse(JSON.stringify(this.tmpPointData));
        this.tmpStabilizeData = JSON.parse(JSON.stringify(this.tmpPointData));
        this.tmpFlagCaptureData = JSON.parse(JSON.stringify(this.tmpPointData));

        Object.assign(this, [this.playerChart, this.pointData, this.budgetData, this.killData,
          this.friendlyFireData, this.transportData, this.reviveData, this.stabilizedData, this.flagData]);

        this.fractionChartsInitialized = false;
        this.staticTabs.tabs[0].active = true;
        this.scrollOverviewTop();
      });
  }

  filterPlayersByFraction(fraction?: string) {
    if (fraction) {
      this.rows = this.war.players.filter((player) => {
        return player.fraction === fraction;
      })
    } else {
      this.rows = this.war.players;
    }
  }

  selectPlayerDetail(player) {
    if (player && player.selected && player.selected.length > 0) {
      this.router.navigate(['../../campaign-player/' + this.war.campaign + '/' + player.selected[0].name],
        {relativeTo: this.route});
    }
  }

  scrollOverviewTop() {
    try {
      this.overviewContainer.nativeElement.scrollTop = 0;
    } catch (err) {
    }
  }

  loadFractionData() {
    if (this.fractionChartsInitialized) {
      return;
    }

    const newGraphEntry = (entry: any, val1: any, val2: any) => {
      return {"name": new Date(entry.time), "value": entry.fraction === 'BLUFOR' ? val1 : val2};
    };

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

    [this.tmpKillData, this.tmpFrienlyFireData, this.tmpReviveData, this.tmpStabilizeData, this.tmpTransportData].forEach(tmp => {
      [0, 1].forEach(index => {
        tmp[index].series.push({
          "name": startDateObj,
          "value": 0
        });
      })
    });

    let killCountBlufor = 0, killCountOpfor = 0, ffKillCountBlufor = 0, ffKillCountOpfor = 0, reviveCountBlufor = 0,
      reviveCountOpfor = 0, stabilizeCountBlufor = 0, stabilizeCountOpfor = 0, transportCountBlufor = 0,
      transportCountOpfor = 0;

    this.logsService.getFullLog(this.war._id).subscribe((data) => {
      // POINTS
      data.points.forEach(pointEntry => {
        this.tmpPointData[0].series.push({
          "name": new Date(pointEntry.time),
          "value": pointEntry.ptBlufor
        });
        this.tmpPointData[1].series.push({
          "name": new Date(pointEntry.time),
          "value": pointEntry.ptOpfor
        });
      });

      // BUDGET
      this.tmpBudgetData[0].series.push({
        "name": startDateObj,
        "value": this.war.budgetBlufor
      });
      this.tmpBudgetData[1].series.push({
        "name": startDateObj,
        "value": this.war.budgetOpfor
      });
      // This adds an entry for both fractions on every event
      for (let i = 0; i < data.budget.length; i++) {
        const budgetEntry = data.budget[i];
        const fractionChange = budgetEntry.fraction === 'BLUFOR' ? 0 : 1;
        const fractionOld = budgetEntry.fraction !== 'BLUFOR' ? 0 : 1;

        this.tmpBudgetData[fractionChange].series.push({
          "name": new Date(budgetEntry.time),
          "value": budgetEntry.newBudget
        });

        this.tmpBudgetData[fractionOld].series.push({
          "name": new Date(budgetEntry.time),
          "value": this.tmpBudgetData[fractionOld].series[this.tmpBudgetData[fractionOld].series.length - 1].value
        });
      }

      // KILLS & FRIENDLY FIRE
      data.kill.forEach(killEntry => {
        if (killEntry.fraction === 'BLUFOR') {
          if (killEntry.friendlyFire === false) {
            killCountBlufor++;
          } else {
            ffKillCountBlufor++;
          }
        } else {
          if (killEntry.friendlyFire === false) {
            killCountOpfor++;
          } else {
            ffKillCountOpfor++;
          }
        }
        this.tmpKillData[killEntry.fraction === 'BLUFOR' ? 0 : 1].series.push(
          newGraphEntry(killEntry, killCountBlufor, killCountOpfor)
        );
        this.tmpFrienlyFireData[killEntry.fraction === 'BLUFOR' ? 0 : 1].series.push(
          newGraphEntry(killEntry, ffKillCountBlufor, ffKillCountOpfor)
        )
      });

      // REVIVE & STABILIZE
      data.revive.forEach(reviveEntry => {
        if (reviveEntry.fraction === 'BLUFOR') {
          if (reviveEntry.stabilized === false) {
            reviveCountBlufor++;
          } else {
            stabilizeCountBlufor++;
          }
        } else {
          if (reviveEntry.stabilized === false) {
            reviveCountOpfor++;
          } else {
            stabilizeCountOpfor++;
          }
        }
        this.tmpReviveData[reviveEntry.fraction === 'BLUFOR' ? 0 : 1].series.push(
          newGraphEntry(reviveEntry, reviveCountBlufor, reviveCountOpfor));
        this.tmpStabilizeData[reviveEntry.fraction === 'BLUFOR' ? 0 : 1].series.push(
          newGraphEntry(reviveEntry, stabilizeCountBlufor, stabilizeCountOpfor));
      });

      // TRANSPORT
      data.transport.forEach(transportEntry => {
        if (transportEntry.fraction === 'BLUFOR') {
          transportCountBlufor++;
        } else {
          transportCountOpfor++;
        }
        this.tmpTransportData[transportEntry.fraction === 'BLUFOR' ? 0 : 1].series.push(
          newGraphEntry(transportEntry, transportCountBlufor, transportCountOpfor));
      });

      // FLAG
      let flagStatusBlufor = true;
      let flagStatusOpfor = true;
      this.tmpFlagCaptureData[0].series.push({
        "name": startDateObj,
        "value": flagStatusBlufor
      });
      this.tmpFlagCaptureData[1].series.push({
        "name": startDateObj,
        "value": flagStatusOpfor
      });

      data.flag.forEach(flagEntry => {
        if (flagEntry.flagFraction === 'BLUFOR') {
          flagStatusBlufor = !flagEntry.capture
        } else {
          flagStatusOpfor = !flagEntry.capture;
        }
        this.tmpFlagCaptureData[flagEntry.flagFraction === 'BLUFOR' ? 0 : 1].series.push(
          newGraphEntry(flagEntry, flagStatusBlufor, flagStatusOpfor)
        );
      });

      this.addFinalTimeDataEntriesAndPopulate(new Date(this.war.endDate));

      this.fractionChartsInitialized = true;
    });
  }

  addFinalTimeDataEntriesAndPopulate(endDate) {
    [this.tmpPointData, this.tmpBudgetData, this.tmpTransportData, this.tmpReviveData, this.tmpStabilizeData,
      this.tmpKillData, this.tmpFrienlyFireData, this.tmpFlagCaptureData].forEach(tmp => {
      for (let j in [0, 1]) {
        if (tmp[j].series[tmp[j].series.length - 1].name < endDate) {
          tmp[j].series.push({
              'name': endDate,
              'value': tmp[j].series[tmp[j].series.length - 1].value
            }
          )
        }
      }
    });
    this.pointData = this.tmpPointData;
    this.budgetData = this.tmpBudgetData;
    this.transportData = this.tmpTransportData;
    this.reviveData = this.tmpReviveData;
    this.stabilizedData = this.tmpStabilizeData;
    this.killData = this.tmpKillData;
    this.friendlyFireData = this.tmpFrienlyFireData;
    this.flagData = this.tmpFlagCaptureData;
  }

}