import { Component, AfterViewInit } from '@angular/core';
import { QuestionnaireService } from '../../../shared/services/questionnaire.service';
import { IPhaseSettings } from '../../../shared/core/Questionnaire/IPhaseSettings';
import { SharedBehaviorSubjectService } from '../../../shared/services/shared-behavior-subject.service';
import { ILayoutSettings } from '../../../shared/core/Questionnaire/ILayoutSettings';
import { Default } from '../../../shared/core/Default.enum';
import { SelectItem } from 'primeng/api';
import { IQuestionAnswerTypes } from '../../../shared/core/Questionnaire/IQuestionAnswerTypes';
// import { IQuestionAnswerTypes } from 'projects/ng-data-collection/src/lib/shared/core/Questionnaire/IQuestionAnswerTypes';



@Component({
  selector: 'app-phase-setting',
  templateUrl: './phase-setting.component.html',
  styleUrls: ['./phase-setting.component.css'],
  providers: [QuestionnaireService]
})
export class PhaseSettingComponent implements AfterViewInit {

  checked = true;
  // settingTypes: { label: string; value: string; }[];
  // QuestionAnswerTypes: { label: string; value: number; }[];
  // listItems: SelectItem[];

  listItems: SelectItem[] = [];
  headingFlag = true;
  textFlag = false;
  emailFlag = false;
  websiteUrlFlag = false;
  phoneNumberFlag = false;
  numbersFlag = false;
  amountFlag = false;
  singleMultipleChoiceFlag = false;
  opinionRatingScaleFlag = false;
  dateTimeFlag = false;
  yesNoFlag = false;
  fileUploadFlag = false;
  questionGroupFlag = false;
  settingsObject: any = null;
  // Type: IQuestionAnswerTypes;
  event: any = [];

  // Question Layout Settings
  questionLayoutSettingSingleQuestion = true;
  colNumber = 0;
  rowNumber = 0;
  isMultiple = false;

  ILayoutSettings: any = [];

  // Question Answwer Types
  questionAnswerType: IQuestionAnswerTypes[] = [];

  // questionAnswerType: SelectItem[];

  // Phase Settings
  phaseSettingTypes: IPhaseSettings[];
  // Type Id
  typeId: number;

  isTrigger: any;
  defaultFlag = true;
  Type: any;

  // Selected phase setting
  selectedPhaseSetting: boolean;

  // List items phase settings
  listPhaseSettingItems: SelectItem[] = [];

  // display settings
  displaySetting: boolean = false;

  // Place holder
  placeHolderText: string = 'Select';

  constructor(private sharedService: SharedBehaviorSubjectService,
    private questionnaireService: QuestionnaireService) {



    this.sharedService.settingsObjectSourceGet.subscribe((obj: any) => {

      this.settingsObject = obj;
      console.log('settingsObjectSourceGet', this.settingsObject);

      if (this.settingsObject !== null) {

        if (this.settingsObject.DefaultFlag === false) {
          this.defaultFlag = false;
        }
        //  console.log('Phase compo settingsObjectSourceGet', this.settingsObject.TypeId);

        // tslint:disable-next-line:prefer-for-of
        for (let index = 0; index < this.questionAnswerType.length; index++) {
          if (this.questionAnswerType[index].QuestionAnswerTypesId === this.settingsObject.TypeId) {
            this.Type = this.questionAnswerType[index];
          }
        }       

        this.Type.QuestionAnswerTypesId = this.settingsObject.TypeId;
        this.event = {
          value: {
            QuestionAnswerTypesId: this.settingsObject.TypeId
          }
        };
        this.onQuestionAnswerTypesChange(this.event);
      }
      // this.clickOnNewQuestion();
    });

    this.sharedService.settingsLayoutSourceGet.subscribe((obj: any) => {
      //  console.log('Phase compo settingsLayoutSourceGet', obj);
      this.ILayoutSettings = obj;
      if (this.ILayoutSettings) {
        if (this.ILayoutSettings.DefaultFlag === false) {
          this.defaultFlag = false;
        }
        // tslint:disable-next-line:no-debugger
        // tslint:disable-next-line:prefer-for-of
        for (let index = 0; index < this.questionAnswerType.length; index++) {
          if (this.questionAnswerType[index].QuestionAnswerTypesId === this.ILayoutSettings.TypeId) {
            this.Type = this.questionAnswerType[index];
          }
        }
        this.event = {
          value: {
            QuestionAnswerTypesId: this.ILayoutSettings.TypeId
          }
        };
        if (this.ILayoutSettings.TypeId > 0) {
          this.isMultiple = true;
        }
        this.onQuestionAnswerTypesChange(this.event);
      }
    });
  }









  colFocusOutEvent() {
    if (this.colNumber > 0 && this.rowNumber > 0) {
      const layoutObj: ILayoutSettings = {
        ColNumber: this.colNumber,
        RowNumber: this.rowNumber,
        Layout: 'MULTIPLE'
      };

      this.sharedService.settingsLayoutSource.next(layoutObj);
    }
  }



  ngAfterViewInit() {
    // Get All Quetion & Answer Types
    this.questionnaireService.GetAllIQuestionAnswerTypes().subscribe(
      data => {
        this.questionAnswerType = data;
        this.listItems = [];
        for (let i = 0; i < this.questionAnswerType.length; i++) {
          this.listItems.push(
            {
              disabled: false,
              label: this.questionAnswerType[i].IconName,
              value: this.questionAnswerType[i].Description
            }
          );
        }

        console.log('Question Answer Type:');
        console.log(this.questionAnswerType);
      }
    );

    // Get All Phase settings
    this.questionnaireService.GetAllPhaseSettingTypes().subscribe(
      data => {
        this.phaseSettingTypes = data;
        console.log(' Phase settings Type:');
        console.log(this.phaseSettingTypes);

        this.listPhaseSettingItems = [];
        for (let i = 0; i < this.phaseSettingTypes.length; i++) {
          this.listPhaseSettingItems.push(
            {
              disabled: false,
              label: this.phaseSettingTypes[i].IconName,
              value: this.phaseSettingTypes[i].Description
            }
          );
        }
      }
    );

    //  console.log('Values on ngAfterViewInit():');

    this.sharedService.setDefaultSettings.next(1);

  }

  onQuestionAnswerTypesChangeDropDown(e) {

    this.displaySetting = true;
    this.defaultFlag = true;
    //  console.log('Test boolean', this.Type)
    this.onQuestionAnswerTypesChange(e);
  }


  onQuestionAnswerTypesChange(e) {   
    debugger;  
    // if (e.value.QuestionAnswerTypesId !== undefined && e.value.QuestionAnswerTypesId !== null) {
    if (e.value !== undefined && e.value !== null) {

      // this.typeId = e.value.QuestionAnswerTypesId;

      if(e.value.QuestionAnswerTypesId === 1 || e.value === "Heading")
      {
        this.placeHolderText = "Heading";
        this.typeId = 1;
      } else if(e.value.QuestionAnswerTypesId === 2 || e.value === "Text") {
        this.placeHolderText = "Text";
        this.typeId = 2;
      } else if(e.value.QuestionAnswerTypesId === 3 || e.value === "Email Address") {
        this.placeHolderText = "Email Address";
        this.typeId = 3;
      } else if(e.value.QuestionAnswerTypesId === 4 || e.value === "Website URL") {
        this.placeHolderText = "Website URL";
        this.typeId = 4;
      } else if(e.value.QuestionAnswerTypesId === 5 || e.value === "Phone Number") {
        this.placeHolderText = "Phone Number";
        this.typeId = 5;
      } else if(e.value.QuestionAnswerTypesId === 6 || e.value === "Numbers") {
        this.placeHolderText = "Numbers";
        this.typeId = 6;
      } else if(e.value.QuestionAnswerTypesId === 7 || e.value === "Amount") {
        this.placeHolderText = "Amount";
        this.typeId = 7;
      } else if(e.value.QuestionAnswerTypesId === 8 || e.value === "Single / Multiple Choice") {
        this.placeHolderText = "Single / Multiple Choice";
        this.typeId = 8;
      } else if(e.value.QuestionAnswerTypesId === 9 || e.value === "Opinion / Rating Scales") {
        this.placeHolderText = "Opinion / Rating Scales";
        this.typeId = 9;
      } else if(e.value.QuestionAnswerTypesId === 10 || e.value === "Date / Time") {
        this.placeHolderText = "Date / Time";
        this.typeId = 10;
      } else if(e.value.QuestionAnswerTypesId === 11 || e.value === "Yes / No") {
        this.placeHolderText = "Yes / No";
        this.typeId = 11;
      } else if(e.value.QuestionAnswerTypesId === 12 || e.value === "Question Group") {
        this.placeHolderText = "Question Group";
        this.typeId = 12;
      } else if(e.value.QuestionAnswerTypesId === 13 || e.value === "File Upload") {
        this.placeHolderText = "File Upload";
        this.typeId = 13;
      }

      if (this.typeId === Default.Heading) {

        this.headingFlag = true;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        //  console.log('Event check type id', this.defaultFlag);
        if (this.defaultFlag === true) {

          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;

      } else if (this.typeId === Default.Text) {

        this.headingFlag = false;
        this.textFlag = true;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {

          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;


      } else if (this.typeId === Default.EmailAddress) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = true;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;


      } else if (this.typeId === Default.WebsiteURL) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = true;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;


      } else if (this.typeId === Default.PhoneNumber) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = true;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;


      } else if (this.typeId === Default.Numbers) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = true;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;


      } else if (this.typeId === Default.Amount) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = true;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;

      } else if (this.typeId === Default.SingleMultipleChoice) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = true;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;

      } else if (this.typeId === Default.OpinionRatingScales) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = true;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;

      } else if (this.typeId === Default.DateTime) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = true;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;

      } else if (this.typeId === Default.YesNo) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = true;
        this.fileUploadFlag = false;
        this.questionGroupFlag = false;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;

      } else if (this.typeId === Default.FileUpload) {

        this.headingFlag = false;
        this.textFlag = false;
        this.emailFlag = false;
        this.websiteUrlFlag = false;
        this.phoneNumberFlag = false;
        this.numbersFlag = false;
        this.amountFlag = false;
        this.singleMultipleChoiceFlag = false;
        this.opinionRatingScaleFlag = false;
        this.dateTimeFlag = false;
        this.yesNoFlag = false;
        this.fileUploadFlag = false;
        this.questionGroupFlag = true;

        if (this.defaultFlag === true) {
          this.sharedService.setDefaultSettings.next(this.typeId);
        }
        this.defaultFlag = false;


      }
    }
  }

  // Question layout on chnage function
  questionLayoutOnChange(event) {
    //  console.log('Event', event);
    // if (event.value.PhaseSettingId === 1) {
    if (event.value === 'Single Column') {
      this.selectedPhaseSetting = true;
      this.questionLayoutSettingSingleQuestion = true;
      this.sharedService.settingsLayoutSource.next(null);
    } else {
      this.selectedPhaseSetting = true;
      this.questionLayoutSettingSingleQuestion = false;
      this.sharedService.settingsLayoutSource.next(null);
    }
  }
}