import { Component, OnDestroy, OnInit } from '@angular/core';
import { EventService } from "../../../services/event.service";
import { Subject } from "rxjs";
import { map, takeUntil } from "rxjs/operators";
import {EventGameQueue, QueueTypes, VersusBeginEvent} from "../../../../types/server-event";
import { ApiService } from "../../../services/api.service";

@Component({
  selector: 'app-queue-actions',
  templateUrl: './queue-actions.component.html',
  styleUrls: ['./queue-actions.component.scss']
})
export class QueueActionsComponent implements OnInit, OnDestroy {
  destroyed$ = new Subject<void>()
  constructor(private eventService: EventService, private apiService: ApiService) { }
  gameQueue: EventGameQueue | null;
  versusData: VersusBeginEvent| null = null;
  ngOnInit(): void {
    this.eventService.gameQueueEvent.pipe(
        takeUntil(this.destroyed$),
        map(e => e.data),
    ).subscribe(e => {
      this.gameQueue = e;
    });
   this.setVersusHandler();
  }

  setVersusHandler() {
    this.eventService.versusBegin.pipe(takeUntil(this.destroyed$)).subscribe((r) => {
      this.versusData = r.data;

    });

  }

  ngOnDestroy() {
    this.destroyed$.complete();
  }

  markAsCompleted(_id: string) {
    this.apiService.markQueueAsCompleted(_id).subscribe((r) => {
      // this.gameQueue = null;
    })
  }

  versusWon(playerId: number, loser: number) {
    this.apiService.completeVersus(playerId, loser).subscribe(r => {
      this.versusData = null;
    })
  }
}
