import { Component, ContentChild, EventEmitter, Input, Output, TemplateRef, OnInit } from '@angular/core';

@Component({
    selector: 'EventTab',
    moduleId: module.id,
    template: '<ng-container *ngTemplateOutlet="template; context: state" ></ng-container>'

})
export class EventTabComponent implements OnInit {
    ngOnInit(): void {
        this.state = { isLoading: this.isLoading }
    }

    get isLoading() {
        return this.state.isLoading;
    }

    @Input()
    set isLoading(val) {
        this.state = { isLoading: !!val || !this._isTouched }
    }

    @ContentChild(TemplateRef, { static: false })
    template;

    state = { isLoading: true }

    private _isTouched: boolean = false;
    @Input()
    set isTouched(val: boolean) {
        if (val && !this._isTouched) {
            setTimeout(() => {
                this.refreshData.emit();
            }, 100)
            this._isTouched = val;
            this.state = { isLoading: true }
        }
    }
    get isTouched() {
        return this._isTouched;
    }

    @Output()
    refreshData = new EventEmitter()
}
