import {ChangeDetectionStrategy, Component, computed, inject, Signal} from '@angular/core';
import {ReactiveFormsModule} from '@angular/forms';
import {
  NshmpHazardLocationFormComponent,
  NshmpHazardMaxDirectionFormComponent,
  NshmpHazardModelFormComponent,
  NshmpHazardReturnPeriodFormComponent,
  NshmpHazardSiteClassFormComponent,
  NshmpHazardTruncationFormComponent,
} from '@ghsc/nshmp-lib-ng/hazard';
import {NshmpMapSelectSiteComponent, SelectSiteDialogData} from '@ghsc/nshmp-lib-ng/map';
import {
  NshmpControlPanelButtonsComponent,
  NshmpSectionComponent,
  NshmpService,
} from '@ghsc/nshmp-lib-ng/nshmp';
import {Location} from '@ghsc/nshmp-utils-ts/libs/nshmp-lib/geo';

import {environment} from '../../../../../environments/environment';
import {AppService} from '../../services/app.service';

/**
 * Control panel with form fields to call hazard service.
 */
@Component({
  changeDetection: ChangeDetectionStrategy.OnPush,
  host: {id: 'hazard-dynamic-control-panel'},
  imports: [
    NshmpHazardModelFormComponent,
    NshmpHazardLocationFormComponent,
    NshmpMapSelectSiteComponent,
    NshmpHazardSiteClassFormComponent,
    NshmpSectionComponent,
    NshmpHazardReturnPeriodFormComponent,
    NshmpHazardTruncationFormComponent,
    NshmpHazardMaxDirectionFormComponent,
    NshmpControlPanelButtonsComponent,
    ReactiveFormsModule,
  ],
  selector: 'app-control-panel',
  styleUrl: './control-panel.component.scss',
  templateUrl: './control-panel.component.html',
})
export class ControlPanelComponent {
  service = inject(AppService);
  private nshmpService = inject(NshmpService);

  /** Form field state */
  formGroup = this.service.formGroup;

  /** List of site class `Parameter`s */
  siteClasses = computed(() => this.service.usage()?.response?.model.siteClasses);

  /** Data for select site component */
  selectSiteData: Signal<SelectSiteDialogData> = computed(() => {
    const usage = this.service.usage();
    const nshmService = this.service.nshmService();

    if (usage === null || nshmService === undefined) {
      return;
    }

    const services = environment.webServices.nshmpHazWs.services.curveServices;

    return {
      faultSectionsUrl: `${nshmService.url}${services.features}/FAULT?polygons=false&raw=true`,
      mapUrl: `${nshmService.url}${services.map}?raw=true`,
      sitesUrl: `${nshmService.url}${services.sites}?raw=true`,
    };
  });

  onReturnPeriodChange(): void {
    this.service.createHazardPlot();
    this.service.createSpectraPlot();
  }

  /**
   * On form submit.
   */
  onSubmit(): void {
    this.nshmpService.selectPlotControl();
    this.service.callService();
  }

  setLocation(location: Location): void {
    this.formGroup.patchValue({
      latitude: location.latitude,
      longitude: location.longitude,
    });
  }
}