import { Component, EventEmitter, Input, OnDestroy, Output, ViewChild } from '@angular/core';
import { ERROR_TYPES } from '../../models/errors';
import { ErrorsService } from "../../services/errors/errors.service";

declare let $: any;


@Component({
  selector: 'taskana-spinner',
  templateUrl: './spinner.component.html',
  styleUrls: ['./spinner.component.scss']
})
export class SpinnerComponent implements OnDestroy {
  showSpinner: boolean;
  @Input()
  delay = 250;
  @Input()
  isModal = false;
  @Input()
  positionClass: string;
  @Output()
  spinnerIsRunning = new EventEmitter<boolean>();
  private currentTimeout: any;
  private requestTimeout: any;
  private maxRequestTimeout = 10000;
  @ViewChild('spinnerModal', {static: true})
  private modal;

  constructor(private errorsService: ErrorsService) {

  }

  set isDelayedRunning(value: boolean) {
    this.showSpinner = value;
    this.spinnerIsRunning.next(value);
  }

  @Input()
  set isRunning(value: boolean) {
    if (!value) {
      this.cancelTimeout();
      if (this.isModal) {
        this.closeModal();
      }
      this.isDelayedRunning = false;
      return;
    }

    if (this.currentTimeout) {
      return;
    }
    this.runSpinner(value);
  }

  ngOnDestroy(): any {
    this.cancelTimeout();
  }

  private runSpinner(value) {
    this.currentTimeout = setTimeout(() => {
      if (this.isModal) {
        $(this.modal.nativeElement).modal('show');
      }
      this.isDelayedRunning = value;
      this.cancelTimeout();
      this.requestTimeout = setTimeout(() => {
        this.errorsService.updateError(ERROR_TYPES.TIMEOUT_ERR);
        this.cancelTimeout();
        this.isRunning = false;
      }, this.maxRequestTimeout);
    }, this.delay);
  }

  private closeModal() {
    if (this.showSpinner) {
      $(this.modal.nativeElement).modal('hide');
    }
  }

  private cancelTimeout(): void {
    clearTimeout(this.currentTimeout);
    clearTimeout(this.requestTimeout);
    delete this.currentTimeout; // do we need this?
    delete this.requestTimeout;
  }
}