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

@Component({
  selector: 'app-jr-tiles',
  templateUrl: './jr-tiles.component.html',
  styleUrls: ['./jr-tiles.component.scss']
})
export class JrTilesComponent implements OnInit {


  @Input() jrTilesData: any;
  @Input() jrTilesIndex: number;
  othIcons : boolean = false;
  toDeleteData: any

  @Output() jrEditEvent = new EventEmitter<any>();
  @Output() jrDeleteEvent = new EventEmitter();

  myColor = ["#009587", "#01BCD5", "#663AB7", "#E6A9E6", "#3F51B5", "#F8A9CA", "#6FDCDE", "#F2D2CD", "#F2CCDB", "#BFE2F5", "#D8D0F7", "#6FDCDE", "#EC8ECC", "#009587", "#01BCD5", "#663AB7", "#E6A9E6", "#3F51B5", "#F8A9CA", "#6FDCDE", "#F2D2CD", "#F2CCDB", "#BFE2F5", "#D8D0F7", "#6FDCDE", "#EC8ECC"];
  colors = ["#009587", "#01BCD5", "#663AB7", "#E6A9E6", "#3F51B5", "#F8A9CA", "#6FDCDE", "#F2D2CD", "#F2CCDB", "#BFE2F5", "#D8D0F7", "#6FDCDE", "#EC8ECC"];

  constructor() { }

  ngOnInit() {
    // console.log('jrTilesData  -- ',this.jrTilesData);
  }
  Initials(xitem: string) {
    if (xitem) {
      return xitem.replace(/\W*(\w)\w*/g, '$1').toUpperCase();
    }
  }

  showOtherIcons(id){
    this.othIcons = true;
  }

  editJobRequirement(id, jrTilesData){
    this.jrEditEvent.emit(jrTilesData);
  }

  deleteJobRequirement(id, jrTilesData){
    this.toDeleteData = {}
    this.toDeleteData.id = id;
    this.toDeleteData.isDelete = true;
    this.jrDeleteEvent.emit(this.toDeleteData);
  }
}
