import {ChangeDetectionStrategy, Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
import {Rank} from '../../../models/model-interfaces';
import {Fraction} from '../../../utils/fraction.enum';

@Component({
  selector: 'cc-rank-item',
  templateUrl: './rank-item.component.html',
  styleUrls: ['./rank-item.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class RankItemComponent implements OnInit {

  @Input() selected: boolean;

  @Input() rank: Rank;

  @Output() rankSelected = new EventEmitter();

  @Output() rankDelete = new EventEmitter();

  imageSrc;

  readonly fraction = Fraction;

  constructor() {
  }

  ngOnInit() {
    this.imageSrc = 'resource/rank/' + this.rank._id + '.png?' + Date.now();
  }

  select() {
    this.rankSelected.emit(this.rank._id);
  }

  delete() {
    this.rankDelete.emit(this.rank);
  }

}