taskana/web/src/app/shared/spinner/spinner.component.ts

87 lines
2.0 KiB
TypeScript

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;
}
}