import { inject, Injectable } from '@angular/core';
import { UserPreferenceService } from '@users/user-preference.service';
import { HeaderElements } from '../../file-preview/utils/constants';
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
import { TranslateService } from '@ngx-translate/core';
import { PdfViewer } from './pdf-viewer.service';
import { REDDocumentViewer } from './document-viewer.service';
import { BASE_HREF_FN } from '@iqser/common-ui/lib/utils';

@Injectable()
export class TooltipsService {
    private readonly _convertPath = inject(BASE_HREF_FN);
    readonly #enableIcon = this._convertPath('/assets/icons/general/pdftron-action-enable-tooltips.svg');
    readonly #disableIcon = this._convertPath('/assets/icons/general/pdftron-action-disable-tooltips.svg');

    constructor(
        private readonly _pdf: PdfViewer,
        private readonly _documentViewer: REDDocumentViewer,
        private readonly _userPreferenceService: UserPreferenceService,
        private readonly _translateService: TranslateService,
    ) {}

    get toggleTooltipsBtnTitle(): string {
        return this._translateService.instant(_('pdf-viewer.toggle-tooltips'), {
            active: this._userPreferenceService.getFilePreviewTooltipsPreference(),
        });
    }

    get toggleTooltipsBtnIcon(): string {
        const tooltipsDisabled = this._userPreferenceService.getFilePreviewTooltipsPreference();
        return tooltipsDisabled ? this.#enableIcon : this.#disableIcon;
    }

    async toggleTooltips(): Promise<void> {
        await this._userPreferenceService.toggleFilePreviewTooltipsPreference();
        this._documentViewer.updateTooltipsVisibility();
        this._pdf.instance.UI.updateElement(HeaderElements.TOGGLE_TOOLTIPS, {
            title: this.toggleTooltipsBtnTitle,
            img: this.toggleTooltipsBtnIcon,
        });
    }
}
