diff --git a/ng2-components/ng2-alfresco-viewer/src/assets/PDFViewer.mock.ts b/ng2-components/ng2-alfresco-viewer/src/assets/PDFViewer.mock.ts index 2e2838d6b2..e9bbab730a 100644 --- a/ng2-components/ng2-alfresco-viewer/src/assets/PDFViewer.mock.ts +++ b/ng2-components/ng2-alfresco-viewer/src/assets/PDFViewer.mock.ts @@ -23,4 +23,25 @@ export class PDFViewermock { currentPage = { renderingState: 3 as number }; + + _pages: any = + [{ + width: 793, + scale: 1, + update: this.update + }, { + width: 793, + scale: 1, + update: this.update + }, { + width: 793, + scale: 1, + update: this.update + }]; + + _currentPageNumber: number = 0; + + update() { + console.log('update page'); + } } diff --git a/ng2-components/ng2-alfresco-viewer/src/assets/event.mock.ts b/ng2-components/ng2-alfresco-viewer/src/assets/event.mock.ts index 5829be8fa5..eb606201f3 100644 --- a/ng2-components/ng2-alfresco-viewer/src/assets/event.mock.ts +++ b/ng2-components/ng2-alfresco-viewer/src/assets/event.mock.ts @@ -25,6 +25,11 @@ export class EventMock { document.dispatchEvent(event); } + static resizeMobileView() { + window.innerWidth = 320; + window.innerHeight = 568; + window.dispatchEvent(new Event('resize')); + } } diff --git a/ng2-components/ng2-alfresco-viewer/src/pdfViewer.component.spec.ts b/ng2-components/ng2-alfresco-viewer/src/pdfViewer.component.spec.ts index bc9784a803..a1804ead3f 100644 --- a/ng2-components/ng2-alfresco-viewer/src/pdfViewer.component.spec.ts +++ b/ng2-components/ng2-alfresco-viewer/src/pdfViewer.component.spec.ts @@ -237,5 +237,56 @@ describe('PdfViewer', () => { }); }); })); + + it('Input page should move to the inserted page', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { + return tcb + .createAsync(PdfViewerComponent) + .then((fixture) => { + let component = fixture.componentInstance; + + spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); + spyOn(component, 'initPDFViewer').and.callFake(() => { + component.pdfViewer = new PDFViewermock(); + }); + + component.urlFile = 'fake-url-file'; + + component.ngOnChanges().then(() => { + fixture.detectChanges(); + expect(component.displayPage).toBe(1); + component.inputPage('4'); + fixture.detectChanges(); + expect(component.displayPage).toBe(4); + }).catch((error) => { + expect(error).toBeUndefined(); + }); + }); + })); }); + + describe('Rezize interaction', () => { + + it('resize event should trigger setScaleUpdatePages', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => { + return tcb + .createAsync(PdfViewerComponent) + .then((fixture) => { + let component = fixture.componentInstance; + let element = fixture.nativeElement; + + spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock()); + spyOn(component, 'initPDFViewer'); + spyOn(component, 'setScaleUpdatePages'); + + component.documentContainer = element.querySelector('#viewer-pdf-container'); + component.pdfViewer = new PDFViewermock(); + component.urlFile = 'fake-url-file'; + + EventMock.resizeMobileView(); + + expect(component.setScaleUpdatePages).toHaveBeenCalled(); + }); + })); + + }); + }); diff --git a/ng2-components/ng2-alfresco-viewer/src/pdfViewer.component.ts b/ng2-components/ng2-alfresco-viewer/src/pdfViewer.component.ts index 64dd09baff..1d66123e82 100644 --- a/ng2-components/ng2-alfresco-viewer/src/pdfViewer.component.ts +++ b/ng2-components/ng2-alfresco-viewer/src/pdfViewer.component.ts @@ -24,7 +24,7 @@ declare let __moduleName: string; moduleId: __moduleName, selector: 'pdf-viewer', templateUrl: './pdfViewer.component.html', - styleUrls: ['./pdfViewer.component.css', './pdfViewerHost.component.css' ] + styleUrls: ['./pdfViewer.component.css', './pdfViewerHost.component.css'] }) export class PdfViewerComponent { @@ -41,11 +41,9 @@ export class PdfViewerComponent { pdfViewer: any; - currentScaleMode: string; + currentScaleMode: string = 'auto'; currentScale: number; - documentContainer: any; - MAX_AUTO_SCALE: number = 1.25; ngOnChanges(changes) { @@ -86,11 +84,11 @@ export class PdfViewerComponent { PDFJS.verbosity = 5; PDFJS.disableWorker = true; - this.documentContainer = document.getElementById('viewer-pdf-container'); + let documentContainer = document.getElementById('viewer-pdf-container'); let viewer: any = document.getElementById('viewer-viewerPdf'); this.pdfViewer = new PDFJS.PDFViewer({ - container: this.documentContainer, + container: documentContainer, viewer: viewer }); @@ -105,43 +103,46 @@ export class PdfViewerComponent { scalePage(scaleMode) { this.currentScaleMode = scaleMode; - let currentPage = this.pdfViewer._pages[this.pdfViewer._currentPageNumber]; + if (this.pdfViewer) { + let documentContainer = document.getElementById('viewer-pdf-container'); + let currentPage = this.pdfViewer._pages[this.pdfViewer._currentPageNumber]; - let padding = 20; - let pageWidthScale = (this.documentContainer.clientWidth - padding) / currentPage.width * currentPage.scale; - let pageHeightScale = (this.documentContainer.clientHeight - padding) / currentPage.width * currentPage.scale; + let padding = 20; + let pageWidthScale = (documentContainer.clientWidth - padding) / currentPage.width * currentPage.scale; + let pageHeightScale = (documentContainer.clientHeight - padding) / currentPage.width * currentPage.scale; - let scale; + let scale; - switch (this.currentScaleMode) { - case 'page-actual': - scale = 1; - break; - case 'page-width': - scale = pageWidthScale; - break; - case 'page-height': - scale = pageHeightScale; - break; - case 'page-fit': - scale = Math.min(pageWidthScale, pageHeightScale); - break; - case 'auto': - let horizontalScale; - if (this.isLandscape) { - horizontalScale = Math.min(pageHeightScale, pageWidthScale); - } else { - horizontalScale = pageWidthScale; - } - scale = Math.min(this.MAX_AUTO_SCALE, horizontalScale); + switch (this.currentScaleMode) { + case 'page-actual': + scale = 1; + break; + case 'page-width': + scale = pageWidthScale; + break; + case 'page-height': + scale = pageHeightScale; + break; + case 'page-fit': + scale = Math.min(pageWidthScale, pageHeightScale); + break; + case 'auto': + let horizontalScale; + if (this.isLandscape) { + horizontalScale = Math.min(pageHeightScale, pageWidthScale); + } else { + horizontalScale = pageWidthScale; + } + scale = Math.min(this.MAX_AUTO_SCALE, horizontalScale); - break; - default: - console.error('pdfViewSetScale: \'' + scaleMode + '\' is an unknown zoom value.'); - return; + break; + default: + console.error('pdfViewSetScale: \'' + scaleMode + '\' is an unknown zoom value.'); + return; + } + + this.setScaleUpdatePages(scale); } - - this.setScaleUpdatePages(scale); } /** @@ -154,7 +155,6 @@ export class PdfViewerComponent { this.pdfViewer._pages.forEach(function (currentPage) { currentPage.update(newScale); - console.log(currentPage.viewport); }); this.pdfViewer.update(); @@ -230,7 +230,7 @@ export class PdfViewerComponent { if (!isNaN(pageInput) && pageInput > 0 && pageInput <= this.totalPages) { this.page = pageInput; - + this.displayPage = this.page; this.pdfViewer.currentPageNumber = this.page; } else { this.displayPage = this.page;