import { Component, OnInit, NgModule } from '@angular/core';
import { Platform, Events, MenuController } from '@ionic/angular';
import { CommonService } from 'src/app/hmg-common/services/common/common.service';
import { TranslatorService } from 'src/app/hmg-common/services/translator/translator.service';
import { AuthenticationService } from 'src/app/hmg-common/services/authentication/authentication.service';
import { DashboredService } from 'src/app/hmg-common/services/dashbored/dashbored.service';
import { PerformanceAppraisalResponse } from 'src/app/hmg-common/services/dashbored/performance-appraisal.response';
// import { DomSanitizer } from '@angular/platform-browser';
// import {NgxGaugeModule} from 'ngx-gauge';
import { AuthenticatedUser } from 'src/app/hmg-common/services/authentication/models/authenticated-user';



@Component({
  selector: 'app-performance-evaluation',
  templateUrl: './performance-evaluation.component.html',
  styleUrls: ['./performance-evaluation.component.scss'],
})
export class PerformanceEvaluationComponent implements OnInit {
  personalInfo: any;
  user_image: any = '../assets/imgs/profile.png';
  setImage: any;
  view: any = [380, 450];
  public performanceData: any = [];
  public length;
  public direction: string;
  //  public showText:boolean =false;

  constructor(public ts: TranslatorService,
    public cs: CommonService,
    public DS: DashboredService,
    public authService: AuthenticationService,
    //  private events: Events,
    //  private sanitizer: DomSanitizer,

  ) {
    this.direction = TranslatorService.getCurrentDirection();
    // this.events.subscribe("img-change", displayImg => {
    //   console.log("app compont: "+displayImg);
    //   this.user_image = this.sanitizer.bypassSecurityTrustUrl("data:Image/*;base64,"+displayImg);

    // });


  }


  colorScheme = {
    domain: ['#22C6B3', '#094875', '#3CB9D5', '#1FA269', '#0D155E']
  };

  ngOnInit() {


    this.getProfile();

    this.performanceData = this.cs.sharedService.getSharedData(
      PerformanceAppraisalResponse.PERFORMANCE_DATA,
      true
    );
    console.log(this.performanceData.length);
    //i % 2 == 0
    this.length = this.performanceData.length;

    for (let i = 0; i < this.performanceData.length; i++) {
      this.performanceData[i].color = this.colorScheme.domain[i];
      console.log(i + ' : ' + this.performanceData[i].name)

    }
    console.log(this.performanceData[0].color)

  }

  ngAfterViewInit() {
    document.querySelector('svg .gauge.chart > text').remove();
  }

  getProfile() {
    console.log('getProfile');
    this.authService
      .loadAuthenticatedUser()
      .subscribe((user: AuthenticatedUser) => {
        if (user) {
          this.personalInfo = user;
          this.user_image = user.EMPLOYEE_IMAGE
            ? 'data:image/png;base64,' + user.EMPLOYEE_IMAGE
            : '../assets/imgs/profile.png';


        }
      });
  }

}
