Merge pull request #874 from Alfresco/dev-eromano-836

fix host pdf css with >>> prefix #836
This commit is contained in:
Maurizio Vitale 2016-10-10 17:32:12 +01:00 committed by GitHub
commit 8b1b5e9926
3 changed files with 52 additions and 48 deletions

View File

@ -42,7 +42,7 @@
'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'}, 'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
'ng2-alfresco-core': { main: './index.js', defaultExtension: 'js'}, 'ng2-alfresco-core': { main: './index.js', defaultExtension: 'js'},
'ng2-alfresco-tag': { main: './index.js', defaultExtension: 'js'} 'ng2-alfresco-viewer': { main: './index.js', defaultExtension: 'js'}
} }
}); });
})(this); })(this);

View File

@ -59,33 +59,37 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
component.showToolbar = true; component.showToolbar = true;
component.urlFile = 'base/src/assets/fake-test-file.pdf'; component.urlFile = 'base/src/assets/fake-test-file.pdf';
fixture.detectChanges();
fixture.detectChanges(); fixture.detectChanges();
}); });
describe('View', () => { describe('View', () => {
it('If urlfile is not present should not be thrown any error ', () => {
component.urlFile = undefined;
fixture.detectChanges();
expect(() => {
component.ngOnChanges();
}).toThrow();
});
it('Canvas should be present', () => { it('Canvas should be present', () => {
expect(element.querySelector('#viewer-viewerPdf')).not.toBeNull(); expect(element.querySelector('#viewer-viewerPdf')).not.toBeNull();
expect(element.querySelector('#viewer-pdf-container')).not.toBeNull(); expect(element.querySelector('#viewer-pdf-container')).not.toBeNull();
}); });
it('Loader should be present', () => { it('Loader should be present', () => {
fixture.detectChanges();
expect(element.querySelector('#loader-container')).not.toBeNull(); expect(element.querySelector('#loader-container')).not.toBeNull();
}); });
it('Next an Previous Buttons should be present', () => { it('Next an Previous Buttons should be present', () => {
fixture.detectChanges();
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull(); expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull(); expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
}); });
it('Input Page elements should be present', () => { it('Input Page elements should be present', () => {
fixture.detectChanges();
expect(element.querySelector('#viewer-pagenumber-input')).toBeDefined(); expect(element.querySelector('#viewer-pagenumber-input')).toBeDefined();
expect(element.querySelector('#viewer-total-pages')).toBeDefined(); expect(element.querySelector('#viewer-total-pages')).toBeDefined();
@ -109,10 +113,10 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
component.inputPage(1); component.inputPage(1);
}); });
xit('Total number of pages should be loaded', (done) => { it('Total number of pages should be loaded', (done) => {
component.ngOnChanges().then(() => { component.ngOnChanges().then(() => {
fixture.detectChanges(); fixture.detectChanges();
expect(component.totalPages).toEqual(4); expect(component.totalPages).toEqual(6);
done(); done();
}); });
}, 5000); }, 5000);
@ -241,7 +245,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
}); });
describe('Resize interaction', () => { describe('Resize interaction', () => {
xit('resize event should trigger setScaleUpdatePages', (done) => { it('resize event should trigger setScaleUpdatePages', (done) => {
component.ngOnChanges().then(() => { component.ngOnChanges().then(() => {
fixture.detectChanges(); fixture.detectChanges();
spyOn(component, 'onResize'); spyOn(component, 'onResize');
@ -254,7 +258,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
}); });
describe('scroll interaction', () => { describe('scroll interaction', () => {
xit('scroll page should return the current page', (done) => { it('scroll page should return the current page', (done) => {
component.ngOnChanges().then(() => { component.ngOnChanges().then(() => {
fixture.detectChanges(); fixture.detectChanges();
expect(component.displayPage).toBe(1); expect(component.displayPage).toBe(1);
@ -265,7 +269,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
documentContainer.scrollTop = 100000; documentContainer.scrollTop = 100000;
component.watchScroll(documentContainer); component.watchScroll(documentContainer);
fixture.detectChanges(); fixture.detectChanges();
expect(component.displayPage).toBe(4); expect(component.displayPage).toBe(6);
done(); done();
}); });
}); });

View File

@ -1,4 +1,4 @@
:host .textLayer { :host >>> .textLayer {
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
@ -9,7 +9,7 @@
line-height: 1.0; line-height: 1.0;
} }
:host .textLayer > div { :host >>> .textLayer > div {
color: transparent; color: transparent;
position: absolute; position: absolute;
white-space: pre; white-space: pre;
@ -21,7 +21,7 @@
transform-origin: 0% 0%; transform-origin: 0% 0%;
} }
:host .textLayer .highlight { :host >>> .textLayer .highlight {
margin: -1px; margin: -1px;
padding: 1px; padding: 1px;
@ -29,26 +29,26 @@
border-radius: 4px; border-radius: 4px;
} }
:host .textLayer .highlight.begin { :host >>> .textLayer .highlight.begin {
border-radius: 4px 0px 0px 4px; border-radius: 4px 0px 0px 4px;
} }
:host .textLayer .highlight.end { :host >>> .textLayer .highlight.end {
border-radius: 0px 4px 4px 0px; border-radius: 0px 4px 4px 0px;
} }
:host .textLayer .highlight.middle { :host >>> .textLayer .highlight.middle {
border-radius: 0px; border-radius: 0px;
} }
:host .textLayer .highlight.selected { :host >>> .textLayer .highlight.selected {
background-color: rgb(0, 100, 0); background-color: rgb(0, 100, 0);
} }
:host .textLayer ::selection { background: rgb(0,0,255); } :host >>> .textLayer ::selection { background: rgb(0,0,255); }
:host .textLayer ::-moz-selection { background: rgb(0,0,255); } :host >>> .textLayer ::-moz-selection { background: rgb(0,0,255); }
:host .textLayer .endOfContent { :host >>> .textLayer .endOfContent {
display: block; display: block;
position: absolute; position: absolute;
left: 0px; left: 0px;
@ -62,16 +62,16 @@
-moz-user-select: none; -moz-user-select: none;
} }
:host .textLayer .endOfContent.active { :host >>> .textLayer .endOfContent.active {
top: 0px; top: 0px;
} }
:host .annotationLayer section { :host >>> .annotationLayer section {
position: absolute; position: absolute;
} }
:host .annotationLayer .linkAnnotation > a { :host >>> .annotationLayer .linkAnnotation > a {
position: absolute; position: absolute;
font-size: 1em; font-size: 1em;
top: 0; top: 0;
@ -80,27 +80,27 @@
height: 100%; height: 100%;
} }
:host .annotationLayer .linkAnnotation > a /* -ms-a */ { :host >>> .annotationLayer .linkAnnotation > a /* -ms-a */ {
background: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7") 0 0 repeat; background: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7") 0 0 repeat;
} }
:host .annotationLayer .linkAnnotation > a:hover { :host >>> .annotationLayer .linkAnnotation > a:hover {
opacity: 0.2; opacity: 0.2;
background: #ff0; background: #ff0;
box-shadow: 0px 2px 10px #ff0; box-shadow: 0px 2px 10px #ff0;
} }
:host .annotationLayer .textAnnotation img { :host >>> .annotationLayer .textAnnotation img {
position: absolute; position: absolute;
cursor: pointer; cursor: pointer;
} }
:host .annotationLayer .popupWrapper { :host >>> .annotationLayer .popupWrapper {
position: absolute; position: absolute;
width: 20em; width: 20em;
} }
:host .annotationLayer .popup { :host >>> .annotationLayer .popup {
position: absolute; position: absolute;
z-index: 200; z-index: 200;
max-width: 20em; max-width: 20em;
@ -113,17 +113,17 @@
word-wrap: break-word; word-wrap: break-word;
} }
:host .annotationLayer .popup h1 { :host >>> .annotationLayer .popup h1 {
font-size: 1em; font-size: 1em;
border-bottom: 1px solid #000000; border-bottom: 1px solid #000000;
padding-bottom: 0.2em; padding-bottom: 0.2em;
} }
:host .annotationLayer .popup p { :host >>> .annotationLayer .popup p {
padding-top: 0.2em; padding-top: 0.2em;
} }
:host .annotationLayer .highlightAnnotation, :host >>> .annotationLayer .highlightAnnotation,
.annotationLayer .underlineAnnotation, .annotationLayer .underlineAnnotation,
.annotationLayer .squigglyAnnotation, .annotationLayer .squigglyAnnotation,
.annotationLayer .strikeoutAnnotation, .annotationLayer .strikeoutAnnotation,
@ -131,11 +131,11 @@
cursor: pointer; cursor: pointer;
} }
:host .pdfViewer .canvasWrapper { :host >>> .pdfViewer .canvasWrapper {
overflow: hidden; overflow: hidden;
} }
:host .pdfViewer .page { :host >>> .pdfViewer .page {
direction: ltr; direction: ltr;
width: 816px; width: 816px;
height: 1056px; height: 1056px;
@ -147,17 +147,17 @@
background-color: white; background-color: white;
} }
:host .pdfViewer.removePageBorders .page { :host >>> .pdfViewer.removePageBorders .page {
margin: 0px auto 10px auto; margin: 0px auto 10px auto;
border: none; border: none;
} }
:host .pdfViewer .page canvas { :host >>> .pdfViewer .page canvas {
margin: 0; margin: 0;
display: block; display: block;
} }
:host .pdfViewer .page .loadingIcon { :host >>> .pdfViewer .page .loadingIcon {
position: absolute; position: absolute;
display: block; display: block;
left: 0; left: 0;
@ -166,7 +166,7 @@
bottom: 0; bottom: 0;
} }
:host .loadingIcon { :host >>> .loadingIcon {
width: 100px; width: 100px;
height: 100px; height: 100px;
left: 50% !important; left: 50% !important;
@ -187,8 +187,8 @@
-webkit-animation: load8 1.1s infinite linear; -webkit-animation: load8 1.1s infinite linear;
animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear;
} }
:host .loadingIcon, :host >>> .loadingIcon,
:host .loadingIcon:after { :host >>> .loadingIcon:after {
border-radius: 50%; border-radius: 50%;
} }
@-webkit-keyframes load8 { @-webkit-keyframes load8 {
@ -212,26 +212,26 @@
} }
} }
:host * { :host >>> * {
padding: 0; padding: 0;
margin: 0; margin: 0;
} }
:host html { :host >>> html {
height: 100%; height: 100%;
width: 100%; width: 100%;
/* Font size is needed to make the activity bar the correct size. */ /* Font size is needed to make the activity bar the correct size. */
font-size: 10px; font-size: 10px;
} }
:host body { :host >>> body {
height: 100%; height: 100%;
width: 100%; width: 100%;
background-color: #404040; background-color: #404040;
background-image: url(images/texture.png); background-image: url(images/texture.png);
} }
:host body, :host >>> body,
input, input,
button, button,
select { select {
@ -239,10 +239,10 @@ select {
outline: none; outline: none;
} }
:host .hidden { :host >>> .hidden {
display: none !important; display: none !important;
} }
:host [hidden] { :host >>> [hidden] {
display: none !important; display: none !important;
} }