Tooltips service
This commit is contained in:
parent
f8922bfbdb
commit
d9478d25ff
@ -44,6 +44,7 @@ import { loadCompareDocumentWrapper } from '../../../dossier/utils/compare-mode.
|
||||
import { from, fromEvent } from 'rxjs';
|
||||
import { FileDataService } from '../../services/file-data.service';
|
||||
import { ViewerHeaderConfigService } from '../../services/viewer-header-config.service';
|
||||
import { TooltipsService } from '../../services/tooltips.service';
|
||||
import Tools = Core.Tools;
|
||||
import TextTool = Tools.TextTool;
|
||||
import Annotation = Core.Annotations.Annotation;
|
||||
@ -84,6 +85,7 @@ export class PdfViewerComponent extends AutoUnsubscribe implements OnInit, OnCha
|
||||
private readonly _pageRotationService: PageRotationService,
|
||||
private readonly _fileDataService: FileDataService,
|
||||
private readonly _headerConfigService: ViewerHeaderConfigService,
|
||||
private readonly _tooltipsService: TooltipsService,
|
||||
readonly stateService: FilePreviewStateService,
|
||||
readonly viewModeService: ViewModeService,
|
||||
readonly multiSelectService: MultiSelectService,
|
||||
@ -317,12 +319,6 @@ export class PdfViewerComponent extends AutoUnsubscribe implements OnInit, OnCha
|
||||
}
|
||||
}
|
||||
|
||||
private async _toggleTooltips(title: string, img: string): Promise<void> {
|
||||
await this._userPreferenceService.toggleFilePreviewTooltipsPreference();
|
||||
this._updateTooltipsVisibility();
|
||||
this.instance.UI.updateElement(HeaderElements.TOGGLE_TOOLTIPS, { title, img });
|
||||
}
|
||||
|
||||
private _configureElements() {
|
||||
this.instance.UI.disableElements([
|
||||
'pageNavOverlay',
|
||||
@ -347,9 +343,6 @@ export class PdfViewerComponent extends AutoUnsubscribe implements OnInit, OnCha
|
||||
'annotationGroupButton',
|
||||
]);
|
||||
|
||||
const toggleTooltipsFn = async (title: string, img: string) => {
|
||||
await this._toggleTooltips(title, img);
|
||||
};
|
||||
const closeCompareFn = async () => {
|
||||
await this._closeCompareMode();
|
||||
};
|
||||
@ -363,14 +356,7 @@ export class PdfViewerComponent extends AutoUnsubscribe implements OnInit, OnCha
|
||||
this._pageRotationService.discardRotation();
|
||||
};
|
||||
|
||||
this._headerConfigService.initialize(
|
||||
toggleTooltipsFn,
|
||||
this.compareFileInput,
|
||||
closeCompareFn,
|
||||
addRotation,
|
||||
applyRotation,
|
||||
discardRotation,
|
||||
);
|
||||
this._headerConfigService.initialize(this.compareFileInput, closeCompareFn, addRotation, applyRotation, discardRotation);
|
||||
|
||||
const dossierTemplateId = this.dossier.dossierTemplateId;
|
||||
|
||||
@ -600,12 +586,7 @@ export class PdfViewerComponent extends AutoUnsubscribe implements OnInit, OnCha
|
||||
const routePageNumber: number = this._activatedRoute.snapshot.queryParams.page;
|
||||
this.pageChanged.emit(routePageNumber || 1);
|
||||
this._setInitialDisplayMode();
|
||||
this._updateTooltipsVisibility();
|
||||
this._tooltipsService.updateTooltipsVisibility();
|
||||
});
|
||||
}
|
||||
|
||||
private _updateTooltipsVisibility(): void {
|
||||
const current = this._userPreferenceService.getFilePreviewTooltipsPreference();
|
||||
this.instance.UI.setAnnotationContentOverlayHandler(() => (current ? undefined : false));
|
||||
}
|
||||
}
|
||||
|
||||
@ -15,6 +15,7 @@ import { PageRotationService } from './services/page-rotation.service';
|
||||
import { PdfViewer } from './services/pdf-viewer.service';
|
||||
import { FileDataService } from './services/file-data.service';
|
||||
import { ViewerHeaderConfigService } from './services/viewer-header-config.service';
|
||||
import { TooltipsService } from './services/tooltips.service';
|
||||
|
||||
export const filePreviewScreenProviders = [
|
||||
FilterService,
|
||||
@ -34,4 +35,5 @@ export const filePreviewScreenProviders = [
|
||||
FileDataService,
|
||||
dossiersServiceProvider,
|
||||
ViewerHeaderConfigService,
|
||||
TooltipsService,
|
||||
];
|
||||
|
||||
@ -0,0 +1,49 @@
|
||||
import { Inject, Injectable } from '@angular/core';
|
||||
import { PdfViewer } from './pdf-viewer.service';
|
||||
import { UserPreferenceService } from '@services/user-preference.service';
|
||||
import { HeaderElements } from '../shared/constants';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { BASE_HREF } from '../../../tokens';
|
||||
|
||||
@Injectable()
|
||||
export class TooltipsService {
|
||||
constructor(
|
||||
@Inject(BASE_HREF) private readonly _baseHref: string,
|
||||
private readonly _pdfViewer: PdfViewer,
|
||||
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 {
|
||||
return this._convertPath(
|
||||
this._userPreferenceService.getFilePreviewTooltipsPreference()
|
||||
? '/assets/icons/general/pdftron-action-enable-tooltips.svg'
|
||||
: '/assets/icons/general/pdftron-action-disable-tooltips.svg',
|
||||
);
|
||||
}
|
||||
|
||||
updateTooltipsVisibility(): void {
|
||||
const current = this._userPreferenceService.getFilePreviewTooltipsPreference();
|
||||
this._pdfViewer.instance.UI.setAnnotationContentOverlayHandler(() => (current ? undefined : false));
|
||||
}
|
||||
|
||||
async toggleTooltips(): Promise<void> {
|
||||
await this._userPreferenceService.toggleFilePreviewTooltipsPreference();
|
||||
this.updateTooltipsVisibility();
|
||||
this._pdfViewer.instance.UI.updateElement(HeaderElements.TOGGLE_TOOLTIPS, {
|
||||
title: this.toggleTooltipsBtnTitle,
|
||||
img: this.toggleTooltipsBtnIcon,
|
||||
});
|
||||
}
|
||||
|
||||
private _convertPath(path: string): string {
|
||||
return this._baseHref + path;
|
||||
}
|
||||
}
|
||||
@ -3,9 +3,8 @@ import { IHeaderElement, RotationType, RotationTypes } from '@red/domain';
|
||||
import { HeaderElements, HeaderElementType } from '../shared/constants';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { BASE_HREF } from '../../../tokens';
|
||||
import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker';
|
||||
import { UserPreferenceService } from '@services/user-preference.service';
|
||||
import { PdfViewer } from './pdf-viewer.service';
|
||||
import { TooltipsService } from './tooltips.service';
|
||||
|
||||
@Injectable()
|
||||
export class ViewerHeaderConfigService {
|
||||
@ -27,8 +26,8 @@ export class ViewerHeaderConfigService {
|
||||
constructor(
|
||||
@Inject(BASE_HREF) private readonly _baseHref: string,
|
||||
private readonly _translateService: TranslateService,
|
||||
private readonly _userPreferenceService: UserPreferenceService,
|
||||
private readonly _pdfViewer: PdfViewer,
|
||||
private readonly _tooltipsService: TooltipsService,
|
||||
) {}
|
||||
|
||||
private get _rectangle(): IHeaderElement {
|
||||
@ -41,22 +40,20 @@ export class ViewerHeaderConfigService {
|
||||
};
|
||||
}
|
||||
|
||||
private get _toggleTooltipsBtnTitle(): string {
|
||||
return this._translateService.instant(_('pdf-viewer.toggle-tooltips'), {
|
||||
active: this._userPreferenceService.getFilePreviewTooltipsPreference(),
|
||||
});
|
||||
}
|
||||
|
||||
private get _toggleTooltipsBtnIcon(): string {
|
||||
return this._convertPath(
|
||||
this._userPreferenceService.getFilePreviewTooltipsPreference()
|
||||
? '/assets/icons/general/pdftron-action-enable-tooltips.svg'
|
||||
: '/assets/icons/general/pdftron-action-disable-tooltips.svg',
|
||||
);
|
||||
private get _toggleTooltips(): IHeaderElement {
|
||||
return {
|
||||
type: 'actionButton',
|
||||
element: HeaderElements.TOGGLE_TOOLTIPS,
|
||||
dataElement: HeaderElements.TOGGLE_TOOLTIPS,
|
||||
title: this._tooltipsService.toggleTooltipsBtnTitle,
|
||||
img: this._tooltipsService.toggleTooltipsBtnIcon,
|
||||
onClick: async () => {
|
||||
await this._tooltipsService.toggleTooltips();
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
initialize(
|
||||
toggleTooltips: (title: string, img: string) => Promise<void>,
|
||||
compareFileInput: ElementRef,
|
||||
closeCompareMode: () => Promise<void>,
|
||||
addRotation: (type: RotationType) => void,
|
||||
@ -74,7 +71,7 @@ export class ViewerHeaderConfigService {
|
||||
[HeaderElements.ROTATE_RIGHT_BUTTON, this._rotateRight(addRotation)],
|
||||
[HeaderElements.APPLY_ROTATION, this._applyRotation(applyRotation)],
|
||||
[HeaderElements.DISCARD_ROTATION, this._discardRotation(discardRotation)],
|
||||
[HeaderElements.TOGGLE_TOOLTIPS, this._toggleTooltips(toggleTooltips)],
|
||||
[HeaderElements.TOGGLE_TOOLTIPS, this._toggleTooltips],
|
||||
[HeaderElements.COMPARE_BUTTON, this._compare(compareFileInput)],
|
||||
[HeaderElements.CLOSE_COMPARE_BUTTON, this._closeCompare(closeCompareMode)],
|
||||
]);
|
||||
@ -135,7 +132,7 @@ export class ViewerHeaderConfigService {
|
||||
private _rotateLeft(addRotation: (type: RotationType) => void): IHeaderElement {
|
||||
return {
|
||||
type: 'actionButton',
|
||||
element: 'tooltips',
|
||||
element: HeaderElements.ROTATE_LEFT_BUTTON,
|
||||
dataElement: HeaderElements.ROTATE_LEFT_BUTTON,
|
||||
img: this._convertPath('/assets/icons/general/rotate-left.svg'),
|
||||
onClick: () => addRotation(RotationTypes.LEFT),
|
||||
@ -145,30 +142,17 @@ export class ViewerHeaderConfigService {
|
||||
private _rotateRight(addRotation: (type: RotationType) => void): IHeaderElement {
|
||||
return {
|
||||
type: 'actionButton',
|
||||
element: 'tooltips',
|
||||
element: HeaderElements.ROTATE_RIGHT_BUTTON,
|
||||
dataElement: HeaderElements.ROTATE_RIGHT_BUTTON,
|
||||
img: this._convertPath('/assets/icons/general/rotate-right.svg'),
|
||||
onClick: () => addRotation(RotationTypes.RIGHT),
|
||||
};
|
||||
}
|
||||
|
||||
private _toggleTooltips(toggleTooltips: (title: string, img: string) => Promise<void>): IHeaderElement {
|
||||
return {
|
||||
type: 'actionButton',
|
||||
element: 'tooltips',
|
||||
dataElement: HeaderElements.TOGGLE_TOOLTIPS,
|
||||
img: this._toggleTooltipsBtnIcon,
|
||||
title: this._toggleTooltipsBtnTitle,
|
||||
onClick: async () => {
|
||||
await toggleTooltips(this._toggleTooltipsBtnTitle, this._toggleTooltipsBtnIcon);
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
private _closeCompare(closeCompareMode: () => Promise<void>): IHeaderElement {
|
||||
return {
|
||||
type: 'actionButton',
|
||||
element: 'closeCompare',
|
||||
element: HeaderElements.CLOSE_COMPARE_BUTTON,
|
||||
dataElement: HeaderElements.CLOSE_COMPARE_BUTTON,
|
||||
img: this._convertPath('/assets/icons/general/pdftron-action-close-compare.svg'),
|
||||
title: 'Leave Compare Mode',
|
||||
@ -181,7 +165,7 @@ export class ViewerHeaderConfigService {
|
||||
private _compare(compareFileInput: ElementRef): IHeaderElement {
|
||||
return {
|
||||
type: 'actionButton',
|
||||
element: 'compare',
|
||||
element: HeaderElements.COMPARE_BUTTON,
|
||||
dataElement: HeaderElements.COMPARE_BUTTON,
|
||||
img: this._convertPath('/assets/icons/general/pdftron-action-compare.svg'),
|
||||
title: 'Compare',
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user