import {Component, ElementRef, OnInit, ViewChild} from '@angular/core';
import {MatButton} from '@angular/material/button';
import {PatientContextService} from '../services/patient-context.service';
import {CprDoesNotExistError} from '../services/error.service';
import {throwError} from 'rxjs';
import {CprSearchEventService} from '../services/cpr-search-event.service';

@Component({
  selector: 'app-cpr-search',
  templateUrl: './cpr-search.component.html',
  styleUrls: ['./cpr-search.component.scss']
})
export class CprSearchComponent implements OnInit {
  @ViewChild('wrapper') wrapper?: ElementRef<HTMLElement>;
  @ViewChild('textInputField') textInputField?: ElementRef<HTMLElement>;
  @ViewChild('submitButton') submitButton?: MatButton;

  public cpr = '';

  constructor(private patientContext: PatientContextService, private cprSearchEventService: CprSearchEventService) {
  }

  ngOnInit(): void {
    this.patientContext.cpr$.subscribe(() => {
      this.cpr = '';
    });

    this.cprSearchEventService.cprSearchFabClick$.subscribe(() => {
      this.focus();
    });
  }

  public search(cpr: string): void {
    if (cpr === '' ) {
      return;
    }

    if (!this.validateCpr(cpr)) {
      throwError(new CprDoesNotExistError());
    }

    this.patientContext.setCpr(cpr);
  }

  public handleInputFocus(): void {
    this.wrapper?.nativeElement.classList.add('focused');
    this.cprSearchEventService.emitCprSearchFocusedEvent(true);
  }

  public handleInputBlur(): void {
    this.wrapper?.nativeElement.classList.remove('focused');
    this.cprSearchEventService.emitCprSearchFocusedEvent(false);
  }

  public handleEnterPressed(): { andSearch: (cpr: string) => void } {
    this.submitButton?.ripple.launch({centered: true});
    return {
      andSearch: (cpr) => this.search(cpr)
    };
  }

  public focus(): void {
    this.textInputField?.nativeElement.focus();
  }

  public validateCpr(cpr: string): boolean {
    return true;
  }
}