import { Component, Input } from '@angular/core';
import { Weapon } from 'src/interfaces/weapon';
import { Damage } from 'src/interfaces/damage';
import { ModalService } from 'src/services/modal/modal.service';
import { Editor } from 'ngx-editor';

@Component({
  selector: 'app-weapon-modal',
  templateUrl: './weapon-modal.component.html',
  styleUrl: './weapon-modal.component.scss',
})
export class WeaponModalComponent {
  public constructor(private modalAccessor: ModalService) {}
  @Input() public item: any;
  @Input() public isUpdate: boolean = false;

  public name: string = '';
  public range: number[] = [5, 5];
  public hasReach: boolean = false;
  public throwRange: number[] = [5, 5];
  public attackBonus: string = '+0';
  public damage: Damage[] = [{ diceNumber: '', diceType: '', damageType: '' }];
  public hasAdditionalDamage: boolean = false;
  public additionalDamage: number = 0;
  public useAttributeModifier: boolean = false;
  public proficient: boolean = false;
  public isVersatile: boolean = false;
  public isTwoHanded: boolean = false;
  public isFinesse: boolean = false;
  public isRanged: boolean = false;
  public versatileDamage: string = '';
  public canBeThrown: boolean = false;
  public weight: string = 'normal';
  public isMagical: boolean = false;
  public magicBonus: number = 0;
  public description: string = '';

  active = 'damage';
  editor: Editor = new Editor();
  html = '';
  toolbar: any = [
    // default value
    ['bold', 'italic'],
    ['bullet_list'],
    [{ heading: ['h3', 'h4', 'h5', 'h6'] }],
  ];

  // Options for the select boxes
  public weights: string[] = ['leicht', 'normal', 'schwer'];

  public damageTypes: string[] = [
    'bludgeoning',
    'piercing',
    'slashing',
    'acid',
    'cold',
    'fire',
    'force',
    'lightning',
    'necrotic',
    'poison',
    'psychic',
    'radiant',
    'thunder',
  ];

  public dice: string[] = ['W4', 'W6', 'W8', 'W10', 'W12', 'W20', 'W100'];

  public numbers: string[] = [
    '1',
    '2',
    '3',
    '4',
    '5',
    '6',
    '7',
    '8',
    '9',
    '10',
  ];

  public attackBonuses: string[] = [
    '-2',
    '-1',
    '+0',
    '+1',
    '+2',
    '+3',
    '+4',
    '+5',
    '+6',
    '+7',
    '+8',
    '+9',
    '+10',
    '+11',
    '+12',
    '+13',
    '+14',
    '+15',
    '+16',
    '+17',
    '+18',
    '+19',
    '+20',
  ];

  additonalDamages: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

  public magicBonuses: any[] = [
    { display: '+1', value: 1 },
    { display: '+2', value: 2 },
    { display: '+3', value: 3 },
    { display: '+4', value: 4 },
    { display: '+5', value: 5 },
  ];

  public ngOnInit(): void {
    if (this.isUpdate) {
      this.loadItem();
    }
  }

  public loadItem(): void {
    this.name = this.item.name;
    this.range = this.item.range;
    this.hasReach = this.item.hasReach;
    this.throwRange = this.item.throwRange;
    this.attackBonus = this.item.attackBonus;
    this.damage = this.item.damage;
    this.hasAdditionalDamage = this.item.hasAdditionalDamage;
    this.additionalDamage = this.item.additionalDamage;
    this.useAttributeModifier = this.item.useAttributeModifier;
    this.proficient = this.item.proficient;
    this.isVersatile = this.item.isVersatile;
    this.isTwoHanded = this.item.isTwoHanded;
    this.isFinesse = this.item.isFinesse;
    this.isRanged = this.item.isRanged;
    this.versatileDamage = this.item.versatileDamage;
    this.canBeThrown = this.item.canBeThrown;
    this.weight = this.item.weight;
    this.isMagical = this.item.isMagical;
    this.magicBonus = this.item.magicBonus;
    this.description = this.item.description;
  }

  // RESPONSES

  public cancel(): void {
    this.modalAccessor.handleModalClosing('cancel', undefined);
    this.resetItem();
  }

  public add(): void {
    console.log(this.createItem());
    this.modalAccessor.handleModalClosing('add', this.createItem());
    this.resetItem();
  }

  public update(): void {
    this.modalAccessor.handleModalClosing('update', this.createItem());
    this.resetItem();
  }

  public createItem(): Weapon {
    return {
      name: this.name,
      range: this.range,
      hasReach: this.hasReach,
      throwRange: this.throwRange,
      attackBonus: this.attackBonus,
      damage: this.damage,
      hasAdditionalDamage: this.hasAdditionalDamage,
      additionalDamage: this.additionalDamage,
      useAttributeModifier: this.useAttributeModifier,
      proficient: this.proficient,
      isVersatile: this.isVersatile,
      isTwoHanded: this.isTwoHanded,
      isFinesse: this.isFinesse,
      isRanged: this.isRanged,
      versatileDamage: this.versatileDamage,
      canBeThrown: this.canBeThrown,
      weight: this.weight,
      isMagical: this.isMagical,
      magicBonus: this.magicBonus,
      description: this.description,
    };
  }

  /**
   * Resets all values to their default values.
   */
  public resetItem(): void {
    this.name = '';
    this.range = [5, 5];
    this.hasReach = false;
    this.throwRange = [5, 5];
    this.attackBonus = '+0';
    this.damage = [{ diceNumber: '', diceType: '', damageType: '' }];
    this.hasAdditionalDamage = false;
    this.additionalDamage = 0;
    this.useAttributeModifier = false;
    this.proficient = false;
    this.isVersatile = false;
    this.isTwoHanded = false;
    this.isFinesse = false;
    this.isRanged = false;
    this.versatileDamage = '';
    this.canBeThrown = false;
    this.weight = 'normal';
    this.isMagical = false;
    this.magicBonus = 0;
    this.description = '';
  }

  // COMPONENT LOGIC

  public addDamage(): void {
    this.damage.push({ diceNumber: '', diceType: '', damageType: '' });
  }

  public removeDamage(index: number): void {
    this.damage.splice(index, 1);
  }
}