inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-31 17:38:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-5055] update pdfjs (#5344)

Browse Source 
* update pdfjs

* fix

* fix test
This commit is contained in:
Eugenio Romano
2019-12-22 17:52:38 +01:00
committed by GitHub
parent 50f8e58314
commit d8c35c9af0
6 changed files with 78 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
lib/core/viewer/components/pdfViewer.component.scss
View File

@@ -86,7 +86,7 @@
background-color: mat-color($background, card);
color: inherit;
font-size: 14px;
padding: 0;
padding: 5px;
height: 24px;
line-height: 24px;
text-align: right;

20
lib/core/viewer/components/pdfViewer.component.spec.ts
View File

@@ -480,17 +480,15 @@ describe('Test PdfViewer component', () => {
});
}, 25000);
it('should event RIGHT_ARROW keyboard change pages', (done) => {
it('should event RIGHT_ARROW keyboard change pages', fakeAsync(() => {
fixtureUrlTestComponent.whenStable();
fixtureUrlTestComponent.detectChanges();
EventMock.keyDown(RIGHT_ARROW);
fixtureUrlTestComponent.detectChanges();
tick(250);
fixtureUrlTestComponent.whenStable().then(() => {
fixtureUrlTestComponent.detectChanges();
expect(componentUrlTestComponent.pdfViewerComponent.displayPage).toBe(2);
done();
});
}, 25000);
expect(componentUrlTestComponent.pdfViewerComponent.displayPage).toBe(2);
}));
it('should event LEFT_ARROW keyboard change pages', (done) => {
component.inputPage('2');
@@ -591,12 +589,12 @@ describe('Test PdfViewer component', () => {
const args = {
pageNumber: 6,
source: {
container: componentUrlTestComponent.pdfViewerComponent.documentContainer
container: document.getElementById(`${componentUrlTestComponent.pdfViewerComponent.randomPdfId}-viewer-pdf-viewer`)
}
};
/* cspell:disable-next-line */
componentUrlTestComponent.pdfViewerComponent.pdfViewer.eventBus.dispatch('pagechange', args);
componentUrlTestComponent.pdfViewerComponent.pdfViewer.eventBus.dispatch('pagechanging', args);
fixtureUrlTestComponent.detectChanges();
fixtureUrlTestComponent.whenStable().then(() => {
@@ -615,7 +613,7 @@ describe('Test PdfViewer component', () => {
const args = {
pagesCount: 10,
source: {
container: componentUrlTestComponent.pdfViewerComponent.documentContainer
container: document.getElementById(`${componentUrlTestComponent.pdfViewerComponent.randomPdfId}-viewer-pdf-viewer`)
}
};

102
lib/core/viewer/components/pdfViewer.component.ts
View File

@@ -32,16 +32,11 @@ import { LogService } from '../../services/log.service';
import { RenderingQueueServices } from '../services/rendering-queue.services';
import { PdfPasswordDialogComponent } from './pdfViewer-password-dialog';
import { AppConfigService } from './../../app-config/app-config.service';
import { PDFDocumentProxy, PDFSource } from 'pdfjs-dist';
declare const pdfjsLib: any;
declare const pdfjsViewer: any;
export interface PdfDocumentOptions {
url?: string;
data?: any;
withCredentials?: boolean;
}
@Component({
selector: 'adf-pdf-viewer',
templateUrl: './pdfViewer.component.html',
@@ -82,14 +77,12 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
@Output()
close = new EventEmitter<any>();
loadingTask: any;
currentPdfDocument: any;
pdfDocument: PDFDocumentProxy;
page: number;
displayPage: number;
totalPages: number;
loadingPercent: number;
pdfViewer: any;
documentContainer: any;
currentScaleMode: string = 'auto';
currentScale: number = 1;
@@ -144,23 +137,23 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
if (blobFile && blobFile.currentValue) {
const reader = new FileReader();
reader.onload = () => {
const options = {
reader.onload = async () => {
const pdfSource: PDFSource = {
data: reader.result,
withCredentials: this.appConfigService.get<boolean>('auth.withCredentials', undefined)
};
this.executePdf(options);
this.executePdf(pdfSource);
};
reader.readAsArrayBuffer(blobFile.currentValue);
}
const urlFile = changes['urlFile'];
if (urlFile && urlFile.currentValue) {
const options = {
const pdfSource: PDFSource = {
url: urlFile.currentValue,
withCredentials: this.appConfigService.get<boolean>('auth.withCredentials', undefined)
};
this.executePdf(options);
this.executePdf(pdfSource);
}
if (!this.urlFile && !this.blobFile) {
@@ -168,28 +161,27 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
}
}
executePdf(pdfOptions: PdfDocumentOptions) {
executePdf(pdfOptions: PDFSource) {
pdfjsLib.GlobalWorkerOptions.workerSrc = 'pdf.worker.min.js';
this.loadingTask = pdfjsLib.getDocument(pdfOptions);
const loadingTask = pdfjsLib.getDocument(pdfOptions);
this.loadingTask.onPassword = (callback, reason) => {
loadingTask.onPassword = (callback, reason) => {
this.onPdfPassword(callback, reason);
};
this.loadingTask.onProgress = (progressData) => {
loadingTask.onProgress = (progressData) => {
const level = progressData.loaded / progressData.total;
this.loadingPercent = Math.round(level * 100);
};
this.loadingTask.then((pdfDocument) => {
this.currentPdfDocument = pdfDocument;
loadingTask.promise.then((pdfDocument: PDFDocumentProxy) => {
this.totalPages = pdfDocument.numPages;
this.page = 1;
this.displayPage = 1;
this.initPDFViewer(this.currentPdfDocument);
this.initPDFViewer(pdfDocument);
this.currentPdfDocument.getPage(1).then(() => {
pdfDocument.getPage(1).then(() => {
this.scalePage('auto');
}, () => {
this.error.emit();
@@ -200,26 +192,24 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
});
}
initPDFViewer(pdfDocument: any) {
const viewer: any = document.getElementById(`${this.randomPdfId}-viewer-viewerPdf`);
const container = document.getElementById(`${this.randomPdfId}-viewer-pdf-viewer`);
initPDFViewer(pdfDocument: PDFDocumentProxy) {
const viewer: any = this.getViewer();
const container = this.getDocumentContainer();
if (viewer && container) {
this.documentContainer = container;
// cspell: disable-next
this.documentContainer.addEventListener('pagechange', this.onPageChange, true);
// cspell: disable-next
this.documentContainer.addEventListener('pagesloaded', this.onPagesLoaded, true);
// cspell: disable-next
this.documentContainer.addEventListener('textlayerrendered', this.onPageRendered, true);
this.pdfViewer = new pdfjsViewer.PDFViewer({
container: this.documentContainer,
container: container,
viewer: viewer,
renderingQueue: this.renderingQueueServices
});
// cspell: disable-next
this.pdfViewer.eventBus.on('pagechanging', this.onPageChange);
// cspell: disable-next
this.pdfViewer.eventBus.on('pagesloaded', this.onPagesLoaded);
// cspell: disable-next
this.pdfViewer.eventBus.on('textlayerrendered', this.onPageRendered);
this.renderingQueueServices.setViewer(this.pdfViewer);
this.pdfViewer.setDocument(pdfDocument);
this.pdfThumbnailsContext.viewer = this.pdfViewer;
@@ -227,22 +217,22 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
}
ngOnDestroy() {
if (this.documentContainer) {
if (this.pdfViewer) {
// cspell: disable-next
this.documentContainer.removeEventListener('pagechange', this.onPageChange, true);
this.pdfViewer.eventBus.off('pagechanging');
// cspell: disable-next
this.documentContainer.removeEventListener('pagesloaded', this.onPagesLoaded, true);
this.pdfViewer.eventBus.off('pagesloaded');
// cspell: disable-next
this.documentContainer.removeEventListener('textlayerrendered', this.onPageRendered, true);
this.pdfViewer.eventBus.off('textlayerrendered');
}
if (this.loadingTask) {
if (this.pdfDocument) {
try {
this.loadingTask.destroy();
this.pdfDocument.destroy();
} catch {
}
this.loadingTask = null;
this.pdfDocument = null;
}
}
@@ -259,7 +249,7 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
this.currentScaleMode = scaleMode;
const viewerContainer = document.getElementById(`${this.randomPdfId}-viewer-main-container`);
const documentContainer = document.getElementById(`${this.randomPdfId}-viewer-pdf-viewer`);
const documentContainer = this.getDocumentContainer();
if (this.pdfViewer && documentContainer) {
@@ -319,6 +309,14 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
}
}
private getDocumentContainer() {
return document.getElementById(`${this.randomPdfId}-viewer-pdf-viewer`);
}
private getViewer() {
return document.getElementById(`${this.randomPdfId}-viewer-viewerPdf`);
}
/**
* Update all the pages with the newScale scale
*
@@ -455,9 +453,11 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
*
* @param event
*/
onPageChange(event) {
this.page = event.pageNumber;
this.displayPage = event.pageNumber;
onPageChange(event: any) {
if (event.source && event.source.container.id === `${this.randomPdfId}-viewer-pdf-viewer`) {
this.page = event.pageNumber;
this.displayPage = event.pageNumber;
}
}
onPdfPassword(callback, reason) {
@@ -467,11 +467,11 @@ export class PdfViewerComponent implements OnChanges, OnDestroy {
data: { reason }
})
.afterClosed().subscribe((password) => {
if (password) {
callback(password);
} else {
this.close.emit();
}
if (password) {
callback(password);
} else {
this.close.emit();
}
});
}

2
lib/core/viewer/components/pdfViewerHost.component.scss
View File

@@ -1,4 +1,6 @@
.adf-pdf-viewer {
@import url('~pdfjs-dist/web/pdf_viewer.css');
.textLayer {
position: absolute;
left: 0;