import {
  Component,
  OnInit,
  NgZone
} from '@angular/core';
import { MainPageService } from './../../../main-page.service';
import { Subject } from 'rxjs';
import { FormBuilder, FormControl, Validators, FormGroup } from '@angular/forms';
import { PipeGroupModel } from '../../../../models/dictionaries/pipe-group.model';
import { UnitsConverter } from '../../../../shared/units-converter/units-converter';
import { PipeSizeModel } from '../../../../models/parts/pipe-size.model';
import { PipeMaterialGroupModel } from '../../../../models/dictionaries/pipe-material-group.model';

@Component({
  selector: 'app-pipes-managment',
  templateUrl: './pipes-managment.component.html',
  styleUrls: ['./pipes-managment.component.scss']
})

export class PipesManagmentComponent implements OnInit {
  public pipeData: any;
  public isPipeNew: boolean = false;
  public stateSubject: Subject<any> = new Subject();
  public pipeSizesGridData: PipeSizeModel[];
  public pipeSizesGridDisplayData: PipeSizeModel[] = [];
  public editedSizeData: PipeSizeModel;
  public canAddRowToSizeGrid = true;
  private sizesOpenedGridRows: number = 0;
  public isSizesGridInChangeMode = false;
  public currentOpenRow: number;
  public formGroup: FormGroup;
  public rowNumber: number;
  private removeData: any;
  public pipeGroupsData: PipeGroupModel[] = [];
  public pipeMaterialGroupsData: PipeMaterialGroupModel[] = [];
  private unitsConverter = new UnitsConverter();

  constructor(private mainPageService: MainPageService, private formBuilder: FormBuilder) { }

  public ngOnInit(): void {
    this.pipeSizesGridData = [];
    this.mainPageService.deletePipeSizeSubject.subscribe((value) => {
      this.pipeSizesGridData = this.pipeSizesGridData.filter(x => x._id !== value);
    });
  }

  loadData(): void {
    this.mainPageService.loadPipeSizes(this.pipeData.id).subscribe((response) => {
      this.pipeSizesGridData = response;
      this.changeDisplayedUnits();
    });
    this.mainPageService.loadAllPipeGroups().subscribe((response) => {
      this.pipeGroupsData = response;
    });
    this.mainPageService.loadAllPipeMaterials().subscribe((response) => {
      this.pipeMaterialGroupsData = response;
    });
  }

  public showManagmentPage(sender, isNew) {
    this.pipeData = sender;
      this.isPipeNew = isNew;
    this.loadData();
  }

  save(): void {
    this.mainPageService.updatePipeInDb(JSON.stringify(this.pipeData)).subscribe(() => { });
    if (this.isPipeNew) {
      this.isPipeNew = false;
    }
  }

  returnHandler() {
    if (this.isPipeNew) {
      this.mainPageService.removePipe(this.pipeData._id).subscribe(() => { });
      this.mainPageService.deletePipeSubject.next(this.pipeData._id);
      this.pipeData = null;
    }
    this.stateSubject.next(this.pipeData);
    this.pipeData = null;
  }

  public editHandlerForSizeData({ sender, rowIndex }) {
    this.canAddRowToSizeGrid = false;

    this.sizesOpenedGridRows++;
    this.isSizesGridInChangeMode = true;
    this.currentOpenRow = rowIndex;
    this.formGroup = this.createFormGroupForSizeData(this.pipeSizesGridData[rowIndex]);
    sender.editRow(rowIndex, this.formGroup);
  }

  public cancelHandlerForSizeData({ sender, rowIndex }) {
    if (this.isSizesGridInChangeMode) {
      this.sizesOpenedGridRows--;
      sender.closeRow(rowIndex);
      if (this.sizesOpenedGridRows === 0) {
        this.isSizesGridInChangeMode = false;
      }
      this.canAddRowToSizeGrid = true;
    } else {
      this.sizesOpenedGridRows--;
      this.pipeSizesGridData = this.pipeSizesGridData.filter(
        item => item !== this.pipeSizesGridData[rowIndex]
      );
      sender.closeRow(rowIndex);
      this.canAddRowToSizeGrid = true;
    }

  }

  public saveHandlerForSizeData({ sender, formGroup, rowIndex }) {
    this.rowNumber = rowIndex;
    if (this.isSizesGridInChangeMode) {
      if (this.formGroup.valid
      ) {
        this.sizesOpenedGridRows--;

        this.overwriteDataInGrid(rowIndex, formGroup);
        sender.closeRow(rowIndex);
        this.canAddRowToSizeGrid = true;
        if (this.sizesOpenedGridRows === 0) {
          this.isSizesGridInChangeMode = false;
        }
        // this.changeElementUnitsToSI(rowIndex);
        this.editedSizeData = this.pipeSizesGridData[rowIndex];
        this.saveEditedSizes();
      }
    } else {
      if (this.formGroup.valid
      ) {
        this.sizesOpenedGridRows--;


        this.overwriteDataInGrid(rowIndex, formGroup);
        sender.closeRow(rowIndex);
        this.canAddRowToSizeGrid = true;
        if (this.sizesOpenedGridRows === 0) {
          this.isSizesGridInChangeMode = false;
        }
        // this.changeElementUnitsToSI(rowIndex);
        this.editedSizeData = this.pipeSizesGridData[rowIndex];
        this.saveNewSize();
      }
    }
  }

  public addHandlerForSizeData({ sender }) {
    this.sizesOpenedGridRows++;
    this.pipeSizesGridData.push(new PipeSizeModel(null, null, this.pipeData.id));
    this.canAddRowToSizeGrid = false;
    this.currentOpenRow = this.pipeSizesGridData.length - 1;
    sender.editRow(
      this.pipeSizesGridData.length - 1,
      this.formGroup = this.createFormGroupForSizeData(
        this.pipeSizesGridData[this.pipeSizesGridData.length - 1]
      )
    );
  }

  public removeHandler({ dataItem }) {
    this.removeData = dataItem;
  }

  public createFormGroupForSizeData(dataItem: any): FormGroup {
    return this.formBuilder.group({
      _id: dataItem._id,
      id: dataItem.id,
      pipeId: dataItem.pipeId,
      nominalWidth: new FormControl(dataItem.nominalWidth, Validators.compose([Validators.required])),
      code: dataItem.code,
      maxSpanWithInsulation: new FormControl(dataItem.maxSpanWithInsulation, Validators.compose([
        Validators.pattern('^\\d+(?:\\.\\d{1,1})?$')])),
      maxSpanWithoutInsulation: new FormControl(dataItem.maxSpanWithoutInsulation, Validators.compose([
        Validators.pattern('^\\d+(?:\\.\\d{1,1})?$')])),
      insulationThicknessDefault: new FormControl(dataItem.insulationThicknessDefault, Validators.compose([Validators.required,
      Validators.pattern('^\\d+(?:\\.\\d{1,1})?$')])),
      outerDiameter: new FormControl(dataItem.outerDiameter, Validators.compose([Validators.required,
      Validators.pattern('^\\d+(?:\\.\\d{1,4})?$')])),
      nominalDiameter: new FormControl(dataItem.nominalDiameter, Validators.compose([Validators.required,
      Validators.pattern('^\\d+(?:\\.\\d{1,2})?$')])),
      wallThickness: new FormControl(dataItem.wallThickness, Validators.compose([Validators.required,
      Validators.pattern('^\\d+(?:\\.\\d{1,4})?$')])),
      weightPMeter: new FormControl(dataItem.weightPMeter, Validators.compose([Validators.required,
      Validators.pattern('^\\d+(?:\\.\\d{1,5})?$')])),
    });
  }

  private changeDisplayedUnits() {
    let tempObject: PipeSizeModel;
    for (let index = 0; index < this.pipeSizesGridData.length; index++) {
      tempObject = {
        _id: this.pipeSizesGridData[index]._id,
        id: this.pipeSizesGridData[index].id,
        pipeId: this.pipeSizesGridData[index].pipeId,
        nominalWidth: this.pipeSizesGridData[index].nominalWidth,
        code: this.pipeSizesGridData[index].code,
        maxSpanWithInsulation: this.unitsConverter.convertFromSIToUnits(
          this.pipeSizesGridData[index].maxSpanWithInsulation, 'mm', 4),
        maxSpanWithoutInsulation: this.unitsConverter.convertFromSIToUnits(
          this.pipeSizesGridData[index].maxSpanWithoutInsulation, 'mm', 4),
        insulationThicknessDefault: this.unitsConverter.convertFromSIToUnits(
          this.pipeSizesGridData[index].insulationThicknessDefault, 'mm', 4),
        outerDiameter: this.unitsConverter.convertFromSIToUnits(
          this.pipeSizesGridData[index].outerDiameter, 'mm', 4),
        nominalDiameter: this.unitsConverter.convertFromSIToUnits(
          this.pipeSizesGridData[index].nominalDiameter, 'mm', 4),
        wallThickness: this.unitsConverter.convertFromSIToUnits(
          this.pipeSizesGridData[index].wallThickness, 'mm', 4),
        weightPMeter: this.pipeSizesGridData[index].weightPMeter
      };
      this.pipeSizesGridDisplayData[index] = Object.assign({}, tempObject);
    }
  }


  overwriteDataInGrid(rowIndex, formGroup) {
    this.pipeSizesGridData[rowIndex].nominalWidth = formGroup.value.nominalWidth;
    this.pipeSizesGridData[rowIndex].maxSpanWithInsulation = formGroup.value.maxSpanWithInsulation;
    this.pipeSizesGridData[rowIndex].maxSpanWithoutInsulation = formGroup.value.maxSpanWithoutInsulation;
    this.pipeSizesGridData[rowIndex].insulationThicknessDefault = formGroup.value.insulationThicknessDefault;
    this.pipeSizesGridData[rowIndex].outerDiameter = formGroup.value.outerDiameter;
    this.pipeSizesGridData[rowIndex].nominalDiameter = formGroup.value.nominalDiameter;
    this.pipeSizesGridData[rowIndex].wallThickness = formGroup.value.wallThickness;
    this.pipeSizesGridData[rowIndex].weightPMeter = formGroup.value.weightPMeter;
  }

  saveNewSize() {
    console.log(this.editedSizeData);
    this.mainPageService.addNewPipeSizeIntoDb(
      JSON.stringify(this.pipeSizesGridData[this.rowNumber])).subscribe((response) => {
        this.editedSizeData._id = response._id;
        this.editedSizeData.id = response.id;
        this.pipeSizesGridData[this.rowNumber] = this.editedSizeData;
      });
  }

  saveEditedSizes() {
    console.log(this.pipeSizesGridData[this.rowNumber]);
    this.mainPageService.updatePipeSizeInDb(JSON.stringify(this.editedSizeData)).subscribe(() => { });
  }

  public removeSize() {
    let index;
    for (let i = 0; i < this.pipeSizesGridData.length; i++) {
      if (this.pipeSizesGridData[i]._id === this.removeData._id) {
        index = i;
      }
    }
    this.deletePipeSize(this.pipeSizesGridData[index]);
  }

  deletePipeSize(size) {
    this.mainPageService.removePipeSize(size._id).subscribe(() => { }, () => { });
    this.mainPageService.deletePipeSizeSubject.next(size._id);
  }
}