import { ChangeDetectionStrategy, Component, EventEmitter, HostListener, Input, Output } from '@angular/core';
import { BehaviorSubject } from 'rxjs';

@Component({
    selector: 'iqser-hidden-action',
    templateUrl: './hidden-action.component.html',
    styleUrls: ['./hidden-action.component.scss'],
    changeDetection: ChangeDetectionStrategy.OnPush,
})
export class HiddenActionComponent {
    @Input() requiredClicks = 4;
    @Output() readonly action = new EventEmitter();
    #dPressed = new BehaviorSubject(false);
    #clickCount = 0;
    #clickCountTimeout?: ReturnType<typeof setTimeout>;

    @HostListener('window:keydown.D', ['$event'])
    onKeydownD() {
        this.#dPressed.next(true);
    }

    @HostListener('window:keyup.D', ['$event'])
    onKeyupD() {
        this.#dPressed.next(false);
    }

    countActions($event: MouseEvent): void {
        if (!this.#dPressed.value) {
            this.#clickCount = 0;
            clearTimeout(this.#clickCountTimeout);
            return;
        }

        $event.stopPropagation();
        $event.preventDefault();

        this.#clickCount += 1;
        if (this.#clickCount === this.requiredClicks) {
            this.#clickCount = 0;
            this.action.emit();
        }
        clearTimeout(this.#clickCountTimeout);
        this.#clickCountTimeout = setTimeout(() => {
            this.#clickCount = 0;
        }, 1000);
    }
}