init data on highscore
							parent
							
								
									d0bf863fb2
								
							
						
					
					
						commit
						651401787e
					
				| 
						 | 
				
			
			@ -14,5 +14,10 @@ export class PlayerService {
 | 
			
		|||
      .map(res => res.json())
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  getCampaignHighscore(campaignId: string) {
 | 
			
		||||
    return this.http.get(this.config.apiPlayersPath + '/ranking/' + campaignId)
 | 
			
		||||
      .map(res => res.json())
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,45 +1,22 @@
 | 
			
		|||
import {Component} from "@angular/core";
 | 
			
		||||
import {ActivatedRoute} from "@angular/router";
 | 
			
		||||
import {CarouselConfig} from "ngx-bootstrap";
 | 
			
		||||
import {PlayerService} from "../../services/logs/player.service";
 | 
			
		||||
import {CampaignService} from "../../services/logs/campaign.service";
 | 
			
		||||
import {ChartUtils} from "../../utils/chart-utils";
 | 
			
		||||
import {Fraction} from "../../utils/fraction.enum";
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@Component({
 | 
			
		||||
  selector: 'stats-highscore',
 | 
			
		||||
  templateUrl: './highscore.component.html',
 | 
			
		||||
  styleUrls: ['./highscore.component.css', '../../style/list-entry.css', '../../style/overview.css'],
 | 
			
		||||
  inputs: ['campaigns'],
 | 
			
		||||
  providers: [{provide: CarouselConfig, useValue: {interval: false}}]
 | 
			
		||||
  inputs: ['campaigns']
 | 
			
		||||
})
 | 
			
		||||
export class StatisticHighScoreComponent {
 | 
			
		||||
 | 
			
		||||
  id = "";
 | 
			
		||||
  title = "";
 | 
			
		||||
 | 
			
		||||
  pointData: any[] = [];
 | 
			
		||||
  pointSumData: any[] = [];
 | 
			
		||||
  playerData: any[] = [];
 | 
			
		||||
  currentData: any[] = [];
 | 
			
		||||
  activeSlideIndex;
 | 
			
		||||
 | 
			
		||||
  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 playerService: PlayerService,
 | 
			
		||||
              private campaignService: CampaignService) {
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			@ -49,109 +26,22 @@ export class StatisticHighScoreComponent {
 | 
			
		|||
      .subscribe((id) => {
 | 
			
		||||
        this.id = id;
 | 
			
		||||
        if (this.campaignService.campaigns) {
 | 
			
		||||
          this.initWars(this.campaignService.campaigns);
 | 
			
		||||
          this.initData();
 | 
			
		||||
        } else {
 | 
			
		||||
          this.campaignService.getAllCampaigns().subscribe(campaigns => {
 | 
			
		||||
            this.initWars(campaigns);
 | 
			
		||||
            this.initData()
 | 
			
		||||
          })
 | 
			
		||||
        }
 | 
			
		||||
      });
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  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.title = "Gesamtübersicht";
 | 
			
		||||
          wars.sort((a, b) => {
 | 
			
		||||
            // sort by dates, because older campaign can contain newer war
 | 
			
		||||
            if (a['date'] > (b['date'])) return -1;
 | 
			
		||||
            if (a['date'] < (b['date'])) return 1;
 | 
			
		||||
            return 0;
 | 
			
		||||
          })
 | 
			
		||||
        } else {
 | 
			
		||||
          this.title = campaign.title;
 | 
			
		||||
        }
 | 
			
		||||
        this.initChart(wars);
 | 
			
		||||
      }
 | 
			
		||||
  initData() {
 | 
			
		||||
    this.title = this.campaignService.campaigns
 | 
			
		||||
      .filter(camp => camp._id === this.id).pop().title;
 | 
			
		||||
 | 
			
		||||
    this.playerService.getCampaignHighscore(this.id).subscribe(players => {
 | 
			
		||||
      console.log(players);
 | 
			
		||||
    })
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  goToSlide(index: number) {
 | 
			
		||||
    switch (index) {
 | 
			
		||||
      case 0:
 | 
			
		||||
        this.currentData = this.pointSumData;
 | 
			
		||||
        this.yAxisLabel = "Gesamtpunkte";
 | 
			
		||||
        break;
 | 
			
		||||
      case 1:
 | 
			
		||||
        this.currentData = this.pointData;
 | 
			
		||||
        this.yAxisLabel = "Punkte";
 | 
			
		||||
        break;
 | 
			
		||||
      case 2:
 | 
			
		||||
        this.currentData = this.playerData;
 | 
			
		||||
        this.yAxisLabel = "Anzahl Spieler";
 | 
			
		||||
        break;
 | 
			
		||||
    }
 | 
			
		||||
    this.activeSlideIndex = index;
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  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 warDateString = ChartUtils.getShortDateString(wars[i].date);
 | 
			
		||||
 | 
			
		||||
      pointsObj[0].series.push({
 | 
			
		||||
        name: warDateString,
 | 
			
		||||
        value: wars[i].ptBlufor
 | 
			
		||||
      });
 | 
			
		||||
      pointsObj[1].series.push({
 | 
			
		||||
        name: warDateString,
 | 
			
		||||
        value: wars[i].ptOpfor
 | 
			
		||||
      });
 | 
			
		||||
      pointsSumObj[0].series.push({
 | 
			
		||||
        name: warDateString,
 | 
			
		||||
        value: pointsSumObj[0].series[j - 1] ?
 | 
			
		||||
          pointsSumObj[0].series[j - 1].value + wars[i].ptBlufor :
 | 
			
		||||
          wars[i].ptBlufor
 | 
			
		||||
      });
 | 
			
		||||
      pointsSumObj[1].series.push({
 | 
			
		||||
        name: warDateString,
 | 
			
		||||
        value: pointsSumObj[1].series[j - 1]
 | 
			
		||||
          ? pointsSumObj[1].series[j - 1].value + wars[i].ptOpfor :
 | 
			
		||||
          wars[i].ptOpfor
 | 
			
		||||
      });
 | 
			
		||||
      playersObj[0].series.push({
 | 
			
		||||
        name: warDateString,
 | 
			
		||||
        value: wars[i].playersBlufor
 | 
			
		||||
      });
 | 
			
		||||
      playersObj[1].series.push({
 | 
			
		||||
        name: warDateString,
 | 
			
		||||
        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);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  isActiveSlide(index) {
 | 
			
		||||
    return this.activeSlideIndex === index ? '#d9edf7' : 'white'
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
}
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -1,6 +1,5 @@
 | 
			
		|||
import {Component} from "@angular/core";
 | 
			
		||||
import {ActivatedRoute} from "@angular/router";
 | 
			
		||||
import {CarouselConfig} from "ngx-bootstrap";
 | 
			
		||||
import {CampaignService} from "../../services/logs/campaign.service";
 | 
			
		||||
import {ChartUtils} from "../../utils/chart-utils";
 | 
			
		||||
import {Fraction} from "../../utils/fraction.enum";
 | 
			
		||||
| 
						 | 
				
			
			@ -10,8 +9,7 @@ import {Fraction} from "../../utils/fraction.enum";
 | 
			
		|||
  selector: 'stats-overview',
 | 
			
		||||
  templateUrl: './stats-overview.component.html',
 | 
			
		||||
  styleUrls: ['./stats-overview.component.css', '../../style/list-entry.css', '../../style/overview.css'],
 | 
			
		||||
  inputs: ['campaigns'],
 | 
			
		||||
  providers: [{provide: CarouselConfig, useValue: {interval: false}}]
 | 
			
		||||
  inputs: ['campaigns']
 | 
			
		||||
})
 | 
			
		||||
export class StatisticOverviewComponent {
 | 
			
		||||
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
		Loading…
	
		Reference in New Issue