import {Component, ElementRef, Input, OnChanges, OnInit, SimpleChanges, ViewChild} from '@angular/core';
import {ChartUtils} from '../../../utils/chart-utils';
import {War} from '../../../models/model-interfaces';
import {TranslateService} from '@ngx-translate/core';


@Component({
  selector: 'cc-server-statistics',
  templateUrl: './server-stats.component.html',
  styleUrls: ['./server-stats.component.css', '../../../style/list-entry.css', '../../../style/hide-scrollbar.css']
})
export class ServerStatsComponent implements OnInit, OnChanges {

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

  @Input() war: War;

  @Input() performanceData: any;

  startDateObj: Date;

  initialized: any;

  public activeChartSelect: string;

  lineChartData: any[] = [];

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

  readonly labels = {
    singleAvg: 'stats.performance.select.single.avg',
    singleMin: 'stats.performance.select.single.min',
    avgTimeline: 'stats.performance.select.timeline.avg',
    minTimeline: 'stats.performance.select.timeline.min',
    serverFps: 'stats.performance.select.timeline.server',
  };
  readonly labelsAsString = Object.keys(this.labels)
                                  .map((key) => this.labels[key]);

  lineChartLabel: string;

  gradient = false;
  yAxis = true;
  xAxis = true;
  legend = false;
  legendTitle = false;
  showXAxisLabel = false;
  showYAxisLabel = true;
  autoscale = true;
  timeline = false;
  roundDomains = true;

  constructor(private translate: TranslateService) {
  }

  ngOnInit() {
    this.setLineChartLabel(this.labels.singleAvg);
  }

  ngOnChanges(changes: SimpleChanges) {
    if (changes.war || changes.performanceData) {
      this.initialized = {
        budget: false,
        kill: false,
        revive: false,
        transport: false,
        flag: false
      };
      Object.assign(this, [this.lineChartData]);
      this.activeChartSelect = this.labels.singleAvg;

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

  selectChart(newSelection) {
    this.activeChartSelect = newSelection;
    this.setLineChartLabel(this.activeChartSelect);
    console.log('############### apply data ##################');
  }

  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 (let j = 0; j < tmpCollection.length; j++) {
        // mayBe check is needed for logs that are simply not existent in older wars, i.e. vehicleKills
        const maybeLast = tmpCollection[j].series[tmpCollection[j].series.length - 1];
        if (maybeLast && maybeLast.name < endDate) {
          tmpCollection[j].series.push(
            ChartUtils.getSeriesEntry(endDate, tmpCollection[j].series[tmpCollection[j].series.length - 1].value)
          );
        }
      }
    }
  }

  setLineChartLabel(i18n: string) {
    this.translate.get(i18n).subscribe((translated) => {
      this.lineChartLabel = translated;
    });
  }
}