import '@arcgis/map-components/dist/components/arcgis-placement';

import {
  Component,
  CUSTOM_ELEMENTS_SCHEMA,
  DestroyRef,
  inject,
  OnInit,
  signal,
  ViewEncapsulation,
} from '@angular/core';
import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
import {MatButtonModule} from '@angular/material/button';
import {MatIcon} from '@angular/material/icon';
import {MatMenuModule} from '@angular/material/menu';
import MapView from '@arcgis/core/views/MapView';
import SceneView from '@arcgis/core/views/SceneView';
import {ArcgisMapOptions, ArcLayerId, NshmpMapArcgisComponent} from '@ghsc/nshmp-lib-ng/map';
import {from} from 'rxjs';

import {AppService} from '../../services/app.service';
import {LegendComponent} from '../legend/legend.component';

/**
 * ArcGIS map with layers showing NSHM boundary, fault sections, and test sites.
 */
@Component({
  encapsulation: ViewEncapsulation.None,
  imports: [LegendComponent, NshmpMapArcgisComponent, MatButtonModule, MatMenuModule, MatIcon],
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  selector: 'app-map',
  styleUrl: './map.component.scss',
  templateUrl: './map.component.html',
})
export class MapComponent implements OnInit {
  service = inject(AppService);
  private destroyRef = inject(DestroyRef);

  mapOptions = signal<ArcgisMapOptions>({});

  private view: MapView | SceneView;
  private init = false;

  ngOnInit(): void {
    const {model} = this.service.formGroup.controls;

    model.valueChanges.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(model => {
      if (model !== null && this.service.sourceFeaturesUsage()) {
        const title = this.service.sourceFeaturesUsage().response.model.name;

        this.mapOptions.set({
          print: {
            dpi: 200,
            title,
          },
        });
      }
    });
  }

  viewReady(view: __esri.MapView): void {
    this.view = view;
    this.service.updateState({view});

    view.on('layerview-create', viewEvent => {
      if (viewEvent.layer.id === ArcLayerId.NSHM.toString()) {
        this.goTo(viewEvent.layer);
      }
    });
  }

  private goTo(layer: __esri.Layer): void {
    if (this.view && layer) {
      from(layer.when())
        .pipe(takeUntilDestroyed(this.destroyRef))
        .subscribe(() => {
          from(this.view.goTo(layer.fullExtent))
            .pipe(takeUntilDestroyed(this.destroyRef))
            .subscribe();
        });
    }
  }
}