import { Component, Input } from '@angular/core';

@Component({
  selector: 'icon',
  templateUrl: './icon.component.html',
  styleUrls: ['./icon.component.scss'],
})
export class IconComponent {
  // private constructor() {
  //   this.iconUrl = this.iconPrefix + this.icon + 'Damage.svg';
  // }
  @Input() public icon: string = '';
  @Input() public size: string = '';
  @Input() public type: string = '';
  @Input() public class: string = '';
  private damageIconPrefix: string = 'assets/icons/damageIcons/';
  private weaponIconPrefix: string = 'assets/icons/weaponIcons/';
  private UIIconPrefix: string = 'assets/icons/UIIcons/';
  private spellIconPrefix: string = 'assets/icons/spellIcons/';
  public iconUrl: string = '';

  ngOnChanges() {
    if (this.type === 'damage') {
      this.iconUrl = this.damageIconPrefix + this.icon + '.svg';
    } else if (this.type === 'weapon') {
      this.iconUrl = this.weaponIconPrefix + this.icon + '.svg';
    } else if (this.type === 'UI') {
      this.iconUrl = this.UIIconPrefix + this.icon + '.svg';
    } else if (this.type === 'spell') {
      this.iconUrl = this.spellIconPrefix + this.icon + '.svg';
    }
  }
}
