import { Component, OnInit, Input, Output,EventEmitter } from '@angular/core';
import { InputSwitchModule } from 'primeng/inputswitch';
import { CommonService } from '../shared/service/common.service';
import { ILocalisation } from '../shared/core/ILocalisation';
import { ILanguage } from '../shared/core/ILanguage';
import { IDateFormat } from '../shared/core/IDateFormat';
import { ITimeFormat } from '../shared/core/ITimeFormat';
import { ICalendarStart } from '../shared/core/ICalendarStart';
import { ITimeZone } from '../shared/core/ITimeZone';
import { LocalisationSection } from '../shared/core/localisation-section.enum';


@Component({
  selector: 'app-localisation',
  templateUrl: './localisation.component.html',
  styleUrls: ['./localisation.component.css'],
  providers: [CommonService]
})
export class LocalisationComponent implements OnInit {

  @Input() staffId: number;
  @Input() section: string;
  currentTime: string;
  currentDate: string;
  @Input() localisationId: number = 0;
  @Input() organisationId: number = 0;
  localisation: ILocalisation;
  selectedLanguage: ILanguage;
  selectedDateFormat: IDateFormat;
  selectedTimeFormat: ITimeFormat;
  selectedCalendarStart: ICalendarStart;
  selectedTimeZone: ITimeZone;
  enableStaffPersonalise: boolean = false;

  //this var use to keep modified localisation data
  newLocalisationData: ILocalisation;

  @Output() bindLocalisation : EventEmitter<ILocalisation> = new EventEmitter();


  constructor(private commonService: CommonService) { }

  ngOnInit() {
    // initialize component
    this.localisation = {
      Languages: [{ Id: 0, Code: '', IsSelected: false, Name: '' }],
      DateFormat: [{ Id: 0, Format: '', IsSelected: false }],
      TimeFormat: [{ Id: 0, TimeFormat: '', IsSelected: false }],
      CalendarStart: [{ Id: 0, Name: '', IsSelected: false }],
      TimeZone: [{ Id: 0, TimeZone: '', IsSelected: false }],
      CurrentDateTime: ''
    }

    //initialze new localisation property
    this.newLocalisationData = {
      Languages: [{ Id: 0, Code: '', IsSelected: false, Name: '' }],
      DateFormat: [{ Id: 0, Format: '', IsSelected: false }],
      TimeFormat: [{ Id: 0, TimeFormat: '', IsSelected: false }],
      CalendarStart: [{ Id: 0, Name: '', IsSelected: false }],
      TimeZone: [{ Id: 0, TimeZone: '', IsSelected: false }],
      CurrentDateTime: ''
    }

    if (this.staffId && this.staffId > 0) {
      // get localisation setting of the particular organisation or staff
      this.getLocalisationSettings(this.staffId, this.section);
    } else {
      // get localisation setting of the particular organisation or staff
      this.getLocalisationSettings(this.organisationId, this.section);
    }

  }

  // get localisation settings from backend
  getLocalisationSettings(id: number, section: string) {
    
    this.commonService.getLocalisationSettings(id, section).subscribe(localisation => {
      this.localisation = localisation;

      if (localisation != undefined && localisation != null) {
        // bind selected language
        this.selectedLanguage = (localisation.Id > 0) ? localisation.Languages.find(x => x.IsSelected == true) :localisation.Languages[0];
        //bind selected date format
        this.selectedDateFormat =  (localisation.Id > 0) ? localisation.DateFormat.find(x => x.IsSelected == true):localisation.DateFormat[0];
        //bind selected time format
        this.selectedTimeFormat =  (localisation.Id > 0) ? localisation.TimeFormat.find(x => x.IsSelected == true):localisation.TimeFormat[0];
        //bind selected calendar start
        this.selectedCalendarStart =  (localisation.Id > 0) ? localisation.CalendarStart.find(x => x.IsSelected == true):localisation.CalendarStart[0];
        //bind selected time zone
        this.selectedTimeZone = (localisation.Id > 0) ? localisation.TimeZone.find(x => x.IsSelected == true):localisation.TimeZone[0];

        // Bug67-: "Allow staff to personalise the preference settings" button should be switch on as default 
        if(section == LocalisationSection.OrganisationSection && this.organisationId ==0){
          this.localisation.AllowPersonalise = true;
        }
      }
    });
  }

  //this method use to check the component is accessing by staff or organisation
  isOrganisation() {
    return (this.section === LocalisationSection.OrganisationSection) ? true : false
  }

  //this method will keep  newLocalisation object updated with modified data
  getNewLocalisationSettings() {
    this.newLocalisationData.Id =  this.localisation.Id;
    this.newLocalisationData.Languages[0] = (this.selectedLanguage);
    this.newLocalisationData.DateFormat[0] = (this.selectedDateFormat);
    this.newLocalisationData.TimeFormat[0] = (this.selectedTimeFormat);
    this.newLocalisationData.CalendarStart[0] = (this.selectedCalendarStart);
    this.newLocalisationData.TimeZone[0] = (this.selectedTimeZone);

    this.bindLocalisation.emit(this.newLocalisationData);
  }
}