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.
33 lines • 9.2 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "../../pdf-notification-service";
export class PdfHighlightEditorComponent {
notificationService;
show = true;
isSelected = false;
constructor(notificationService) {
this.notificationService = notificationService;
const subscription = this.notificationService.onPDFJSInit.subscribe(() => {
this.onPdfJsInit();
subscription.unsubscribe();
});
}
onPdfJsInit() {
const PDFViewerApplication = window.PDFViewerApplication;
PDFViewerApplication.eventBus.on('annotationeditormodechanged', ({ mode }) => (this.isSelected = mode === 3));
}
onClick() {
document.getElementById('editorFreeText')?.click();
// const PDFViewerApplication: IPDFViewerApplication = (window as any).PDFViewerApplication;
// PDFViewerApplication.eventBus.dispatch('annotationeditormodechanged', { mode: 3 });
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: PdfHighlightEditorComponent, deps: [{ token: i1.PDFNotificationService }], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.7", type: PdfHighlightEditorComponent, selector: "pdf-highlight-editor", inputs: { show: "show" }, ngImport: i0, template: "<!--\n<pdf-shy-button\n title=\"Draw\"\n primaryToolbarId=\"editorHighlight\"\n [cssClass]=\"show | responsiveCSSClass : 'hiddenTinyView'\"\n l10nId=\"pdfjs-editor-free-text-button\"\n l10nLabel=\"pdfjs-editor-free-text-button-label\"\n [order]=\"4100\"\n [action]=\"onClick\"\n [toggled]=\"isSelected\"\n [closeOnClick]=\"true\"\n image=\"<svg style='width: 20px; height: 20px' viewBox='0 0 24 24'> <path fill='currentColor' d='M18.5,4L19.66,8.35L18.7,8.61C18.25,7.74 17.79,6.87 17.26,6.43C16.73,6 16.11,6 15.5,6H13V16.5C13,17 13,17.5 13.33,17.75C13.67,18 14.33,18 15,18V19H9V18C9.67,18 10.33,18 10.67,17.75C11,17.5 11,17 11,16.5V6H8.5C7.89,6 7.27,6 6.74,6.43C6.21,6.87 5.75,7.74 5.3,8.61L4.34,8.35L5.5,4H18.5Z' /> </svg>\"\n>\n</pdf-shy-button>\n-->\n<button id=\"editorHighlight\" class=\"toolbarButton\" hidden=\"true\" disabled=\"disabled\" title=\"Highlight\" role=\"radio\" aria-checked=\"false\" aria-controls=\"editorHighlightParamsToolbar\" tabindex=\"31\" data-l10n-id=\"pdfjs-editor-highlight-button\">\n <span data-l10n-id=\"pdfjs-editor-highlight-button-label\">Highlight</span>\n</button>\n", styles: ["button{padding:0}\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.7", ngImport: i0, type: PdfHighlightEditorComponent, decorators: [{
type: Component,
args: [{ selector: 'pdf-highlight-editor', template: "<!--\n<pdf-shy-button\n title=\"Draw\"\n primaryToolbarId=\"editorHighlight\"\n [cssClass]=\"show | responsiveCSSClass : 'hiddenTinyView'\"\n l10nId=\"pdfjs-editor-free-text-button\"\n l10nLabel=\"pdfjs-editor-free-text-button-label\"\n [order]=\"4100\"\n [action]=\"onClick\"\n [toggled]=\"isSelected\"\n [closeOnClick]=\"true\"\n image=\"<svg style='width: 20px; height: 20px' viewBox='0 0 24 24'> <path fill='currentColor' d='M18.5,4L19.66,8.35L18.7,8.61C18.25,7.74 17.79,6.87 17.26,6.43C16.73,6 16.11,6 15.5,6H13V16.5C13,17 13,17.5 13.33,17.75C13.67,18 14.33,18 15,18V19H9V18C9.67,18 10.33,18 10.67,17.75C11,17.5 11,17 11,16.5V6H8.5C7.89,6 7.27,6 6.74,6.43C6.21,6.87 5.75,7.74 5.3,8.61L4.34,8.35L5.5,4H18.5Z' /> </svg>\"\n>\n</pdf-shy-button>\n-->\n<button id=\"editorHighlight\" class=\"toolbarButton\" hidden=\"true\" disabled=\"disabled\" title=\"Highlight\" role=\"radio\" aria-checked=\"false\" aria-controls=\"editorHighlightParamsToolbar\" tabindex=\"31\" data-l10n-id=\"pdfjs-editor-highlight-button\">\n <span data-l10n-id=\"pdfjs-editor-highlight-button-label\">Highlight</span>\n</button>\n", styles: ["button{padding:0}\n"] }]
}], ctorParameters: () => [{ type: i1.PDFNotificationService }], propDecorators: { show: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGRmLWhpZ2hsaWdodC1lZGl0b3IuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmd4LWV4dGVuZGVkLXBkZi12aWV3ZXIvc3JjL2xpYi90b29sYmFyL3BkZi1oaWdobGlnaHQtZWRpdG9yL3BkZi1oaWdobGlnaHQtZWRpdG9yLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1leHRlbmRlZC1wZGYtdmlld2VyL3NyYy9saWIvdG9vbGJhci9wZGYtaGlnaGxpZ2h0LWVkaXRvci9wZGYtaGlnaGxpZ2h0LWVkaXRvci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBV2pELE1BQU0sT0FBTywyQkFBMkI7SUFNbEI7SUFKYixJQUFJLEdBQXlCLElBQUksQ0FBQztJQUVsQyxVQUFVLEdBQUcsS0FBSyxDQUFDO0lBRTFCLFlBQW9CLG1CQUEyQztRQUEzQyx3QkFBbUIsR0FBbkIsbUJBQW1CLENBQXdCO1FBQzdELE1BQU0sWUFBWSxHQUFHLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxXQUFXLENBQUMsU0FBUyxDQUFDLEdBQUcsRUFBRTtZQUN2RSxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7WUFDbkIsWUFBWSxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQzdCLENBQUMsQ0FBQyxDQUFDO0lBQ0wsQ0FBQztJQUVPLFdBQVc7UUFDakIsTUFBTSxvQkFBb0IsR0FBMkIsTUFBYyxDQUFDLG9CQUFvQixDQUFDO1FBQ3pGLG9CQUFvQixDQUFDLFFBQVEsQ0FBQyxFQUFFLENBQUMsNkJBQTZCLEVBQUUsQ0FBQyxFQUFFLElBQUksRUFBMEMsRUFBRSxFQUFFLENBQUMsQ0FBQyxJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ3hKLENBQUM7SUFFTSxPQUFPO1FBQ1osUUFBUSxDQUFDLGNBQWMsQ0FBQyxnQkFBZ0IsQ0FBQyxFQUFFLEtBQUssRUFBRSxDQUFDO1FBQ25ELCtGQUErRjtRQUMvRix5RkFBeUY7SUFDM0YsQ0FBQzt1R0F0QlUsMkJBQTJCOzJGQUEzQiwyQkFBMkIsc0ZDWHhDLDhsQ0FrQkE7OzJGRFBhLDJCQUEyQjtrQkFMdkMsU0FBUzsrQkFDRSxzQkFBc0I7MkZBTXpCLElBQUk7c0JBRFYsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEFubm90YXRpb25FZGl0b3JFZGl0b3JNb2RlQ2hhbmdlZEV2ZW50IH0gZnJvbSAnLi4vLi4vZXZlbnRzL2Fubm90YXRpb24tZWRpdG9yLW1vZGUtY2hhbmdlZC1ldmVudCc7XG5pbXBvcnQgeyBJUERGVmlld2VyQXBwbGljYXRpb24gfSBmcm9tICcuLi8uLi9vcHRpb25zL3BkZi12aWV3ZXItYXBwbGljYXRpb24nO1xuaW1wb3J0IHsgUERGTm90aWZpY2F0aW9uU2VydmljZSB9IGZyb20gJy4uLy4uL3BkZi1ub3RpZmljYXRpb24tc2VydmljZSc7XG5pbXBvcnQgeyBSZXNwb25zaXZlVmlzaWJpbGl0eSB9IGZyb20gJy4uLy4uL3Jlc3BvbnNpdmUtdmlzaWJpbGl0eSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3BkZi1oaWdobGlnaHQtZWRpdG9yJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3BkZi1oaWdobGlnaHQtZWRpdG9yLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vcGRmLWhpZ2hsaWdodC1lZGl0b3IuY29tcG9uZW50LmNzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBQZGZIaWdobGlnaHRFZGl0b3JDb21wb25lbnQge1xuICBASW5wdXQoKVxuICBwdWJsaWMgc2hvdzogUmVzcG9uc2l2ZVZpc2liaWxpdHkgPSB0cnVlO1xuXG4gIHB1YmxpYyBpc1NlbGVjdGVkID0gZmFsc2U7XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBub3RpZmljYXRpb25TZXJ2aWNlOiBQREZOb3RpZmljYXRpb25TZXJ2aWNlKSB7XG4gICAgY29uc3Qgc3Vic2NyaXB0aW9uID0gdGhpcy5ub3RpZmljYXRpb25TZXJ2aWNlLm9uUERGSlNJbml0LnN1YnNjcmliZSgoKSA9PiB7XG4gICAgICB0aGlzLm9uUGRmSnNJbml0KCk7XG4gICAgICBzdWJzY3JpcHRpb24udW5zdWJzY3JpYmUoKTtcbiAgICB9KTtcbiAgfVxuXG4gIHByaXZhdGUgb25QZGZKc0luaXQoKSB7XG4gICAgY29uc3QgUERGVmlld2VyQXBwbGljYXRpb246IElQREZWaWV3ZXJBcHBsaWNhdGlvbiA9ICh3aW5kb3cgYXMgYW55KS5QREZWaWV3ZXJBcHBsaWNhdGlvbjtcbiAgICBQREZWaWV3ZXJBcHBsaWNhdGlvbi5ldmVudEJ1cy5vbignYW5ub3RhdGlvbmVkaXRvcm1vZGVjaGFuZ2VkJywgKHsgbW9kZSB9OiBBbm5vdGF0aW9uRWRpdG9yRWRpdG9yTW9kZUNoYW5nZWRFdmVudCkgPT4gKHRoaXMuaXNTZWxlY3RlZCA9IG1vZGUgPT09IDMpKTtcbiAgfVxuXG4gIHB1YmxpYyBvbkNsaWNrKCk6IHZvaWQge1xuICAgIGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCdlZGl0b3JGcmVlVGV4dCcpPy5jbGljaygpO1xuICAgIC8vICAgIGNvbnN0IFBERlZpZXdlckFwcGxpY2F0aW9uOiBJUERGVmlld2VyQXBwbGljYXRpb24gPSAod2luZG93IGFzIGFueSkuUERGVmlld2VyQXBwbGljYXRpb247XG4gICAgLy8gICAgUERGVmlld2VyQXBwbGljYXRpb24uZXZlbnRCdXMuZGlzcGF0Y2goJ2Fubm90YXRpb25lZGl0b3Jtb2RlY2hhbmdlZCcsIHsgbW9kZTogMyB9KTtcbiAgfVxufVxuIiwiPCEtLVxuPHBkZi1zaHktYnV0dG9uXG4gIHRpdGxlPVwiRHJhd1wiXG4gIHByaW1hcnlUb29sYmFySWQ9XCJlZGl0b3JIaWdobGlnaHRcIlxuICBbY3NzQ2xhc3NdPVwic2hvdyB8IHJlc3BvbnNpdmVDU1NDbGFzcyA6ICdoaWRkZW5UaW55VmlldydcIlxuICBsMTBuSWQ9XCJwZGZqcy1lZGl0b3ItZnJlZS10ZXh0LWJ1dHRvblwiXG4gIGwxMG5MYWJlbD1cInBkZmpzLWVkaXRvci1mcmVlLXRleHQtYnV0dG9uLWxhYmVsXCJcbiAgW29yZGVyXT1cIjQxMDBcIlxuICBbYWN0aW9uXT1cIm9uQ2xpY2tcIlxuICBbdG9nZ2xlZF09XCJpc1NlbGVjdGVkXCJcbiAgW2Nsb3NlT25DbGlja109XCJ0cnVlXCJcbiAgaW1hZ2U9XCI8c3ZnIHN0eWxlPSd3aWR0aDogMjBweDsgaGVpZ2h0OiAyMHB4JyB2aWV3Qm94PScwIDAgMjQgMjQnPiA8cGF0aCBmaWxsPSdjdXJyZW50Q29sb3InIGQ9J00xOC41LDRMMTkuNjYsOC4zNUwxOC43LDguNjFDMTguMjUsNy43NCAxNy43OSw2Ljg3IDE3LjI2LDYuNDNDMTYuNzMsNiAxNi4xMSw2IDE1LjUsNkgxM1YxNi41QzEzLDE3IDEzLDE3LjUgMTMuMzMsMTcuNzVDMTMuNjcsMTggMTQuMzMsMTggMTUsMThWMTlIOVYxOEM5LjY3LDE4IDEwLjMzLDE4IDEwLjY3LDE3Ljc1QzExLDE3LjUgMTEsMTcgMTEsMTYuNVY2SDguNUM3Ljg5LDYgNy4yNyw2IDYuNzQsNi40M0M2LjIxLDYuODcgNS43NSw3Ljc0IDUuMyw4LjYxTDQuMzQsOC4zNUw1LjUsNEgxOC41WicgLz4gPC9zdmc+XCJcbj5cbjwvcGRmLXNoeS1idXR0b24+XG4tLT5cbjxidXR0b24gaWQ9XCJlZGl0b3JIaWdobGlnaHRcIiBjbGFzcz1cInRvb2xiYXJCdXR0b25cIiBoaWRkZW49XCJ0cnVlXCIgZGlzYWJsZWQ9XCJkaXNhYmxlZFwiIHRpdGxlPVwiSGlnaGxpZ2h0XCIgcm9sZT1cInJhZGlvXCIgYXJpYS1jaGVja2VkPVwiZmFsc2VcIiBhcmlhLWNvbnRyb2xzPVwiZWRpdG9ySGlnaGxpZ2h0UGFyYW1zVG9vbGJhclwiIHRhYmluZGV4PVwiMzFcIiBkYXRhLWwxMG4taWQ9XCJwZGZqcy1lZGl0b3ItaGlnaGxpZ2h0LWJ1dHRvblwiPlxuICA8c3BhbiBkYXRhLWwxMG4taWQ9XCJwZGZqcy1lZGl0b3ItaGlnaGxpZ2h0LWJ1dHRvbi1sYWJlbFwiPkhpZ2hsaWdodDwvc3Bhbj5cbjwvYnV0dG9uPlxuIl19