import { Component, Input } from '@angular/core';
import { Skill, Attribute } from 'src/interfaces/interfaces';
import { DataService } from 'src/services/data/data.service';
import { DetailsService } from 'src/services/details/details.service';
import { Observable } from 'rxjs';
import { SkillDetailsComponent } from '../skill-details/skill-details.component';
import { TranslateService } from '@ngx-translate/core';

@Component({
  selector: 'app-skill-field',
  templateUrl: './skill-field.component.html',
  styleUrls: ['./skill-field.component.scss'],
})
export class SkillFieldComponent {
  @Input() skillName: string = '';
  public skill: Skill = { name: '', proficiency: false, advantage: 'none' };
  private attribute: Attribute = { name: '', value: 0, proficiency: false };
  public skillModifier: string = '0';
  public skillProficiency: boolean = false;
  private proficiencyBonus: number = 0;

  public constructor(
    public dataAccessor: DataService,
    public detailsAccessor: DetailsService,
    public translate: TranslateService,
  ) {}

  ngOnInit(): void {
    this.initProficiencySubscription();
    this.initAttributeSubscription();
    this.initSkillSubscription();
  }

  private initAttributeSubscription(): void {
    const attribute = this.translate.instant(
      'skillsAttributes.' + this.skillName,
    );
    const observable: Observable<Attribute> = eval(
      `this.dataAccessor.${attribute}$`,
    );
    observable.subscribe((newValue: Attribute) => {
      this.attribute = newValue;
      this.skillModifier = this.calculateModifier();
    });
  }

  private initSkillSubscription(): void {
    const observable: Observable<Skill> = eval(
      `this.dataAccessor.${this.skillName}$`,
    );
    observable.subscribe((newValue: Skill) => {
      this.skill = newValue;
      // MIGRATION: Add default value for advantage
      if (this.skill.advantage === undefined) {
        this.skill.advantage = 'none';
      }
      this.skillProficiency = this.skill.proficiency;
      this.skillModifier = this.calculateModifier();
    });
  }

  private initProficiencySubscription(): void {
    this.dataAccessor.proficiency$.subscribe((newValue: any) => {
      this.proficiencyBonus = newValue;
      this.skillModifier = this.calculateModifier();
    });
  }

  public updateValue(): void {
    this.dataAccessor.updateSkill({
      name: this.skillName,
      proficiency: this.skillProficiency,
      advantage: this.skill.advantage,
    });
  }

  public calculateModifier(): string {
    let mod: number = Math.floor((this.attribute.value - 10) / 2);
    if (this.skillProficiency) {
      mod += this.proficiencyBonus;
    }
    if (mod > 0) {
      return '+' + mod;
    } else {
      return mod.toString();
    }
  }

  public openDetails(): void {
    this.detailsAccessor.openPanel(SkillDetailsComponent, {
      skillName: this.skillName,
      skillModifier: this.skillModifier,
      advantage: this.skill.advantage,
    });
    const resultSubscription = this.detailsAccessor.result$.subscribe(
      (result) => {
        if (result.state === 'update') {
          this.skill.advantage = result.data.advantage;
          this.updateValue();
        }
        resultSubscription.unsubscribe();
      },
    );
  }
}
