@pdftools/four-heights-pdf-web-viewer 4.3.6

package/es6/pdf-viewer-canvas/CanvasEvents.js

@@ -0,0 +1,345 @@
+/** internal */
+export class CanvasEvents {
+    constructor(element) {
+        this.eventListeners = new Map();
+        this.trackEvents = true;
+        this.startPosX = 0;
+        this.startPosY = 0;
+        this.multiTouch = false;
+        this.pinch = false;
+        this.dragging = false;
+        this.lastTouchPosX = 0;
+        this.lastTouchPosY = 0;
+        this.lastPinchDiv = 0;
+        this.lastPinchPosX = 0;
+        this.lastPinchPosY = 0;
+        this.lastTouchX1 = 0;
+        this.lastTouchY1 = 0;
+        this.lastTouchX2 = 0;
+        this.lastTouchY2 = 0;
+        this.clickTimer = null;
+        this.clickDuration = 250;
+        this.dblClickTimer = null;
+        this.dblClickDuration = 250;
+        this.longPressTimer = null;
+        this.longPressDuration = 750;
+        this.onMouseDown = this.onMouseDown.bind(this);
+        this.onTouchStart = this.onTouchStart.bind(this);
+        this.onStart = this.onStart.bind(this);
+        this.onMouseMove = this.onMouseMove.bind(this);
+        this.onTouchMove = this.onTouchMove.bind(this);
+        this.onMove = this.onMove.bind(this);
+        this.onMouseUp = this.onMouseUp.bind(this);
+        this.onTouchEnd = this.onTouchEnd.bind(this);
+        this.onEnd = this.onEnd.bind(this);
+        this.suspend = this.suspend.bind(this);
+        this.resume = this.resume.bind(this);
+        this.element = element;
+        this.element.addEventListener('mousedown', this.onMouseDown, {
+            passive: true,
+        });
+        this.element.addEventListener('mousemove', this.onMouseMove, {
+            passive: true,
+        });
+        this.element.addEventListener('touchstart', this.onTouchStart, {
+            passive: false,
+        });
+        window.addEventListener('pdfwebviewer.DragMoveHandlerStart', () => {
+            this.suspend();
+        }, { passive: true });
+        window.addEventListener('pdfwebviewer.DragMoveHandlerEnd', () => {
+            this.resume();
+        }, { passive: true });
+    }
+    addEventListener(type, listener) {
+        if (this.eventListeners.has(type)) {
+            ;
+            this.eventListeners.get(type).push(listener);
+        }
+        else {
+            this.eventListeners.set(type, [listener]);
+        }
+    }
+    removeEventListener(type, listener) {
+        if (this.eventListeners.has(type)) {
+            let listeners = this.eventListeners.get(type);
+            listeners = listeners.filter((listenerInArray) => listenerInArray !== listener);
+            if (listeners.length !== 0) {
+                this.eventListeners.set(type, listeners);
+            }
+            else {
+                this.eventListeners.delete(type);
+            }
+        }
+    }
+    suspend() {
+        this.trackEvents = false;
+        this.element.removeEventListener('mousemove', this.onMouseMove);
+        window.removeEventListener('touchmove', this.onTouchMove);
+    }
+    resume() {
+        if (!this.trackEvents) {
+            this.trackEvents = true;
+            this.element.addEventListener('mousemove', this.onMouseMove, {
+                passive: true,
+            });
+        }
+    }
+    dispatchEvent(type, args) {
+        if (this.eventListeners.has(type)) {
+            const listeners = this.eventListeners.get(type);
+            listeners.forEach((listener) => listener(args));
+        }
+    }
+    clearClickTimer() {
+        if (this.clickTimer !== null) {
+            window.clearTimeout(this.clickTimer);
+            this.clickTimer = null;
+        }
+    }
+    clearLongPressTimer() {
+        if (this.longPressTimer !== null) {
+            window.clearTimeout(this.longPressTimer);
+            this.longPressTimer = null;
+        }
+    }
+    clearDblClickTimer() {
+        if (this.dblClickTimer !== null) {
+            window.clearTimeout(this.dblClickTimer);
+            this.dblClickTimer = null;
+        }
+    }
+    mouseToCanvasPointerEvent(e) {
+        return {
+            clientX: e.clientX,
+            clientY: e.clientY,
+            movementX: e.movementX,
+            movementY: e.movementY,
+            buttons: e.buttons,
+            type: 'mouse',
+        };
+    }
+    touchToCanvasPointerEvent(e) {
+        const event = {
+            clientX: e.touches[0].clientX,
+            clientY: e.touches[0].clientY,
+            movementX: e.touches[0].clientX - this.lastTouchPosX,
+            movementY: e.touches[0].clientY - this.lastTouchPosY,
+            buttons: e.touches.length === 1 ? 1 : 4,
+            type: 'touch',
+        };
+        this.lastTouchPosX = e.touches[0].clientX;
+        this.lastTouchPosY = e.touches[0].clientY;
+        return event;
+    }
+    getPinchPos(e) {
+        const x1 = e.touches[0].clientX;
+        const y1 = e.touches[0].clientY;
+        const x2 = e.touches[1].clientX;
+        const y2 = e.touches[1].clientY;
+        const vx = Math.abs(x1 - x2);
+        const vy = Math.abs(y1 - y2);
+        const distance = Math.sqrt(vx * vx + vy * vy);
+        const clientX = Math.min(x1, x2) + vx;
+        const clientY = Math.min(y1, y2) + vy;
+        return {
+            clientX,
+            clientY,
+            distance,
+        };
+    }
+    touchToCanvasPointerPinchEvent(e) {
+        const { clientX, clientY, distance } = this.getPinchPos(e);
+        const event = {
+            clientX,
+            clientY,
+            movementX: clientX - this.lastPinchPosX,
+            movementY: clientY - this.lastPinchPosY,
+            distance,
+            movementDistance: distance - this.lastPinchDiv,
+            buttons: 1,
+            type: 'touch',
+        };
+        this.lastPinchPosX = event.clientX;
+        this.lastPinchPosY = event.clientY;
+        this.lastPinchDiv = distance;
+        return event;
+    }
+    onMouseDown(e) {
+        if (this.trackEvents) {
+            const event = this.mouseToCanvasPointerEvent(e);
+            this.onStart(event);
+            window.addEventListener('mouseup', this.onMouseUp, { passive: true });
+        }
+    }
+    onTouchStart(e) {
+        e.preventDefault();
+        // e.stopPropagation()
+        this.pinch = false;
+        if (this.trackEvents) {
+            if (e.touches.length === 0) {
+                return;
+            }
+            else if (e.touches.length === 1) {
+                this.lastTouchPosX = e.touches[0].clientX;
+                this.lastTouchPosY = e.touches[0].clientY;
+                const event = this.touchToCanvasPointerEvent(e);
+                this.onStart(event);
+                window.addEventListener('touchmove', this.onTouchMove, {
+                    passive: false,
+                });
+                window.addEventListener('touchend', this.onTouchEnd, { passive: false });
+            }
+            else if (e.touches.length === 2) {
+                this.clearClickTimer();
+                this.clearDblClickTimer();
+                this.clearLongPressTimer();
+                this.multiTouch = true;
+                const { clientX, clientY, distance } = this.getPinchPos(e);
+                this.lastPinchDiv = distance;
+                this.lastPinchPosX = clientX;
+                this.lastPinchPosY = clientY;
+                this.lastTouchX1 = e.touches[0].clientX;
+                this.lastTouchY1 = e.touches[0].clientY;
+                this.lastTouchX2 = e.touches[1].clientX;
+                this.lastTouchY2 = e.touches[1].clientY;
+                window.addEventListener('touchmove', this.onTouchMove, {
+                    passive: false,
+                });
+                window.addEventListener('touchend', this.onTouchEnd, { passive: false });
+            }
+        }
+    }
+    onStart(e) {
+        this.startPosX = e.clientX;
+        this.startPosY = e.clientY;
+        this.dragging = false;
+        if (!this.dblClickTimer) {
+            this.clickTimer = window.setTimeout(() => {
+                this.clickTimer = null;
+            }, this.clickDuration);
+        }
+        this.longPressTimer = window.setTimeout(() => {
+            this.longPressTimer = null;
+            this.dispatchEvent('pointerlongpress', e);
+        }, this.longPressDuration);
+        this.dispatchEvent('pointerdown', e);
+    }
+    onMouseMove(e) {
+        const event = this.mouseToCanvasPointerEvent(e);
+        this.onMove(event);
+    }
+    onTouchMove(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        if (!e.touches) {
+            return;
+        }
+        if (e.touches.length === 1 && !this.multiTouch) {
+            const event = this.touchToCanvasPointerEvent(e);
+            this.onMove(event);
+        }
+        else if (e.touches.length === 2) {
+            const event = this.touchToCanvasPointerPinchEvent(e);
+            const x1 = e.touches[0].clientX;
+            const y1 = e.touches[0].clientY;
+            const x2 = e.touches[1].clientX;
+            const y2 = e.touches[1].clientY;
+            const dX1 = x1 - this.lastTouchX1;
+            const dY1 = y1 - this.lastTouchY1;
+            const dX2 = x2 - this.lastTouchX2;
+            const dY2 = y2 - this.lastTouchY2;
+            const sX1 = Math.sign(dX1);
+            const sY1 = Math.sign(dY1);
+            const sX2 = Math.sign(dX2);
+            const sY2 = Math.sign(dY2);
+            if ((sX1 === sX2 && sY1 === sY2) ||
+                ((sX1 === sX2 || dX1 === 0 || dX2 === 0) && (sY1 === sY2 || dY1 === 0 || dY2 === 0)) ||
+                Math.max(Math.abs(event.movementX), Math.abs(event.movementY)) >
+                    Math.abs(event.movementDistance)) {
+                event.buttons = 4;
+                this.onMove(event);
+                this.pinch = false;
+            }
+            else {
+                this.dispatchEvent('pinch', event);
+                this.pinch = true;
+            }
+            this.lastTouchX1 = e.touches[0].clientX;
+            this.lastTouchY1 = e.touches[0].clientY;
+            this.lastTouchX2 = e.touches[1].clientX;
+            this.lastTouchY2 = e.touches[1].clientY;
+        }
+    }
+    onMove(e) {
+        this.dispatchEvent('pointermove', e);
+        if (this.clickTimer || this.longPressTimer) {
+            if (Math.abs(this.startPosX - e.clientX) > 5 || Math.abs(this.startPosY - e.clientY) > 5) {
+                this.clearLongPressTimer();
+                this.clearClickTimer();
+                this.dispatchEvent('pointerstartdrag', e);
+                this.dragging = true;
+            }
+        }
+        else if (e.buttons > 0 && !this.dragging) {
+            this.dispatchEvent('pointerstartdrag', e);
+            this.dragging = true;
+        }
+    }
+    onMouseUp(e) {
+        const event = this.mouseToCanvasPointerEvent(e);
+        this.onEnd(event);
+        window.removeEventListener('mouseup', this.onMouseUp);
+    }
+    onTouchEnd(e) {
+        // e.preventDefault()
+        // e.stopPropagation()
+        if (e.touches.length === 0) {
+            this.multiTouch = false;
+            const event = {
+                clientX: this.lastTouchPosX,
+                clientY: this.lastTouchPosY,
+                movementX: 0,
+                movementY: 0,
+                buttons: 0,
+                type: 'touch',
+            };
+            this.onEnd(event);
+            window.removeEventListener('touchmove', this.onTouchMove);
+            window.removeEventListener('touchend', this.onTouchEnd);
+        }
+    }
+    onEnd(e) {
+        this.dispatchEvent('pointerup', e);
+        if (this.dblClickTimer !== null) {
+            this.clearDblClickTimer();
+            this.dispatchEvent('pointerdblclick', e);
+        }
+        else if (this.clickTimer !== null) {
+            this.dispatchEvent('pointerclick', {
+                clientX: this.startPosX,
+                clientY: this.startPosY,
+                movementX: e.movementX,
+                movementY: e.movementY,
+                buttons: e.buttons,
+                type: e.type,
+            });
+            this.dblClickTimer = window.setTimeout(() => {
+                this.dblClickTimer = null;
+            }, this.dblClickDuration);
+        }
+        if (this.dragging) {
+            this.dispatchEvent('pointerenddrag', e);
+        }
+        this.lastTouchX1 = 0;
+        this.lastTouchY1 = 0;
+        this.lastTouchX2 = 0;
+        this.lastTouchY2 = 0;
+        this.lastTouchPosX = 0;
+        this.lastTouchPosY = 0;
+        this.lastPinchPosX = 0;
+        this.lastPinchPosY = 0;
+        this.clearClickTimer();
+        this.clearLongPressTimer();
+    }
+}

package/es6/pdf-viewer-canvas/PdfViewerCanvas.d.ts

@@ -0,0 +1,175 @@
+import { PdfFitMode, PdfPageLayoutMode, Point, Annotation, PdfDestination, DeletedItem, PdfItem, PdfItemsOnPage, ViewOptions, InputFile, InputUri, RenderOptions, SaveOptions, RotationDirection } from '../pdf-viewer-api';
+import { WebViewerOptions } from './../pdf-web-viewer/WebViewerOptions';
+import { CanvasModule } from '../modules/CanvasModule';
+import { SearchState } from './state/search';
+export interface PdfViewerCanvasEventMap {
+    firstVisiblePage: number;
+    lastVisiblePage: number;
+    pageNumber: number;
+    zoom: number;
+    rotation: number;
+    fitMode: PdfFitMode;
+    pageLayoutMode: PdfPageLayoutMode;
+    busyState: boolean;
+    appLoaded: boolean;
+    pageChanged: number;
+    error: Error;
+    itemSelected: PdfItem;
+    itemDeselected: PdfItem;
+    itemCreated: PdfItem;
+    itemUpdated: PdfItem;
+    itemDeleted: DeletedItem;
+    moduleActivated: string;
+    moduleDeactivated: string;
+    textSelected: string;
+}
+export type PdfViewerCanvasEventListener = <K extends keyof PdfViewerCanvasEventMap>(e: PdfViewerCanvasEventMap[K]) => void;
+export type PdfViewerCanvasEventTypes = keyof PdfViewerCanvasEventMap;
+export declare class PdfViewerCanvas {
+    viewLayersElement: HTMLElement;
+    get licenseFeatures(): {
+        annotate: boolean;
+        fillFormFields: boolean;
+        pageRotation: boolean;
+    };
+    private element;
+    private toolbarElement;
+    private options;
+    private viewLayers;
+    private modules;
+    private pdfViewerApi;
+    private eventListeners;
+    private resizeObserver;
+    private canvasEvents;
+    private documentLoaded;
+    private renderLoopRunning;
+    private store;
+    private annotTimer;
+    private searchIterator;
+    constructor(containerElement: HTMLElement | null, license: string, options: WebViewerOptions);
+    open(pdfFile: InputFile | InputUri, fdfFiles?: (InputFile | InputUri)[] | null, password?: string | null, viewOptions?: ViewOptions | null, renderOptions?: RenderOptions | null): Promise<unknown>;
+    save(saveOptions?: SaveOptions): Promise<Blob>;
+    /**
+     * @deprecated Deprecated in Version 3.10. Use Open method instead.
+     */
+    openFDF(pdfBuffer: Uint8Array, fdfBuffer: Uint8Array, password?: string): Promise<unknown>;
+    /**
+     * @deprecated Deprecated in Version 3.10. Use Open method instead.
+     */
+    openUri(pdfUri: string, password?: string, pdfAuthorization?: string): Promise<unknown>;
+    /**
+     * @deprecated Deprecated in Version 3.10. Use Open method instead.
+     */
+    openFDFUri(pdfUri: string, fdfUri: string, password?: string, pdfAuthorization?: string, fdfAuthorization?: string): Promise<unknown>;
+    /**
+     * @deprecated Deprecated in Version 3.10. Use Open method instead.
+     */
+    openBlob(blob: Blob, password?: string): Promise<unknown>;
+    /**
+     * @deprecated Deprecated in Version 3.10. Use Open method instead.
+     */
+    openFDFBlob(pdfBlob: Blob, fdfBlob: Blob, password?: string): Promise<unknown>;
+    /**
+     * @deprecated Deprecated in Version 3.10. Use save method instead.
+     */
+    saveFile(asFdf: boolean): Promise<unknown>;
+    close(): any;
+    destroy(): void;
+    hasChanges(): any;
+    getProductVersion(): string;
+    getZoom(): number;
+    setZoom(zoom: number, location?: Point): void;
+    zoomIn(location?: Point): void;
+    zoomOut(location?: Point): void;
+    getPageCount(): number;
+    getPageNumber(): number;
+    rotatePage(pageNumber: number, direction: RotationDirection): any;
+    setPageNumber(page: number): void;
+    scrollDown(distance?: number): void;
+    scrollUp(distance?: number): void;
+    scrollLeft(distance?: number): void;
+    scrollRight(distance?: number): void;
+    scrollMove(distanceVertical?: number, distanceHorizontal?: number): void;
+    nextPage(): void;
+    previousPage(): void;
+    getFitMode(): PdfFitMode;
+    setFitMode(fitMode: number): void;
+    getPageLayoutMode(): PdfPageLayoutMode;
+    setPageLayoutMode(pageLayoutMode: number): void;
+    getRotation(): number;
+    setRotation(rotation: number): void;
+    renderPage(pageNumber: number, width: number, height: number): Promise<import("../pdf-viewer-api").PageImage>;
+    getDocumentOutline(): Promise<any>;
+    goTo(pdfDestination: PdfDestination): void;
+    updateCanvasSearchState(state: SearchState): void;
+    private doSearch;
+    startSearch(searchString: string, startPage: number, caseSensitive: boolean, wrapSearch: boolean, useRegex: boolean): void;
+    nextSearchMatch(): void;
+    previousSearchMatch(): Promise<void> | undefined;
+    endSearch(): void;
+    resetViewerMode(): void;
+    getAnnotationsFromPage(page: number): Promise<PdfItemsOnPage>;
+    goToAnnotation(annotation: Annotation, action?: 'select' | 'edit' | 'popup' | 'history'): void;
+    print(): void;
+    getModules(): CanvasModule[];
+    activateModule(moduleName: string, args: any): void;
+    deactivateModule(moduleName: string): void;
+    getSelectedText(): string | null | undefined;
+    addEventListener<K extends keyof PdfViewerCanvasEventMap>(type: K, listener: (e: PdfViewerCanvasEventMap[K]) => void): void;
+    removeEventListener<K extends keyof PdfViewerCanvasEventMap>(type: K, listener: (e: PdfViewerCanvasEventMap[K]) => void): void;
+    suspendCanvasEvents(): void;
+    resumeCanvasEvents(): void;
+    private dispatchEvent;
+    private getOutlines;
+    private openRoutine;
+    private onDocumentOpened;
+    private onDocumentClosed;
+    private startRenderLoop;
+    private stopRenderLoop;
+    private registerPdfStamps;
+    private registerModules;
+    private unRegisterModules;
+    private updateViewLayerContext;
+    private onMouseWheel;
+    private transformPointer;
+    private onCanvasPointerClick;
+    private onCanvasPointerDblClick;
+    private onCanvasPointerLongPress;
+    private onCanvasPointerStartDrag;
+    private onCanvasPointerEndDrag;
+    private onCanvasPointerPinch;
+    private onCanvasPointerDown;
+    private onCanvasPointerUp;
+    private onCanvasPointerMove;
+    private onKeyboardShortcuts;
+    private onResize;
+    private onHtmlDocumentSelectionChanged;
+    private updateCanvasSize;
+    private onCanvasInvalidated;
+    private onFirstVisiblePageChanged;
+    private onPageNumberChanged;
+    private onTextSelected;
+    /**
+     * This function works with a timer. This avoids mass loading of annotation when scrolling
+     * through a large document. It only loads the annotations once the viewport is stable (visible
+     * pages didn't change for 100ms). If there is an active timer that will be cancelled.
+     * @param begin first page to get annotations from
+     * @param end last page to get annotations from
+     */
+    private maybeGetAnnotations;
+    private getAnnotations;
+    private onLastVisiblePageChanged;
+    private onZoomChanged;
+    private onFitModeChanged;
+    private onPageLayoutModeChanged;
+    private onBusyStateChanged;
+    private onRotationChanged;
+    private onItemCreated;
+    private onItemUpdated;
+    private onItemDeleted;
+    private onPageChanged;
+    private onApiError;
+    private beforeUnloadCallback;
+    private getNextZoomOutLevel;
+    private getNextZoomInLevel;
+}