import { Component } from '@angular/core';
import { DataService } from 'src/services/data/data.service';
import { NgxSmartModalService } from 'ngx-smart-modal';

@Component({
  selector: 'spellslots',
  templateUrl: './spellslots.component.html',
  styleUrls: ['./spellslots.component.scss'],
})
export class SpellslotsComponent {
  public constructor(
    public dataAccessor: DataService,
    public ngxSmartModalService: NgxSmartModalService
  ) {}

  public spellslots: any[] = [];
  public showSpellslots: boolean = false;
  public kiPoints: any;

  public slotNumber: number = 1;

  public ngOnInit(): void {
    const spells = this.dataAccessor.getSpellslots();
    const kiPoints = this.dataAccessor.getKiPoints();
    this.spellslots = spells.spellslots;
    this.showSpellslots = spells.showSpellslots;
    this.kiPoints = kiPoints;
  }

  public ngAfterViewInit(): void {
    setTimeout(() => {
      this.spellslots.forEach((_, levelIndex) => {
        this.correctSpellslotsView(levelIndex);
      });
      this.correctKiPointsView();
    }, 200);
  }

  //////////////

  // ki points

  public handleUsedKiPoints(pointIndex: number, eventTarget: any): void {
    if (eventTarget.checked) {
      this.kiPoints.usedPoints++;
      if (pointIndex + 1 !== this.kiPoints.usedPoints) {
        this.correctKiPointsView();
      }
    } else {
      this.kiPoints.usedPoints--;
      if (pointIndex !== this.kiPoints.usedPoints) {
        this.correctKiPointsView();
      }
    }
    this.updateKiPointsDatabase();
  }

  private correctKiPointsView(): void {
    const totalKiPoints = this.kiPoints.totalPoints;
    const usedKiPoints = this.kiPoints.usedPoints;
    for (let kiIndex = 0; kiIndex < usedKiPoints; kiIndex++) {
      setTimeout(() => {
        (
          document.getElementById('checkbox' + kiIndex) as HTMLInputElement
        ).checked = true;
      });
    }
    for (let kiIndex = usedKiPoints; kiIndex < totalKiPoints; kiIndex++) {
      setTimeout(() => {
        (
          document.getElementById('checkbox' + kiIndex) as HTMLInputElement
        ).checked = false;
      });
    }
  }

  // spellslots

  public handleUsedSlots(
    levelIndex: number,
    slotIndex: number,
    eventTarget: any
  ) {
    // if now checked, it means the slot was just used.
    if (eventTarget.checked) {
      this.spellslots[levelIndex].usedSlots++;
      if (slotIndex + 1 !== this.spellslots[levelIndex].usedSlots) {
        this.correctSpellslotsView(levelIndex);
      }
    } else {
      this.spellslots[levelIndex].usedSlots--;
      if (slotIndex !== this.spellslots[levelIndex].usedSlots) {
        this.correctSpellslotsView(levelIndex);
      }
    }
    this.updateSpellslotDatabase();
  }

  public correctSpellslotsView(levelIndex: number): void {
    const totalSlots = this.spellslots[levelIndex].totalSlots;
    const usedSlots = this.spellslots[levelIndex].usedSlots;
    for (let slotIndex = 0; slotIndex < usedSlots; slotIndex++) {
      setTimeout(() => {
        (
          document.getElementById(
            'checkbox' + levelIndex + '-' + slotIndex
          ) as HTMLInputElement
        ).checked = true;
      });
    }
    for (let slotIndex = usedSlots; slotIndex < totalSlots; slotIndex++) {
      setTimeout(() => {
        (
          document.getElementById(
            'checkbox' + levelIndex + '-' + slotIndex
          ) as HTMLInputElement
        ).checked = false;
      });
    }
  }

  // general

  public getArray(length: number): any[] {
    return Array.from({ length: length });
  }

  public isNotEmptyObject(obj: object): boolean {
    return Object.keys(obj).length !== 0;
  }

  public updateSpellslotDatabase(): void {
    this.dataAccessor.setSpellslots({
      spellslots: this.spellslots,
      showSpellslots: this.showSpellslots,
    });
  }

  public updateKiPointsDatabase(): void {
    this.dataAccessor.setKiPoints(this.kiPoints);
  }

  public openSpellslotModal(): void {
    this.ngxSmartModalService.getModal('spellslotsModal').open();
  }

  public updateSlotsAndPoints(data: any): void {
    console.log(data.spellslots.spellslots);
    this.spellslots = data.spellslots.spellslots;
    this.showSpellslots = data.spellslots.showSpellslots;
    this.kiPoints = data.kiPoints.kiPoints;

    setTimeout(() => {
      this.spellslots.forEach((_, levelIndex) => {
        this.correctSpellslotsView(levelIndex);
      });
      this.correctKiPointsView();
    }, 200);

    this.updateSpellslotDatabase();
    this.updateKiPointsDatabase();
  }
}