mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2026-09-09 18:03:21 +00:00
Merge pull request #576 from Alfresco/dev-eromano-512
Hide toolbar as parameter #512
This commit is contained in:
Mario Romano
GitHub
@@ -144,6 +144,8 @@ Attribute | Options | Default | Description | Mandatory
|
||||
`urlFile` | *string* | | If you want laod an external file that not comes from the ECM you can use this Url where to load the file |
|
||||
`overlayMode` | *boolean* | `false` | if true Show the Viewer full page over the present content otherwise will fit the parent div |
|
||||
`showViewer` | *boolean* | `true` | Hide or show the viewer |
|
||||
`showToolbar` | *boolean* | `true` | Hide or show the toolbars |
|
||||
|
||||
|
||||
## Build from sources
|
||||
Alternatively you can build component from sources with the following commands:
|
||||
|
||||
@@ -33,9 +33,9 @@ import {
|
||||
<label for="token"><b>Insert a valid access token / ticket:</b></label><br>
|
||||
<input id="token" type="text" size="48" (change)="updateToken();documentList.reload()" [(ngModel)]="token"><br>
|
||||
<label for="token"><b>Insert the ip of your Alfresco instance:</b></label><br>
|
||||
<input id="token" type="text" size="48" (change)="updateHost();documentList.reload()" [(ngModel)]="host"><br><br>
|
||||
<input id="token" type="text" size="48" (change)="updateHost();documentList.reload()" [(ngModel)]="ecmHost"><br><br>
|
||||
<div *ngIf="!authenticated" style="color:#FF2323">
|
||||
Authentication failed to ip {{ host }} with user: admin, admin, you can still try to add a valid token to perform
|
||||
Authentication failed to ip {{ ecmHost }} with user: admin, admin, you can still try to add a valid token to perform
|
||||
operations.
|
||||
</div>
|
||||
<hr>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
|
||||
|
||||
<!-- Pagination toolbar start -->
|
||||
<div id="viewer-toolbar-pagination" class="viewer-toolbar-pagination mdl-cell--hide-tablet mdl-cell--hide-phone">
|
||||
<div *ngIf="showToolbar" id="viewer-toolbar-pagination" class="viewer-toolbar-pagination mdl-cell--hide-tablet mdl-cell--hide-phone">
|
||||
<div id="viewer-previous-page-button" class="button-page left" (click)="previousPage()">
|
||||
<i class="icon material-icons">keyboard_arrow_left</i>
|
||||
</div>
|
||||
@@ -31,7 +31,7 @@
|
||||
<!-- Pagination toolbar end -->
|
||||
|
||||
<!-- Command toolbar start -->
|
||||
<div id="viewer-toolbar-command" class="viewer-toolbar-command">
|
||||
<div *ngIf="showToolbar" id="viewer-toolbar-command" class="viewer-toolbar-command">
|
||||
<div id="viewer-scale-page-button" class="button-page left" (click)="pageFit()">
|
||||
<i class="icon material-icons">zoom_out_map</i>
|
||||
</div>
|
||||
|
||||
@@ -15,20 +15,23 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { describe, expect, it, inject, beforeEachProviders } from '@angular/core/testing';
|
||||
import { TestComponentBuilder } from '@angular/compiler/testing';
|
||||
import {describe, expect, it, inject, beforeEachProviders, beforeEach} from '@angular/core/testing';
|
||||
import {TestComponentBuilder} from '@angular/compiler/testing';
|
||||
|
||||
import { PdfViewerComponent } from './pdfViewer.component';
|
||||
import { PDFJSmock } from './assets/PDFJS.mock';
|
||||
import { PDFViewermock } from './assets/PDFViewer.mock';
|
||||
import { EventMock } from './assets/event.mock';
|
||||
import {PdfViewerComponent} from './pdfViewer.component';
|
||||
import {PDFJSmock} from './assets/PDFJS.mock';
|
||||
import {PDFViewermock} from './assets/PDFViewer.mock';
|
||||
import {EventMock} from './assets/event.mock';
|
||||
|
||||
import { HTTP_PROVIDERS } from '@angular/http';
|
||||
import { AlfrescoSettingsServiceMock } from '../src/assets/AlfrescoSettingsService.service.mock';
|
||||
import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
|
||||
import {HTTP_PROVIDERS} from '@angular/http';
|
||||
import {AlfrescoSettingsServiceMock} from '../src/assets/AlfrescoSettingsService.service.mock';
|
||||
import {AlfrescoAuthenticationService, AlfrescoSettingsService} from 'ng2-alfresco-core';
|
||||
|
||||
describe('PdfViewer', () => {
|
||||
|
||||
let pdfComponentFixture, element, component;
|
||||
|
||||
|
||||
beforeEachProviders(() => {
|
||||
return [
|
||||
HTTP_PROVIDERS,
|
||||
@@ -37,377 +40,226 @@ describe('PdfViewer', () => {
|
||||
];
|
||||
});
|
||||
|
||||
beforeEach(inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then(fixture => {
|
||||
pdfComponentFixture = fixture;
|
||||
element = fixture.nativeElement;
|
||||
component = fixture.componentInstance;
|
||||
|
||||
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
|
||||
spyOn(component, 'initPDFViewer').and.callFake(() => {
|
||||
component.pdfViewer = new PDFViewermock();
|
||||
});
|
||||
|
||||
component.showToolbar = true;
|
||||
component.urlFile = 'fake-url-file';
|
||||
pdfComponentFixture.detectChanges();
|
||||
});
|
||||
}));
|
||||
|
||||
describe('View', () => {
|
||||
it('Canvas should be present', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then((fixture) => {
|
||||
let element = fixture.nativeElement;
|
||||
it('Canvas should be present', () => {
|
||||
expect(element.querySelector('#viewer-viewerPdf')).not.toBeNull();
|
||||
expect(element.querySelector('#viewer-pdf-container')).not.toBeNull();
|
||||
});
|
||||
|
||||
fixture.detectChanges();
|
||||
it('Loader should be present', () => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
|
||||
expect(element.querySelector('#viewer-viewerPdf')).not.toBeNull();
|
||||
expect(element.querySelector('#viewer-pdf-container')).not.toBeNull();
|
||||
});
|
||||
}));
|
||||
expect(element.querySelector('#loader-container')).not.toBeNull();
|
||||
|
||||
it('Loader should be present', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then((fixture) => {
|
||||
let element = fixture.nativeElement;
|
||||
});
|
||||
|
||||
fixture.detectChanges();
|
||||
it('Next an Previous Buttons should be present', () => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
|
||||
expect(element.querySelector('#loader-container')).not.toBeNull();
|
||||
});
|
||||
}));
|
||||
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
|
||||
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
|
||||
});
|
||||
|
||||
it('Next an Previous Buttons should be present', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then((fixture) => {
|
||||
let element = fixture.nativeElement;
|
||||
|
||||
fixture.detectChanges();
|
||||
it('Input Page elements should be present', () => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
|
||||
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
|
||||
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
|
||||
});
|
||||
}));
|
||||
expect(element.querySelector('#viewer-pagenumber-input')).toBeDefined();
|
||||
expect(element.querySelector('#viewer-total-pages')).toBeDefined();
|
||||
|
||||
it('Input Page elements should be present', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then((fixture) => {
|
||||
let element = fixture.nativeElement;
|
||||
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
|
||||
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
|
||||
});
|
||||
|
||||
fixture.detectChanges();
|
||||
it('Toolbar should be hide if showToolbar is false', () => {
|
||||
component.showToolbar = false;
|
||||
|
||||
expect(element.querySelector('#viewer-pagenumber-input')).toBeDefined();
|
||||
expect(element.querySelector('#viewer-total-pages')).toBeDefined();
|
||||
pdfComponentFixture.detectChanges();
|
||||
|
||||
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
|
||||
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
|
||||
});
|
||||
}));
|
||||
expect(element.querySelector('#viewer-toolbar-command')).toBeNull();
|
||||
expect(element.querySelector('#viewer-toolbar-pagination')).toBeNull();
|
||||
});
|
||||
});
|
||||
|
||||
describe('User interaction', () => {
|
||||
it('Total number of pages should be loaded', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then((fixture) => {
|
||||
let component = fixture.componentInstance;
|
||||
component.urlFile = 'fake-url-file';
|
||||
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
|
||||
spyOn(component, 'initPDFViewer').and.callFake(() => {
|
||||
component.pdfViewer = new PDFViewermock();
|
||||
});
|
||||
|
||||
component.ngOnChanges().then(() => {
|
||||
expect(component.totalPages).toEqual('10');
|
||||
});
|
||||
});
|
||||
}));
|
||||
beforeEach(() => {
|
||||
component.inputPage(1);
|
||||
});
|
||||
|
||||
it('Total number of pages should be loaded', () => {
|
||||
component.ngOnChanges().then(() => {
|
||||
expect(component.totalPages).toEqual('10');
|
||||
});
|
||||
});
|
||||
|
||||
it('right arrow should move to the next 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();
|
||||
});
|
||||
it('right arrow should move to the next page', (done) => {
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
EventMock.keyDown(39);
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
component.urlFile = 'fake-url-file';
|
||||
it('nextPage should move to the next page', (done) => {
|
||||
let nextPageButton = element.querySelector('#viewer-next-page-button');
|
||||
|
||||
component.ngOnChanges().then(() => {
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
EventMock.keyDown(39);
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(2);
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
nextPageButton.click();
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
it('nextPage should move to the next page', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then((fixture) => {
|
||||
let component = fixture.componentInstance;
|
||||
let element = fixture.nativeElement;
|
||||
it('left arrow should move to the previous page', (done) => {
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
EventMock.keyDown(39);
|
||||
EventMock.keyDown(39);
|
||||
EventMock.keyDown(37);
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
|
||||
spyOn(component, 'initPDFViewer').and.callFake(() => {
|
||||
component.pdfViewer = new PDFViewermock();
|
||||
});
|
||||
it('previous page should move to the previous page', (done) => {
|
||||
let previousPageButton = element.querySelector('#viewer-previous-page-button');
|
||||
let nextPageButton = element.querySelector('#viewer-next-page-button');
|
||||
|
||||
component.urlFile = 'fake-url-file';
|
||||
|
||||
let nextPageButton = element.querySelector('#viewer-next-page-button');
|
||||
|
||||
component.ngOnChanges().then(() => {
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
nextPageButton.click();
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(2);
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('left arrow should move to the previous 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);
|
||||
EventMock.keyDown(39);
|
||||
EventMock.keyDown(39);
|
||||
EventMock.keyDown(37);
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(2);
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('previous page should move to the previous page', 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').and.callFake(() => {
|
||||
component.pdfViewer = new PDFViewermock();
|
||||
});
|
||||
|
||||
component.urlFile = 'fake-url-file';
|
||||
let previousPageButton = element.querySelector('#viewer-previous-page-button');
|
||||
let nextPageButton = element.querySelector('#viewer-next-page-button');
|
||||
|
||||
component.ngOnChanges().then(() => {
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
nextPageButton.click();
|
||||
nextPageButton.click();
|
||||
previousPageButton.click();
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(2);
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
nextPageButton.click();
|
||||
nextPageButton.click();
|
||||
previousPageButton.click();
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(2);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
/* tslint:disable:max-line-length */
|
||||
it('previous page should not move to the previous page if is page 1', 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();
|
||||
});
|
||||
it('previous page should not move to the previous page if is page 1', (done) => {
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
component.previousPage();
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
component.urlFile = 'fake-url-file';
|
||||
|
||||
component.ngOnChanges().then(() => {
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
component.previousPage();
|
||||
fixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
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();
|
||||
});
|
||||
});
|
||||
}));
|
||||
it('Input page should move to the inserted page', (done) => {
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
component.inputPage('4');
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(4);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
/* tslint:disable:max-line-length */
|
||||
it('zoomIn should increment the scale value', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then((fixture) => {
|
||||
let component = fixture.componentInstance;
|
||||
let element = fixture.nativeElement;
|
||||
it('zoomIn should increment the scale value', (done) => {
|
||||
component.currentScale = 1;
|
||||
|
||||
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
|
||||
spyOn(component, 'initPDFViewer').and.callFake(() => {
|
||||
component.pdfViewer = new PDFViewermock();
|
||||
});
|
||||
let zoomInButton = element.querySelector('#viewer-zoom-in-button');
|
||||
|
||||
component.urlFile = 'fake-url-file';
|
||||
component.currentScale = 1;
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
zoomInButton.click();
|
||||
expect(component.currentScaleMode).toBe('auto');
|
||||
expect(component.currentScale).toBe(1.1);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
let zoomInButton = element.querySelector('#viewer-zoom-in-button');
|
||||
it('zoomOut should decrement the scale value', (done) => {
|
||||
component.currentScale = 1;
|
||||
|
||||
component.ngOnChanges().then(() => {
|
||||
fixture.detectChanges();
|
||||
zoomInButton.click();
|
||||
expect(component.currentScaleMode).toBe('auto');
|
||||
expect(component.currentScale).toBe(1.1);
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
let zoomOutButton = element.querySelector('#viewer-zoom-out-button');
|
||||
|
||||
it('zoomOut should decrement the scale value', inject([TestComponentBuilder], (tcb: TestComponentBuilder) => {
|
||||
return tcb
|
||||
.createAsync(PdfViewerComponent)
|
||||
.then((fixture) => {
|
||||
let component = fixture.componentInstance;
|
||||
let element = fixture.nativeElement;
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
zoomOutButton.click();
|
||||
expect(component.currentScaleMode).toBe('auto');
|
||||
expect(component.currentScale).toBe(0.9);
|
||||
done();
|
||||
});
|
||||
});
|
||||
|
||||
spyOn(component, 'getPDFJS').and.returnValue(new PDFJSmock());
|
||||
spyOn(component, 'initPDFViewer').and.callFake(() => {
|
||||
component.pdfViewer = new PDFViewermock();
|
||||
});
|
||||
it('fit in button should toggle page-fit and auto scale mode', (done) => {
|
||||
component.currentScale = 1;
|
||||
|
||||
component.urlFile = 'fake-url-file';
|
||||
component.currentScale = 1;
|
||||
let fitPage = element.querySelector('#viewer-scale-page-button');
|
||||
|
||||
let zoomOutButton = element.querySelector('#viewer-zoom-out-button');
|
||||
|
||||
component.ngOnChanges().then(() => {
|
||||
fixture.detectChanges();
|
||||
zoomOutButton.click();
|
||||
expect(component.currentScaleMode).toBe('auto');
|
||||
expect(component.currentScale).toBe(0.9);
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
|
||||
it('fit in button should toggle page-fit and auto scale mode', 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').and.callFake(() => {
|
||||
component.pdfViewer = new PDFViewermock();
|
||||
});
|
||||
|
||||
component.urlFile = 'fake-url-file';
|
||||
component.currentScale = 1;
|
||||
|
||||
let fitPage = element.querySelector('#viewer-scale-page-button');
|
||||
|
||||
component.ngOnChanges().then(() => {
|
||||
fixture.detectChanges();
|
||||
expect(component.currentScaleMode).toBe('auto');
|
||||
fitPage.click();
|
||||
expect(component.currentScaleMode).toBe('page-fit');
|
||||
fitPage.click();
|
||||
expect(component.currentScaleMode).toBe('auto');
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.currentScaleMode).toBe('auto');
|
||||
fitPage.click();
|
||||
expect(component.currentScaleMode).toBe('page-fit');
|
||||
fitPage.click();
|
||||
expect(component.currentScaleMode).toBe('auto');
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('Resize 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;
|
||||
it('resize event should trigger setScaleUpdatePages', () => {
|
||||
spyOn(component, 'setScaleUpdatePages');
|
||||
|
||||
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';
|
||||
|
||||
component.documentContainer = element.querySelector('#viewer-pdf-container');
|
||||
component.pdfViewer = new PDFViewermock();
|
||||
component.urlFile = 'fake-url-file';
|
||||
EventMock.resizeMobileView();
|
||||
|
||||
EventMock.resizeMobileView();
|
||||
|
||||
expect(component.setScaleUpdatePages).toHaveBeenCalled();
|
||||
});
|
||||
}));
|
||||
expect(component.setScaleUpdatePages).toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
describe('scroll interaction', () => {
|
||||
it('scroll page should return the current 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);
|
||||
component.watchScroll({scrollTop: 10000});
|
||||
expect(component.displayPage).toBe(4);
|
||||
}).catch((error) => {
|
||||
expect(error).toBeUndefined();
|
||||
});
|
||||
});
|
||||
}));
|
||||
it('scroll page should return the current page', (done) => {
|
||||
component.ngOnChanges().then(() => {
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(1);
|
||||
component.inputPage('4');
|
||||
pdfComponentFixture.detectChanges();
|
||||
expect(component.displayPage).toBe(4);
|
||||
component.watchScroll({scrollTop: 10000});
|
||||
expect(component.displayPage).toBe(4);
|
||||
done();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
@@ -34,6 +34,9 @@ export class PdfViewerComponent {
|
||||
@Input()
|
||||
nameFile: string;
|
||||
|
||||
@Input()
|
||||
showToolbar: boolean = true;
|
||||
|
||||
currentPdfDocument: any;
|
||||
page: number;
|
||||
displayPage: number;
|
||||
|
||||
@@ -48,7 +48,7 @@
|
||||
<div id="viewer-content-container" class="viewer-content-container mdl-cell" >
|
||||
<!-- Start View Switch-->
|
||||
<div *ngIf="isPdf()">
|
||||
<pdf-viewer [urlFile]="urlFile" [nameFile]="displayName" ></pdf-viewer>
|
||||
<pdf-viewer [showToolbar]="showToolbar" [urlFile]="urlFile" [nameFile]="displayName" ></pdf-viewer>
|
||||
</div>
|
||||
<div class="center-element" *ngIf="isImage()" >
|
||||
<img-viewer [urlFile]="urlFile" [nameFile]="displayName"></img-viewer>
|
||||
|
||||
@@ -19,7 +19,6 @@ import { describe, expect, it, inject, beforeEachProviders } from '@angular/core
|
||||
import { TestComponentBuilder } from '@angular/compiler/testing';
|
||||
import { ViewerComponent } from './viewer.component';
|
||||
import { EventMock } from './assets/event.mock';
|
||||
|
||||
import { HTTP_PROVIDERS } from '@angular/http';
|
||||
import { AlfrescoSettingsServiceMock } from '../src/assets/AlfrescoSettingsService.service.mock';
|
||||
import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
|
||||
|
||||
@@ -45,6 +45,9 @@ export class ViewerComponent {
|
||||
@Input()
|
||||
showViewer: boolean = true;
|
||||
|
||||
@Input()
|
||||
showToolbar: boolean = true;
|
||||
|
||||
@Output()
|
||||
showViewerChange: EventEmitter<boolean> = new EventEmitter<boolean>();
|
||||
|
||||
|
||||
Reference in New Issue
Block a user