import {
  Component,
  OnInit,
  ViewChild,
  EventEmitter,
  Output,
  NgZone
} from '@angular/core';
import { MainPageService } from './../../../main-page.service';
import { ShowViewerArgs } from '../../../../models/viewer/ShowViewerArgs.model';
import { FormGroup, FormControl, Validators } from '@angular/forms';
import { PipeRingModel } from '../../../../models/parts/pipering.model.';
import { PiperingGroupModel } from '../../../../models/dictionaries/pipering-group.model';
import { CorosiveProtectionModel } from '../../../../models/dictionaries/corosive-protection.model';
import { PipeRingVariantModel } from '../../../../models/parts/pipering-variant.model';
import { DesignBaseModel } from '../../../../models/dictionaries/design-base.model';


@Component({
  selector: 'app-pipe-rings-managment',
  templateUrl: './pipe-rings-managment.component.html',
  styleUrls: ['./pipe-rings-managment.component.scss']
})
export class PipeRingsManagmentComponent implements OnInit {
  @ViewChild('fileUploadInput') fileInput;
  @Output() onShowViewer: EventEmitter<ShowViewerArgs> = new EventEmitter();

  public pipeRingData: any;
  public editedPipeRing = new PipeRingModel();
  public editedPipeRingVariant = new PipeRingVariantModel();
  public showPicture = false;
  public canOpenGraphicalTool = false;
  private stpConvertTaskId: string;
  public isStpVisible = false;
  public isPngVisible = false;
  public currentVariantTabId = '';
  public currentVariantTab = 0;
  public pictureData: string;
  public formGroup: FormGroup;
  public variantFormGroup: FormGroup;
  private duplicateMode = false;
  public choosenDesignBase: string;
  public piperingGroupsData: PiperingGroupModel[] = [];
  public corrosionProtectionData: CorosiveProtectionModel[] = [];
  public variantsList: PipeRingVariantModel[] = [];
  public designBasesArray: DesignBaseModel[] = [];
  public piperingFamiliesArray: any[] = [];

  constructor(private mainPageService: MainPageService, private zone: NgZone) {
    // this.graphicalRepresentationsArray = this.mainPageService.getPipeRingGraphicalRepresentationsArray();
    mainPageService.loadAllPiperingFamilies().subscribe((res) => {
      this.piperingFamiliesArray = res;
    });
   }

  public ngOnInit(): void {
    this.loadData();
    this.createForm();
    this.createVariantForm();
  }

  loadData(): void {
    this.mainPageService.loadAllPiperingGroups().subscribe((response) => {
      this.piperingGroupsData = response;
    });
    this.mainPageService.loadAllCorosionProtections().subscribe((response) => {
      this.corrosionProtectionData = response;
    });
    this.mainPageService.loadAllDesignBases().subscribe((response) => {
      this.designBasesArray = response;
      this.choosenDesignBase = this.designBasesArray[0]._id;
    });
  }

  loadPiperingVariants() {
    this.mainPageService.loadAllPiperingVariants(this.pipeRingData._id).subscribe((response) => {
      this.variantsList = response;
      if (this.variantsList.length > 0) {
        Object.assign(this.editedPipeRingVariant, this.variantsList[this.currentVariantTab]);
      }
      if (this.variantsList.length > 0) {
        this.currentVariantTabId = this.variantsList[this.currentVariantTab]._id;
      }
    });
  }

  showPipeRing(sender) {
    this.currentVariantTab = 0;
    this.currentVariantTabId = '';
    this.pipeRingData = sender;
    this.editedPipeRing = {
      ...this.pipeRingData
    };
    this.setFilesData(sender);
    this.canOpenGraphicalTool = sender.isProtoConverted === true;
    this.loadPiperingVariants();
  }

  upload(): void {
    this.readThis(this.fileInput.nativeElement.files[0]);
  }

  readThis(inputFile: any): void {
    const file: File = inputFile;
    const myReader: FileReader = new FileReader();
    const scope = this;
    myReader.onloadend = function () {
      if (file.name.includes('.stp') || file.name.includes('.step')) {
        scope.isStpVisible = true;
        scope.sendSTPFile(myReader.result, scope.pipeRingData._id);
      } else {
        scope.zone.run(() => scope.pictureData = myReader.result);
        scope.isPngVisible = true;
        scope.sendPictureFile(myReader.result, scope.pipeRingData._id);
      }
    };
    myReader.readAsDataURL(file);
  }

  checkIfStpIsConverted(): void {
    const self = this;
    setTimeout(() => {
      self.mainPageService.checkTaskStatus(self.stpConvertTaskId)
        .subscribe((resp) => {
          if (resp.isFinished === true) {
            self.zone.run(() => self.canOpenGraphicalTool = resp.result);
            //self.canOpenGraphicalTool = resp.result;
          } else {
            self.checkIfStpIsConverted();
          }
        });
    }, 2000);
  }
  sendSTPFile(file, id): void {
    this.canOpenGraphicalTool = false;
    this.mainPageService.sentSTPFileForPipeRings(file, id)
      .subscribe((response) => {
        this.pipeRingData.stepFile = response.fileId;
        this.stpConvertTaskId = response.id;
        console.log(response);
        this.checkIfStpIsConverted();
      },
        (error: any) => {
          console.log(error);
        }
      );
  }
  sendPictureFile(picture, id): void {
    this.mainPageService.sendPicture(picture, id)
      .subscribe((response) => {
        this.pipeRingData.picture = response.fileId;
      },
        (error: any) => {
          console.log(error);
        }
      );
  }

  openGraphicalTool(): void {
    this.onShowViewer.emit(new ShowViewerArgs(true, this.pipeRingData._id, 'PIPE_RING', null));
  }

  openVariantGraphicalTool(variantId): void {
    this.onShowViewer.emit(new ShowViewerArgs(true, this.pipeRingData._id, 'PIPE_RING', variantId));
  }

  changeVariantTab(id) {
    this.currentVariantTabId = id;
    for (let i = 0; i < this.variantsList.length; i++) {
      if (this.variantsList[i]._id === this.currentVariantTabId) {
        this.currentVariantTab = i;
        Object.assign(this.editedPipeRingVariant, this.variantsList[this.currentVariantTab]);
      }
    }
  }

  save(): void {
    Object.assign(this.pipeRingData, this.editedPipeRing);
    // this.mainPageService.mysubject.next(this.pipeRingData._id);
    
    this.mainPageService.updatePiperingInDb(JSON.stringify(this.pipeRingData)).subscribe(() => { });
  }

  deletePicture() {
    this.pictureData = '';
    this.isPngVisible = false;
    this.mainPageService.deleteFile(this.pipeRingData.picture).subscribe(() => {
    },
      () => {
      }
    );
    this.pipeRingData.picture = null;
  }

  deleteStepFile() {
    this.isStpVisible = false;
    this.mainPageService.deleteFile(this.pipeRingData.stepFile).subscribe(() => {
    },
      () => {
      }
    );
    this.pipeRingData.stepFile = null;
  }

  setFilesData(pipering) {
    if (pipering.picture !== undefined && pipering.picture !== null && pipering.picture !== "") {
      this.isPngVisible = true;
      this.mainPageService.getPicture(pipering.picture).subscribe((res) => {
        this.pictureData = res.src;
      },
        (error: any) => {
          console.log(error);
        }
      );
    } else {
      this.pictureData = '';
      this.isPngVisible = false;
    }

    if (pipering.stepFile !== undefined && pipering.stepFile !== null && pipering.stepFile !== "") {
      this.isStpVisible = true;
    } else {
      this.isStpVisible = false;
    }
  }

  deletePipeRing() {
    this.mainPageService.removePipering(this.pipeRingData._id).subscribe(() => { }, () => { });
    this.mainPageService.deletePiperingSubject.next(this.pipeRingData._id);
    this.pipeRingData = undefined;
  }

  public prepareVariantCreate() {
    this.editedPipeRingVariant = new PipeRingVariantModel();
    this.createVariantForm();
  }

  private createVariantForm() {
    this.variantFormGroup = new FormGroup({
      name: new FormControl(this.editedPipeRingVariant.name, Validators.required),
      description: new FormControl(this.editedPipeRingVariant.description),
    });
  }

  private createForm() {
    this.formGroup = new FormGroup({
      name: new FormControl(this.editedPipeRing.name, Validators.required),
      articleId: new FormControl(this.editedPipeRing.articleId, Validators.required),
      piperingGroupId: new FormControl(this.editedPipeRing.piperingGroupId, Validators.required),
      corrosionProtectionId: new FormControl(this.editedPipeRing.corrosionProtectionId, Validators.required),
      piperingFamilyId: new FormControl(this.editedPipeRing.piperingFamilyId, Validators.required),
    });
  }

  saveNewVariant() {
    this.editedPipeRingVariant.piperingId = this.pipeRingData._id;
    this.sendVariantToDb(this.editedPipeRingVariant);
  }

  sendVariantToDb(variant) {
    this.mainPageService.addNewPiperingVariantIntoDb(JSON.stringify(variant))
      .subscribe((response) => {
        console.log(response);
        variant._id = response;
        this.variantsList.push(variant);
        if (this.variantsList.length === 1) {
          Object.assign(this.editedPipeRingVariant, this.variantsList[this.currentVariantTab]);
        }
        if (this.duplicateMode) {
          this.mainPageService.duplicateVariantData(
            this.variantsList[this.currentVariantTab]._id, this.variantsList[this.variantsList.length - 1]._id).subscribe(() => { });
          this.duplicateMode = false;
        }
        this.editedPipeRingVariant = new PipeRingVariantModel();
        if (this.currentVariantTabId === '') {
          this.currentVariantTabId = this.variantsList[0]._id;
        }
      },
        (error: any) => {
          console.log(error);
        }
      );
  }

  duplicateVariant() {
    this.duplicateMode = true;
    const newVariant = new PipeRingVariantModel();
    Object.assign(newVariant, this.variantsList[this.currentVariantTab]);
    newVariant.name = this.editedPipeRingVariant.name;
    this.sendVariantToDb(newVariant);
  }

  deleteVariant() {
    this.mainPageService.removePiperingVariant(this.variantsList[this.currentVariantTab]._id).subscribe(() => {
      const idToDelete = this.currentVariantTabId;
      if (this.currentVariantTab === (this.variantsList.length - 1) && this.currentVariantTab !== 0) {
        this.currentVariantTab -= 1;
        this.currentVariantTabId = this.variantsList[this.currentVariantTab]._id;
      }
      else if (this.currentVariantTab === 0 && this.variantsList.length === 1) {
        this.currentVariantTabId = '';
        this.currentVariantTab = 0;
      }
      else {
        this.currentVariantTabId = this.variantsList[this.currentVariantTab + 1]._id;
      }
      this.variantsList = this.variantsList.filter(variant => variant._id !== idToDelete);
      Object.assign(this.editedPipeRingVariant, this.variantsList[this.currentVariantTab]);
    }, () => { });
  }

  updateVariant() {
    Object.assign(this.variantsList[this.currentVariantTab], this.editedPipeRingVariant);
    this.mainPageService.updatePiperingVariantInDb(JSON.stringify(this.variantsList[this.currentVariantTab])).subscribe(() => { });
  }

  prepareVariantEdit() {
    Object.assign(this.editedPipeRingVariant, this.variantsList[this.currentVariantTab]);
  }

}