import { Component, OnInit, Input, NgZone, Output, EventEmitter } from '@angular/core';
import { MainPageService } from '../../main-page/main-page.service';
import { ReleaseModel } from '../../models/dictionaries/release.model';

@Component({
  selector: 'app-release-select',
  templateUrl: './release-select.component.html',
  styleUrls: ['./release-select.component.scss']
})
export class ReleaseSelectComponent implements OnInit {
  public releaseArray = []; 
  public releaseId: string;
  public disable: boolean;

  @Input() set ReleaseArray(value: ReleaseModel[]) {
    if (value.length > 0) {
      this.releaseArray.push({ _id: '0', name: 'None'});
      value.forEach((x) => { this.releaseArray.push({ _id: x._id, name: x.name}); });
      this.convertArrayToSelect(value);
    }
  }

  @Input() set active(value: string) {
    this.releaseId = value;
    if (this.releaseId === null || this.releaseId.length < 1) {
      this.zone.run(() => {
        this.releaseId = '0';
      });
    }
  }

  @Input() set disabled(value: boolean) {
    this.disable = value;
  }

  @Output() selected = new EventEmitter<string>();

  selectOptionsArray = new Array<string>();

  constructor(private mainPageService: MainPageService, private zone: NgZone) { }

  ngOnInit() {

  }

  convertArrayToSelect(releasesArray) {
    const uncheckedIcon = '&#xf0c8;';
    const checkedIcon = '&#xf14a;';
    const equationIcon = '&#xf2d7;';
    let selectOption: string = '';
    let optionNumber: number = 1;
    let icon: string;
    this.selectOptionsArray  = new Array<string>();
    this.selectOptionsArray.push('None');
    releasesArray.forEach(element => {
      selectOption = selectOption.concat(optionNumber.toString());
      selectOption = selectOption.concat(' | ');
      if (!element.isUxSet) {
        selectOption = selectOption.concat(uncheckedIcon);
      } else {
        icon = (element.valueUx === 0) ? checkedIcon : equationIcon;
        selectOption = selectOption.concat(icon);
      }
      if (!element.isUySet) {
        selectOption = selectOption.concat(uncheckedIcon);
      } else {
        icon = (element.valueUy === 0) ? checkedIcon : equationIcon;
        selectOption = selectOption.concat(icon);
      }
      if (!element.isUzSet) {
        selectOption =  selectOption.concat(uncheckedIcon);
      } else {
        icon = (element.valueUz === 0) ? checkedIcon : equationIcon;
        selectOption = selectOption.concat(icon);
      }

      selectOption =  selectOption.concat(' | ');
      if (!element.isPhixSet) {
        selectOption =  selectOption.concat(uncheckedIcon);
      } else {
        icon = (element.valuePhix === 0) ? checkedIcon : equationIcon;
        selectOption = selectOption.concat(icon);
      }
      if (!element.isPhiySet) {
        selectOption =  selectOption.concat(uncheckedIcon);
      } else {
        icon = (element.valuePhiy === 0) ? checkedIcon : equationIcon;
        selectOption = selectOption.concat(icon);
      }
      if (!element.isPhizSet) {
        selectOption =  selectOption.concat(uncheckedIcon);
      } else {
        icon = (element.valuePhiz === 0) ? checkedIcon : equationIcon;
        selectOption = selectOption.concat(icon);
      }
      selectOption = selectOption.concat(' | ');
      selectOption = selectOption.concat(element.name);

     this.selectOptionsArray.push(selectOption);
      selectOption = '';
      optionNumber++;
    });
  }

  setSelectedValue() {
    this.selected.emit(this.releaseId);
  }
}