ngx-extended-pdf-viewer
Version:
Embedding PDF files in your Angular application. Highly configurable viewer including the toolbar, sidebar, and all the features you're used to.
62 lines • 13.2 kB
JavaScript
import { Component, Input, effect } from '@angular/core';
import { PositioningService } from '../../dynamic-css/positioning.service';
import { AnnotationEditorType } from '../../options/editor-annotations';
import * as i0 from "@angular/core";
import * as i1 from "../../pdf-notification-service";
import * as i2 from "../../focus-management.service";
import * as i3 from "../pdf-shy-button/pdf-shy-button.component";
import * as i4 from "../../responsive-visibility";
export class PdfHighlightEditorComponent {
cdr;
focusManagement;
show = true;
isSelected = false;
PDFViewerApplication;
constructor(notificationService, cdr, focusManagement) {
this.cdr = cdr;
this.focusManagement = focusManagement;
effect(() => {
this.PDFViewerApplication = notificationService.onPDFJSInitSignal();
if (this.PDFViewerApplication) {
this.onPdfJsInit();
}
});
}
onPdfJsInit() {
this.PDFViewerApplication?.eventBus.on('annotationeditormodechanged', ({ mode }) => {
setTimeout(() => {
const wasSelected = this.isSelected;
this.isSelected = mode === 9;
// Focus management
if (!wasSelected && this.isSelected) {
// Dialog just opened
this.focusManagement.moveFocusToDialog('editorHighlightParamsToolbar', 'Highlight editor toolbar opened', 'primaryEditorHighlight');
}
else if (wasSelected && !this.isSelected) {
// Dialog just closed
this.focusManagement.returnFocusToPrevious('Highlight editor toolbar closed');
}
this.cdr.detectChanges();
});
});
}
onClick(event) {
const currentMode = this.PDFViewerApplication?.pdfViewer.annotationEditorMode;
this.PDFViewerApplication?.eventBus.dispatch('switchannotationeditormode', {
source: this,
mode: currentMode === AnnotationEditorType.HIGHLIGHT ? AnnotationEditorType.NONE : AnnotationEditorType.HIGHLIGHT,
isFromKeyboard: event.detail === 0,
});
const positioningService = new PositioningService();
positioningService.positionPopupBelowItsButton('primaryEditorHighlight', 'editorHighlightParamsToolbar');
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PdfHighlightEditorComponent, deps: [{ token: i1.PDFNotificationService }, { token: i0.ChangeDetectorRef }, { token: i2.FocusManagementService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PdfHighlightEditorComponent, selector: "pdf-highlight-editor", inputs: { show: "show" }, ngImport: i0, template: "<pdf-shy-button\n title=\"Highlight\"\n primaryToolbarId=\"primaryEditorHighlight\"\n [cssClass]=\"show | responsiveCSSClass : 'hiddenTinyView'\"\n l10nId=\"pdfjs-editor-highlight-button\"\n l10nLabel=\"pdfjs-editor-highlight-button-label\"\n role=\"radio\"\n ariaHasPopup=\"true\"\n ariaControls=\"editorHighlightParamsToolbar\"\n [order]=\"4050\"\n [action]=\"onClick\"\n [toggled]=\"isSelected\"\n [closeOnClick]=\"true\"\n image=\"<svg aria-hidden='true' focusable='false' width='20px' height='20px' viewBox='0 0 24 24'> <path fill='currentColor' d='M18.5,1.15C17.97,1.15 17.46,1.34 17.07,1.73L11.26,7.55L16.91,13.2L22.73,7.39C23.5,6.61 23.5,5.35 22.73,4.56L19.89,1.73C19.5,1.34 19,1.15 18.5,1.15M10.3,8.5L4.34,14.46C3.56,15.24 3.56,16.5 4.36,17.31C3.14,18.54 1.9,19.77 0.67,21H6.33L7.19,20.14C7.97,20.9 9.22,20.89 10,20.12L15.95,14.16' /></svg>\"\n>\n</pdf-shy-button>\n", styles: ["button{padding:0}\n"], dependencies: [{ kind: "component", type: i3.PdfShyButtonComponent, selector: "pdf-shy-button", inputs: ["primaryToolbarId", "secondaryMenuId", "cssClass", "eventBusName", "l10nId", "l10nLabel", "title", "toggled", "disabled", "order", "action", "closeOnClick", "onlySecondaryMenu", "ariaHasPopup", "ariaControls", "role", "image"] }, { kind: "pipe", type: i4.ResponsiveCSSClassPipe, name: "responsiveCSSClass" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PdfHighlightEditorComponent, decorators: [{
type: Component,
args: [{ selector: 'pdf-highlight-editor', template: "<pdf-shy-button\n title=\"Highlight\"\n primaryToolbarId=\"primaryEditorHighlight\"\n [cssClass]=\"show | responsiveCSSClass : 'hiddenTinyView'\"\n l10nId=\"pdfjs-editor-highlight-button\"\n l10nLabel=\"pdfjs-editor-highlight-button-label\"\n role=\"radio\"\n ariaHasPopup=\"true\"\n ariaControls=\"editorHighlightParamsToolbar\"\n [order]=\"4050\"\n [action]=\"onClick\"\n [toggled]=\"isSelected\"\n [closeOnClick]=\"true\"\n image=\"<svg aria-hidden='true' focusable='false' width='20px' height='20px' viewBox='0 0 24 24'> <path fill='currentColor' d='M18.5,1.15C17.97,1.15 17.46,1.34 17.07,1.73L11.26,7.55L16.91,13.2L22.73,7.39C23.5,6.61 23.5,5.35 22.73,4.56L19.89,1.73C19.5,1.34 19,1.15 18.5,1.15M10.3,8.5L4.34,14.46C3.56,15.24 3.56,16.5 4.36,17.31C3.14,18.54 1.9,19.77 0.67,21H6.33L7.19,20.14C7.97,20.9 9.22,20.89 10,20.12L15.95,14.16' /></svg>\"\n>\n</pdf-shy-button>\n", styles: ["button{padding:0}\n"] }]
}], ctorParameters: () => [{ type: i1.PDFNotificationService }, { type: i0.ChangeDetectorRef }, { type: i2.FocusManagementService }], propDecorators: { show: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGRmLWhpZ2hsaWdodC1lZGl0b3IuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWV4dGVuZGVkLXBkZi12aWV3ZXIvc3JjL2xpYi90b29sYmFyL3BkZi1oaWdobGlnaHQtZWRpdG9yL3BkZi1oaWdobGlnaHQtZWRpdG9yLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1leHRlbmRlZC1wZGYtdmlld2VyL3NyYy9saWIvdG9vbGJhci9wZGYtaGlnaGxpZ2h0LWVkaXRvci9wZGYtaGlnaGxpZ2h0LWVkaXRvci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQXFCLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzVFLE9BQU8sRUFBRSxrQkFBa0IsRUFBRSxNQUFNLHVDQUF1QyxDQUFDO0FBRzNFLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLGtDQUFrQyxDQUFDOzs7Ozs7QUFVeEUsTUFBTSxPQUFPLDJCQUEyQjtJQVU1QjtJQUNBO0lBVEgsSUFBSSxHQUF5QixJQUFJLENBQUM7SUFFbEMsVUFBVSxHQUFHLEtBQUssQ0FBQztJQUVsQixvQkFBb0IsQ0FBb0M7SUFFaEUsWUFDRSxtQkFBMkMsRUFDbkMsR0FBc0IsRUFDdEIsZUFBdUM7UUFEdkMsUUFBRyxHQUFILEdBQUcsQ0FBbUI7UUFDdEIsb0JBQWUsR0FBZixlQUFlLENBQXdCO1FBRS9DLE1BQU0sQ0FBQyxHQUFHLEVBQUU7WUFDVixJQUFJLENBQUMsb0JBQW9CLEdBQUcsbUJBQW1CLENBQUMsaUJBQWlCLEVBQUUsQ0FBQztZQUNwRSxJQUFJLElBQUksQ0FBQyxvQkFBb0IsRUFBRTtnQkFDN0IsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO2FBQ3BCO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRU8sV0FBVztRQUNqQixJQUFJLENBQUMsb0JBQW9CLEVBQUUsUUFBUSxDQUFDLEVBQUUsQ0FBQyw2QkFBNkIsRUFBRSxDQUFDLEVBQUUsSUFBSSxFQUEwQyxFQUFFLEVBQUU7WUFDekgsVUFBVSxDQUFDLEdBQUcsRUFBRTtnQkFDZCxNQUFNLFdBQVcsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDO2dCQUNwQyxJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksS0FBSyxDQUFDLENBQUM7Z0JBRTdCLG1CQUFtQjtnQkFDbkIsSUFBSSxDQUFDLFdBQVcsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO29CQUNuQyxxQkFBcUI7b0JBQ3JCLElBQUksQ0FBQyxlQUFlLENBQUMsaUJBQWlCLENBQUMsOEJBQThCLEVBQUUsaUNBQWlDLEVBQUUsd0JBQXdCLENBQUMsQ0FBQztpQkFDckk7cUJBQU0sSUFBSSxXQUFXLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxFQUFFO29CQUMxQyxxQkFBcUI7b0JBQ3JCLElBQUksQ0FBQyxlQUFlLENBQUMscUJBQXFCLENBQUMsaUNBQWlDLENBQUMsQ0FBQztpQkFDL0U7Z0JBRUQsSUFBSSxDQUFDLEdBQUcsQ0FBQyxhQUFhLEVBQUUsQ0FBQztZQUMzQixDQUFDLENBQUMsQ0FBQztRQUNMLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVNLE9BQU8sQ0FBQyxLQUFtQjtRQUNoQyxNQUFNLFdBQVcsR0FBRyxJQUFJLENBQUMsb0JBQW9CLEVBQUUsU0FBUyxDQUFDLG9CQUFvQixDQUFDO1FBQzlFLElBQUksQ0FBQyxvQkFBb0IsRUFBRSxRQUFRLENBQUMsUUFBUSxDQUFDLDRCQUE0QixFQUFFO1lBQ3pFLE1BQU0sRUFBRSxJQUFJO1lBQ1osSUFBSSxFQUFFLFdBQVcsS0FBSyxvQkFBb0IsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLG9CQUFvQixDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsb0JBQW9CLENBQUMsU0FBUztZQUNqSCxjQUFjLEVBQUUsS0FBSyxDQUFDLE1BQU0sS0FBSyxDQUFDO1NBQ25DLENBQUMsQ0FBQztRQUNILE1BQU0sa0JBQWtCLEdBQUcsSUFBSSxrQkFBa0IsRUFBRSxDQUFDO1FBQ3BELGtCQUFrQixDQUFDLDJCQUEyQixDQUFDLHdCQUF3QixFQUFFLDhCQUE4QixDQUFDLENBQUM7SUFDM0csQ0FBQzt3R0FsRFUsMkJBQTJCOzRGQUEzQiwyQkFBMkIsc0ZDZHhDLDAzQkFnQkE7OzRGREZhLDJCQUEyQjtrQkFMdkMsU0FBUzsrQkFDRSxzQkFBc0I7Z0tBTXpCLElBQUk7c0JBRFYsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdG9yUmVmLCBDb21wb25lbnQsIElucHV0LCBlZmZlY3QgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFBvc2l0aW9uaW5nU2VydmljZSB9IGZyb20gJy4uLy4uL2R5bmFtaWMtY3NzL3Bvc2l0aW9uaW5nLnNlcnZpY2UnO1xuaW1wb3J0IHsgQW5ub3RhdGlvbkVkaXRvckVkaXRvck1vZGVDaGFuZ2VkRXZlbnQgfSBmcm9tICcuLi8uLi9ldmVudHMvYW5ub3RhdGlvbi1lZGl0b3ItbW9kZS1jaGFuZ2VkLWV2ZW50JztcbmltcG9ydCB7IEZvY3VzTWFuYWdlbWVudFNlcnZpY2UgfSBmcm9tICcuLi8uLi9mb2N1cy1tYW5hZ2VtZW50LnNlcnZpY2UnO1xuaW1wb3J0IHsgQW5ub3RhdGlvbkVkaXRvclR5cGUgfSBmcm9tICcuLi8uLi9vcHRpb25zL2VkaXRvci1hbm5vdGF0aW9ucyc7XG5pbXBvcnQgeyBJUERGVmlld2VyQXBwbGljYXRpb24gfSBmcm9tICcuLi8uLi9vcHRpb25zL3BkZi12aWV3ZXItYXBwbGljYXRpb24nO1xuaW1wb3J0IHsgUERGTm90aWZpY2F0aW9uU2VydmljZSB9IGZyb20gJy4uLy4uL3BkZi1ub3RpZmljYXRpb24tc2VydmljZSc7XG5pbXBvcnQgeyBSZXNwb25zaXZlVmlzaWJpbGl0eSB9IGZyb20gJy4uLy4uL3Jlc3BvbnNpdmUtdmlzaWJpbGl0eSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3BkZi1oaWdobGlnaHQtZWRpdG9yJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3BkZi1oaWdobGlnaHQtZWRpdG9yLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vcGRmLWhpZ2hsaWdodC1lZGl0b3IuY29tcG9uZW50LmNzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBQZGZIaWdobGlnaHRFZGl0b3JDb21wb25lbnQge1xuICBASW5wdXQoKVxuICBwdWJsaWMgc2hvdzogUmVzcG9uc2l2ZVZpc2liaWxpdHkgPSB0cnVlO1xuXG4gIHB1YmxpYyBpc1NlbGVjdGVkID0gZmFsc2U7XG5cbiAgcHJpdmF0ZSBQREZWaWV3ZXJBcHBsaWNhdGlvbjogSVBERlZpZXdlckFwcGxpY2F0aW9uIHwgdW5kZWZpbmVkO1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIG5vdGlmaWNhdGlvblNlcnZpY2U6IFBERk5vdGlmaWNhdGlvblNlcnZpY2UsXG4gICAgcHJpdmF0ZSBjZHI6IENoYW5nZURldGVjdG9yUmVmLFxuICAgIHByaXZhdGUgZm9jdXNNYW5hZ2VtZW50OiBGb2N1c01hbmFnZW1lbnRTZXJ2aWNlLFxuICApIHtcbiAgICBlZmZlY3QoKCkgPT4ge1xuICAgICAgdGhpcy5QREZWaWV3ZXJBcHBsaWNhdGlvbiA9IG5vdGlmaWNhdGlvblNlcnZpY2Uub25QREZKU0luaXRTaWduYWwoKTtcbiAgICAgIGlmICh0aGlzLlBERlZpZXdlckFwcGxpY2F0aW9uKSB7XG4gICAgICAgIHRoaXMub25QZGZKc0luaXQoKTtcbiAgICAgIH1cbiAgICB9KTtcbiAgfVxuXG4gIHByaXZhdGUgb25QZGZKc0luaXQoKSB7XG4gICAgdGhpcy5QREZWaWV3ZXJBcHBsaWNhdGlvbj8uZXZlbnRCdXMub24oJ2Fubm90YXRpb25lZGl0b3Jtb2RlY2hhbmdlZCcsICh7IG1vZGUgfTogQW5ub3RhdGlvbkVkaXRvckVkaXRvck1vZGVDaGFuZ2VkRXZlbnQpID0+IHtcbiAgICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgICBjb25zdCB3YXNTZWxlY3RlZCA9IHRoaXMuaXNTZWxlY3RlZDtcbiAgICAgICAgdGhpcy5pc1NlbGVjdGVkID0gbW9kZSA9PT0gOTtcblxuICAgICAgICAvLyBGb2N1cyBtYW5hZ2VtZW50XG4gICAgICAgIGlmICghd2FzU2VsZWN0ZWQgJiYgdGhpcy5pc1NlbGVjdGVkKSB7XG4gICAgICAgICAgLy8gRGlhbG9nIGp1c3Qgb3BlbmVkXG4gICAgICAgICAgdGhpcy5mb2N1c01hbmFnZW1lbnQubW92ZUZvY3VzVG9EaWFsb2coJ2VkaXRvckhpZ2hsaWdodFBhcmFtc1Rvb2xiYXInLCAnSGlnaGxpZ2h0IGVkaXRvciB0b29sYmFyIG9wZW5lZCcsICdwcmltYXJ5RWRpdG9ySGlnaGxpZ2h0Jyk7XG4gICAgICAgIH0gZWxzZSBpZiAod2FzU2VsZWN0ZWQgJiYgIXRoaXMuaXNTZWxlY3RlZCkge1xuICAgICAgICAgIC8vIERpYWxvZyBqdXN0IGNsb3NlZFxuICAgICAgICAgIHRoaXMuZm9jdXNNYW5hZ2VtZW50LnJldHVybkZvY3VzVG9QcmV2aW91cygnSGlnaGxpZ2h0IGVkaXRvciB0b29sYmFyIGNsb3NlZCcpO1xuICAgICAgICB9XG5cbiAgICAgICAgdGhpcy5jZHIuZGV0ZWN0Q2hhbmdlcygpO1xuICAgICAgfSk7XG4gICAgfSk7XG4gIH1cblxuICBwdWJsaWMgb25DbGljayhldmVudDogUG9pbnRlckV2ZW50KTogdm9pZCB7XG4gICAgY29uc3QgY3VycmVudE1vZGUgPSB0aGlzLlBERlZpZXdlckFwcGxpY2F0aW9uPy5wZGZWaWV3ZXIuYW5ub3RhdGlvbkVkaXRvck1vZGU7XG4gICAgdGhpcy5QREZWaWV3ZXJBcHBsaWNhdGlvbj8uZXZlbnRCdXMuZGlzcGF0Y2goJ3N3aXRjaGFubm90YXRpb25lZGl0b3Jtb2RlJywge1xuICAgICAgc291cmNlOiB0aGlzLFxuICAgICAgbW9kZTogY3VycmVudE1vZGUgPT09IEFubm90YXRpb25FZGl0b3JUeXBlLkhJR0hMSUdIVCA/IEFubm90YXRpb25FZGl0b3JUeXBlLk5PTkUgOiBBbm5vdGF0aW9uRWRpdG9yVHlwZS5ISUdITElHSFQsXG4gICAgICBpc0Zyb21LZXlib2FyZDogZXZlbnQuZGV0YWlsID09PSAwLFxuICAgIH0pO1xuICAgIGNvbnN0IHBvc2l0aW9uaW5nU2VydmljZSA9IG5ldyBQb3NpdGlvbmluZ1NlcnZpY2UoKTtcbiAgICBwb3NpdGlvbmluZ1NlcnZpY2UucG9zaXRpb25Qb3B1cEJlbG93SXRzQnV0dG9uKCdwcmltYXJ5RWRpdG9ySGlnaGxpZ2h0JywgJ2VkaXRvckhpZ2hsaWdodFBhcmFtc1Rvb2xiYXInKTtcbiAgfVxufVxuIiwiPHBkZi1zaHktYnV0dG9uXG4gIHRpdGxlPVwiSGlnaGxpZ2h0XCJcbiAgcHJpbWFyeVRvb2xiYXJJZD1cInByaW1hcnlFZGl0b3JIaWdobGlnaHRcIlxuICBbY3NzQ2xhc3NdPVwic2hvdyB8IHJlc3BvbnNpdmVDU1NDbGFzcyA6ICdoaWRkZW5UaW55VmlldydcIlxuICBsMTBuSWQ9XCJwZGZqcy1lZGl0b3ItaGlnaGxpZ2h0LWJ1dHRvblwiXG4gIGwxMG5MYWJlbD1cInBkZmpzLWVkaXRvci1oaWdobGlnaHQtYnV0dG9uLWxhYmVsXCJcbiAgcm9sZT1cInJhZGlvXCJcbiAgYXJpYUhhc1BvcHVwPVwidHJ1ZVwiXG4gIGFyaWFDb250cm9scz1cImVkaXRvckhpZ2hsaWdodFBhcmFtc1Rvb2xiYXJcIlxuICBbb3JkZXJdPVwiNDA1MFwiXG4gIFthY3Rpb25dPVwib25DbGlja1wiXG4gIFt0b2dnbGVkXT1cImlzU2VsZWN0ZWRcIlxuICBbY2xvc2VPbkNsaWNrXT1cInRydWVcIlxuICBpbWFnZT1cIjxzdmcgYXJpYS1oaWRkZW49J3RydWUnIGZvY3VzYWJsZT0nZmFsc2UnIHdpZHRoPScyMHB4JyBoZWlnaHQ9JzIwcHgnIHZpZXdCb3g9JzAgMCAyNCAyNCc+IDxwYXRoIGZpbGw9J2N1cnJlbnRDb2xvcicgZD0nTTE4LjUsMS4xNUMxNy45NywxLjE1IDE3LjQ2LDEuMzQgMTcuMDcsMS43M0wxMS4yNiw3LjU1TDE2LjkxLDEzLjJMMjIuNzMsNy4zOUMyMy41LDYuNjEgMjMuNSw1LjM1IDIyLjczLDQuNTZMMTkuODksMS43M0MxOS41LDEuMzQgMTksMS4xNSAxOC41LDEuMTVNMTAuMyw4LjVMNC4zNCwxNC40NkMzLjU2LDE1LjI0IDMuNTYsMTYuNSA0LjM2LDE3LjMxQzMuMTQsMTguNTQgMS45LDE5Ljc3IDAuNjcsMjFINi4zM0w3LjE5LDIwLjE0QzcuOTcsMjAuOSA5LjIyLDIwLjg5IDEwLDIwLjEyTDE1Ljk1LDE0LjE2JyAvPjwvc3ZnPlwiXG4+XG48L3BkZi1zaHktYnV0dG9uPlxuIl19