import { Component, ViewChild, Injector, ElementRef, Output, EventEmitter } from '@angular/core';
import { AppComponentBase } from '@shared/common/app-component-base';
import { IncidentListDto, IncidentServiceProxy } from '@shared/service-proxies/service-proxies';
import { IncidentImageListDto, IncidentImageServiceProxy } from '@shared/service-proxies/service-proxies';
import { ImageListDto, ImageServiceProxy } from '@shared/service-proxies/service-proxies';

import * as _ from 'lodash';
import { ModalDirective } from 'ngx-bootstrap';
import { finalize } from 'rxjs/operators';


@Component({
    selector: 'viewIncidentImageModal',
    templateUrl: './view-incident-image-modal.component.html'
})
export class ViewIncidentImageModalComponent extends AppComponentBase {

  @Output() modalSave: EventEmitter<any> = new EventEmitter<any>();

  @ViewChild(ModalDirective, {static: false}) public modal: ModalDirective;
  @ViewChild('nameInput', {static: false}) nameInput: ElementRef;

  //incident: UpdateIncidentInput = new UpdateIncidentInput();
  //geocode: UpdateGeocodeInput = new UpdateGeocodeInput();
  
  images: IncidentImageListDto[] = [];
  
  
  imageId: any;
  incidentImageId: any;


  active: boolean = false;
  saving: boolean = false;

  constructor(
    injector: Injector,
    private _incidentService: IncidentServiceProxy,
    private _incidentImageService: IncidentImageServiceProxy,
    private _imageService: ImageServiceProxy

  ) {
    super(injector);
  }

  show(incidentId): void {
      this.active = true;
    

      this._incidentImageService.getIncidentImage(
      undefined,
      undefined,
      incidentId,
      undefined,
      undefined,
      undefined

      ).subscribe(result => {

          
          this.images = result.items;
          console.log(this.images);
          this.modal.show();
      });
      

  }

  onShown(): void {
   // this.nameInput.nativeElement.focus();
  }

  

  close(): void {
    this.modal.hide();
    this.active = false;
  }
}