import { Component } from '@angular/core';
import { DataService } from 'src/services/data/data.service';
import { Router } from '@angular/router';
import { Character } from 'src/interfaces/character';

@Component({
  selector: 'app-character-picker',
  templateUrl: './character-picker.component.html',
  styleUrls: ['./character-picker.component.scss'],
})
export class CharacterPickerComponent {
  public constructor(public dataService: DataService, private Router: Router) {
    this.getCharacters();
  }

  public characters: string[] = [];
  public index = 0;

  public getCharacters() {
    this.dataService.getCollection('characters').then((characters: any) => {
      characters.forEach((character: any) => {
        this.characters.push(character.name);
      });
    });
  }

  public addCharacter() {
    this.Router.navigate(['character/creator']);
  }

  public selectCharacter(character: string) {
    this.dataService.selectCharacter(character);
  }
}
