import { Component, Input } from '@angular/core';
import { CommonModule } from '@angular/common';
import { Spell } from 'src/interfaces/spell';
import { ModalService } from 'src/services/modal/modal.service';

@Component({
  selector: 'app-favorite-spells-modal',
  templateUrl: './favorite-spells-modal.component.html',
  styleUrl: './favorite-spells-modal.component.scss',
})
export class FavoriteSpellsModalComponent {
  @Input() public preparedSpells: Spell[] = [];
  @Input() public selectedSpells: Spell[] = [];
  @Input() public spellAttackBonus: string = '0';
  @Input() public spellSaveDC: number = 0;

  checkedSpells: boolean[] = [];

  public attributes: any = {
    strength: 'STR',
    dexterity: 'DEX',
    constitution: 'CON',
    intelligence: 'INT',
    wisdom: 'WIS',
    charisma: 'CHA',
  };

  public areas: any = {
    cone: 'Kegel',
    sphere: 'Kugel',
    circle: 'Kreis',
    line: 'Linie',
    square: 'Quadrat',
    cube: 'Würfel',
  };

  public constructor(private modalAccessor: ModalService) {}

  public ngOnInit(): void {
    this.checkedSpells = Array(this.preparedSpells.length).fill(false);
    this.preparedSpells.forEach((spell, index) => {
      this.checkedSpells[index] = this.selectedSpells.some(
        (selectedSpell) => selectedSpell.id === spell.id
      );
    });
  }

  public update(): void {
    const spells: Spell[] = this.preparedSpells.filter(
      (spell, index) => this.checkedSpells[index]
    );
    this.modalAccessor.handleModalClosing('update', spells);
    this.checkedSpells = [];
  }

  public cancel(): void {
    this.modalAccessor.handleModalClosing('cancel', undefined);
    this.checkedSpells = [];
  }
}