import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'heatmap',
  templateUrl: './heatmap.component.html',
  styleUrls: ['./heatmap.component.css']
})
export class HeatmapComponent implements OnInit {

  apiKey = "RGAPI-28103ca1-6e15-4af1-90fb-bb084909498f";
  getUrl = "http://localhost/riot_get.php?get_string=";

  accountId = ""
  gameId = 0;
  playerPosition: [int, int] = [0,0];
  summonerName = "TN5 Celestial";


  getSummonerIdByName(): void{
    let url = this.getUrl + "summoner/v4/summoners/by-name/" + this.summonerName + "&api_key=" + this.apiKey;

    this.http
      .get(url)
        .subscribe(responseData =>{
          console.log(responseData.accountId);
          this.accountId = responseData.accountId;
        });
  }

  getMatchListByAccountId(): void{
    let url = this.getUrl + "match/v4/matchlists/by-account/" + this.accountId + "&api_key=" + this.apiKey;

    this.http
      .get(url)
        .subscribe(responseData =>{
          console.log(responseData);
          console.log(responseData.matches[0].gameId);
          this.gameId = responseData.matches[0].gameId;
        })
  }

  getTimelineByGameId(): void{
    let url = this.getUrl + "match/v4/timelines/by-match/" + this.gameId + "&api_key=" + this.apiKey;

    this.http
      .get(url)
        .subscribe(responseData =>{
          console.log(responseData)
          for (let i = 0; i < responseData.frames.length; i++) {
            this.playerPosition.push(responseData.frames[i].participantFrames[2].position);
          }
          console.log(this.playerPosition);
        })
  }

  constructor(private http: HttpClient) { }

  ngOnInit() {
  }

}