import { ChangeDetectorRef, Directive, ElementRef, HostBinding, HostListener, OnChanges, OnInit } from '@angular/core';

@Directive({
    selector: '[iqserHasScrollbar]',
    exportAs: 'iqserHasScrollbar',
})
export class HasScrollbarDirective implements OnInit, OnChanges {
    @HostBinding('class') class = '';

    constructor(protected readonly _elementRef: ElementRef, protected readonly _changeDetector: ChangeDetectorRef) {}

    get hasScrollbar(): boolean {
        const element = this._elementRef?.nativeElement as HTMLElement;
        return element.clientHeight < element.scrollHeight;
    }

    ngOnInit(): void {
        setTimeout(() => {
            this.process();
        }, 0);
    }

    @HostListener('window:resize')
    process(): void {
        const newClass = this.hasScrollbar ? 'has-scrollbar' : '';
        if (this.class !== newClass) {
            this.class = newClass;
            this._changeDetector.markForCheck();
        }
    }

    ngOnChanges(): void {
        this.process();
    }
}