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-613] Add plain text viewer (#1873)

Browse Source 
* add plain text viewer

* different devices optimizations

* returns types
This commit is contained in:
Eugenio Romano
2017-05-30 13:13:07 +01:00
committed by Eugenio Romano
parent a2ef939860
commit 4b5eb4bb29
13 changed files with 273 additions and 83 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
ng2-components/ng2-alfresco-core/src/services/alfresco-content.service.ts
View File

@@ -19,29 +19,59 @@ import { Injectable } from '@angular/core';
import { AlfrescoAuthenticationService } from './alfresco-authentication.service';
import { AlfrescoApiService } from './alfresco-api.service';
import { LogService } from './log.service.ts';
import { Observable } from 'rxjs/Rx';
@Injectable()
export class AlfrescoContentService {
constructor(public authService: AlfrescoAuthenticationService,
public apiService: AlfrescoApiService) {
public apiService: AlfrescoApiService,
private logService: LogService) {
}
/**
* Get thumbnail URL for the given document node.
* @param document Node to get URL for.
* @param nodeId {string} Node to get URL for.
* @returns {string} URL address.
*/
getDocumentThumbnailUrl(document: any): string {
return this.apiService.getInstance().content.getDocumentThumbnailUrl(document.entry.id);
getDocumentThumbnailUrl(nodeId: any): string {
if (nodeId && nodeId.entry) {
nodeId = nodeId.entry.id;
}
return this.apiService.getInstance().content.getDocumentThumbnailUrl(nodeId);
}
/**
* Get content URL for the given node.
* @param document Node to get URL for.
* @param nodeId {string} Node to get URL for.
* @returns {string} URL address.
*/
getContentUrl(document: any): string {
return this.apiService.getInstance().content.getContentUrl(document.entry.id);
getContentUrl(nodeId: any): string {
if (nodeId && nodeId.entry) {
nodeId = nodeId.entry.id;
}
return this.apiService.getInstance().content.getContentUrl(nodeId);
}
/**
* Get content for the given node.
* @param nodeId {string}.
*
* @returns {Observable<any>} URL address.
*/
getNodeContent(nodeId: string): Observable<any> {
return Observable.fromPromise(this.apiService.getInstance().core.nodesApi.getFileContent(nodeId).then((dataContent) => {
return dataContent;
})).catch(this.handleError);
}
private handleError(error: any) {
this.logService.error(error);
return Observable.throw(error || 'Server error');
}
}

2
ng2-components/ng2-alfresco-viewer/README.md
View File

@@ -222,7 +222,7 @@ platformBrowserDynamic().bootstrapModule(AppModule);
| --- | --- |
| Media | Mp4, WebM, Ogv |
| Images | png, jpg, jpeg, gif, bmp |
| Text | pdf |
| Text | pdf, txt |
# Custom extension handler

3
ng2-components/ng2-alfresco-viewer/index.ts
View File

@@ -33,6 +33,7 @@ import { ImgViewerComponent } from './src/components/imgViewer.component';
import { MediaPlayerComponent } from './src/components/mediaPlayer.component';
import { NotSupportedFormat } from './src/components/notSupportedFormat.component';
import { PdfViewerComponent } from './src/components/pdfViewer.component';
import { TxtViewerComponent } from './src/components/txtViewer.component';
import { ExtensionViewerDirective } from './src/directives/extension-viewer.directive';
export * from './src/components/viewer.component';
@@ -41,10 +42,12 @@ export * from './src/components/imgViewer.component';
export * from './src/components/mediaPlayer.component';
export * from './src/components/notSupportedFormat.component';
export * from './src/components/pdfViewer.component';
export * from './src/components/txtViewer.component';
export const VIEWER_DIRECTIVES: any[] = [
ViewerComponent,
ImgViewerComponent,
TxtViewerComponent,
MediaPlayerComponent,
NotSupportedFormat,
PdfViewerComponent,

8
ng2-components/ng2-alfresco-viewer/src/components/mediaPlayer.component.spec.ts
View File

@@ -64,28 +64,28 @@ describe('Test ng2-alfresco-viewer Media player component ', () => {
fixture.detectChanges();
});
it('If no url or no blob are passed should thrown an error', () => {
it('should thrown an error If no url or no blob are passed', () => {
let change = new SimpleChange(null, null, true);
expect(() => {
component.ngOnChanges({ 'blobFile': change });
}).toThrow(new Error('Attribute urlFile or blobFile is required'));
});
it('If url is passed should not thrown an error', () => {
it('should not thrown an error If url is passed', () => {
component.urlFile = 'fake-url';
expect(() => {
component.ngOnChanges(null);
}).not.toThrow(new Error('Attribute urlFile or blobFile is required'));
});
it('If url is passed should not thrown an error', () => {
it('should not thrown an error If url is passed', () => {
component.urlFile = 'fake-url';
expect(() => {
component.ngOnChanges(null);
}).not.toThrow(new Error('Attribute urlFile or blobFile is required'));
});
it('If blob is passed should not thrown an error', () => {
it('should not thrown an error If blob is passed', () => {
let blob = createFakeBlob();
spyOn(service, 'createTrustedUrl').and.returnValue('fake-blob-url');

4
ng2-components/ng2-alfresco-viewer/src/components/notSupportedFormat.component.spec.ts
View File

@@ -57,7 +57,7 @@ describe('Test ng2-alfresco-viewer Not Supported Format View component', () => {
describe('View', () => {
it('Download button should be present', () => {
it('should be present Download button', () => {
expect(element.querySelector('#viewer-download-button')).not.toBeNull();
});
@@ -69,7 +69,7 @@ describe('Test ng2-alfresco-viewer Not Supported Format View component', () => {
});
describe('User Interaction', () => {
it('Click on Download button should call download method', () => {
it('should call download method if Click on Download button', () => {
spyOn(window, 'open');
let downloadButton: any = element.querySelector('#viewer-download-button');

50
ng2-components/ng2-alfresco-viewer/src/components/pdfViewer.component.spec.ts
View File

@@ -84,7 +84,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
fixture.detectChanges();
});
it('If urlfile is not present should thrown an error ', () => {
it('should thrown an error If urlfile is not present', () => {
component.urlFile = undefined;
fixture.detectChanges();
@@ -94,21 +94,21 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
}).toThrow(new Error('Attribute urlFile or blobFile is required'));
});
it('Canvas should be present', () => {
it('should Canvas be present', () => {
expect(element.querySelector('#viewer-viewerPdf')).not.toBeNull();
expect(element.querySelector('#viewer-pdf-container')).not.toBeNull();
});
it('Loader should be present', () => {
it('should Loader be present', () => {
expect(element.querySelector('#loader-container')).not.toBeNull();
});
it('Next an Previous Buttons should be present', () => {
it('should Next an Previous Buttons be present', () => {
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
});
it('Input Page elements should be present', () => {
it('should Input Page elements be present', () => {
expect(element.querySelector('#viewer-pagenumber-input')).toBeDefined();
expect(element.querySelector('#viewer-total-pages')).toBeDefined();
@@ -116,7 +116,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
});
it('Toolbar should be hide if showToolbar is false', () => {
it('should Toolbar be hide if showToolbar is false', () => {
component.showToolbar = false;
fixture.detectChanges();
@@ -135,28 +135,28 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
fixture.detectChanges();
});
it('If blobFile is not present should thrown an error ', () => {
it('should If blobFile is not present thrown an error ', () => {
component.blobFile = undefined;
expect(() => {
component.ngOnChanges(null);
}).toThrow(new Error('Attribute urlFile or blobFile is required'));
});
it('Canvas should be present', () => {
it('should Canvas be present', () => {
expect(element.querySelector('#viewer-viewerPdf')).not.toBeNull();
expect(element.querySelector('#viewer-pdf-container')).not.toBeNull();
});
it('Loader should be present', () => {
it('should Loader be present', () => {
expect(element.querySelector('#loader-container')).not.toBeNull();
});
it('Next an Previous Buttons should be present', () => {
it('should Next an Previous Buttons be present', () => {
expect(element.querySelector('#viewer-previous-page-button')).not.toBeNull();
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
});
it('Input Page elements should be present', () => {
it('should Input Page elements be present', () => {
expect(element.querySelector('#viewer-pagenumber-input')).toBeDefined();
expect(element.querySelector('#viewer-total-pages')).toBeDefined();
@@ -164,7 +164,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
expect(element.querySelector('#viewer-next-page-button')).not.toBeNull();
});
it('Toolbar should be hide if showToolbar is false', () => {
it('should Toolbar be hide if showToolbar is false', () => {
component.showToolbar = false;
fixture.detectChanges();
@@ -182,7 +182,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
component.inputPage('1');
});
it('Total number of pages should be loaded', (done) => {
it('should Total number of pages be loaded', (done) => {
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
@@ -193,7 +193,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
});
}, 5000);
it('right arrow should move to the next page', (done) => {
it('should right arrow move to the next page', (done) => {
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
@@ -207,7 +207,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
});
}, 5000);
it('nextPage should move to the next page', (done) => {
it('should nextPage move to the next page', (done) => {
let nextPageButton: any = element.querySelector('#viewer-next-page-button');
component.ngOnChanges(null).then(() => {
@@ -223,7 +223,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
});
});
it('left arrow should move to the previous page', (done) => {
it('should left arrow move to the previous page', (done) => {
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
@@ -239,7 +239,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
});
});
it('previous page should move to the previous page', (done) => {
it('should previous page move to the previous page', (done) => {
let previousPageButton: any = element.querySelector('#viewer-previous-page-button');
let nextPageButton: any = element.querySelector('#viewer-next-page-button');
@@ -258,7 +258,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
});
});
it('previous page should not move to the previous page if is page 1', (done) => {
it('should previous page not move to the previous page if is page 1', (done) => {
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
@@ -272,7 +272,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
});
});
it('Input page should move to the inserted page', (done) => {
it('should Input page move to the inserted page', (done) => {
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
@@ -293,7 +293,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
fixture.detectChanges();
});
it('In should increment the scale value', (done) => {
it('should zoom in increment the scale value', (done) => {
let zoomInButton: any = element.querySelector('#viewer-zoom-in-button');
component.ngOnChanges(null).then(() => {
@@ -306,7 +306,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
});
});
it('Out should decrement the scale value', (done) => {
it('should zoom out decrement the scale value', (done) => {
let zoomOutButton: any = element.querySelector('#viewer-zoom-out-button');
component.ngOnChanges(null).then(() => {
@@ -319,7 +319,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
});
});
it('fit-in button should toggle page-fit and auto scale mode', (done) => {
it('should fit-in button toggle page-fit and auto scale mode', (done) => {
let fitPage: any = element.querySelector('#viewer-scale-page-button');
component.ngOnChanges(null).then(() => {
@@ -341,8 +341,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
fixture.detectChanges();
component.inputPage('1');
});
it('resize event should trigger setScaleUpdatePages', (done) => {
it('should resize event trigger setScaleUpdatePages', (done) => {
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {
@@ -362,8 +361,7 @@ describe('Test ng2-alfresco-viewer PdfViewer component', () => {
component.urlFile = require('../assets/fake-test-file.pdf');
fixture.detectChanges();
});
it('scroll page should return the current page', (done) => {
it('should scroll page return the current page', (done) => {
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
fixture.whenStable().then(() => {

10
ng2-components/ng2-alfresco-viewer/src/components/txtViewer.component.css Normal file
View File

@@ -0,0 +1,10 @@
.adf-txt-viewer-margin {
margin: auto !important;
overflow: auto;
font-size: 1em;
padding: 20px;
}
.full_width{
width :95% !important;
}

6
ng2-components/ng2-alfresco-viewer/src/components/txtViewer.component.html Normal file
View File

@@ -0,0 +1,6 @@
<section class="section--center mdl-grid mdl-grid--no-spacing">
<pre id="adf-viewer-text-container"class="adf-txt-viewer-margin mdl-card mdl-cell mdl-cell--12-col-desktop mdl-cell--12-col-tablet mdl-cell--2-col-phone mdl-shadow--2dp">
{{content}}
</pre>
</section>

65
ng2-components/ng2-alfresco-viewer/src/components/txtViewer.component.spec.ts Normal file
View File

@@ -0,0 +1,65 @@
/*!
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { TxtViewerComponent } from './txtViewer.component';
import { DebugElement } from '@angular/core';
import {
AlfrescoAuthenticationService,
AlfrescoSettingsService,
AlfrescoApiService,
CoreModule
} from 'ng2-alfresco-core';
describe('Test ng2-alfresco-viewer Text View component', () => {
let component: TxtViewerComponent;
let fixture: ComponentFixture<TxtViewerComponent>;
let debug: DebugElement;
let element: HTMLElement;
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [
CoreModule
],
declarations: [TxtViewerComponent],
providers: [
AlfrescoSettingsService,
AlfrescoAuthenticationService,
AlfrescoApiService
]
}).compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(TxtViewerComponent);
debug = fixture.debugElement;
element = fixture.nativeElement;
component = fixture.componentInstance;
component.content = 'example';
fixture.detectChanges();
});
describe('View', () => {
it('Should text container be present', () => {
expect(element.querySelector('#adf-viewer-text-container').textContent).toContain('example');
});
});
});

46
ng2-components/ng2-alfresco-viewer/src/components/txtViewer.component.ts Normal file
View File

@@ -0,0 +1,46 @@
/*!
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component, Input } from '@angular/core';
import { AlfrescoContentService } from 'ng2-alfresco-core';
@Component({
selector: 'txt-viewer',
templateUrl: './txtViewer.component.html',
styleUrls: ['./txtViewer.component.css']
})
export class TxtViewerComponent {
@Input()
nodeId: string;
content: string;
constructor(private alfrescoContentService: AlfrescoContentService) {
}
ngOnChanges() {
this.getNodeContent(this.nodeId);
}
private getNodeContent(nodeId) {
this.alfrescoContentService.getNodeContent(nodeId).subscribe((nodeContent) => {
this.content = nodeContent;
});
}
}

3
ng2-components/ng2-alfresco-viewer/src/components/viewer.component.html
View File

@@ -51,6 +51,9 @@
<media-player [urlFile]="urlFileContent" [mimeType]="mimeType" [blobFile]="blobFile"
[nameFile]="displayName"></media-player>
</div>
<div class="center-element" *ngIf="isText()">
<txt-viewer [nodeId]="fileNodeId" ></txt-viewer>
</div>
<span *ngFor="let extensionTemplate of extensionTemplates">
<ng-template

63
ng2-components/ng2-alfresco-viewer/src/components/viewer.component.spec.ts
View File

@@ -17,6 +17,7 @@
import { ComponentFixture, TestBed, async } from '@angular/core/testing';
import { PdfViewerComponent } from './pdfViewer.component';
import { TxtViewerComponent } from './txtViewer.component';
import { NotSupportedFormat } from './notSupportedFormat.component';
import { MediaPlayerComponent } from './mediaPlayer.component';
import { ImgViewerComponent } from './imgViewer.component';
@@ -48,6 +49,7 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
declarations: [
ViewerComponent,
PdfViewerComponent,
TxtViewerComponent,
NotSupportedFormat,
MediaPlayerComponent,
ImgViewerComponent
@@ -88,39 +90,39 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
fixture.detectChanges();
});
it('shadow overlay should be present if is overlay mode', () => {
it('should shadow overlay be present if is overlay mode', () => {
expect(element.querySelector('#viewer-shadow-transparent')).not.toBeNull();
});
it('header should be present if is overlay mode', () => {
it('should header be present if is overlay mode', () => {
expect(element.querySelector('header')).not.toBeNull();
});
it('Name File should be present if is overlay mode ', () => {
it('should Name File be present if is overlay mode ', () => {
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
expect(element.querySelector('#viewer-name-file').innerHTML).toEqual('fake-test-file.pdf');
});
});
it('Close button should be present if overlay mode', () => {
it('should Close button be present if overlay mode', () => {
expect(element.querySelector('#viewer-close-button')).not.toBeNull();
});
it('Click on close button should hide the viewer', () => {
it('should Click on close button hide the viewer', () => {
let closebutton: any = element.querySelector('#viewer-close-button');
closebutton.click();
fixture.detectChanges();
expect(element.querySelector('#viewer-main-container')).toBeNull();
});
it('Esc button should hide the viewer', () => {
it('should Esc button hide the viewer', () => {
EventMock.keyDown(27);
fixture.detectChanges();
expect(element.querySelector('#viewer-main-container')).toBeNull();
});
it('all-space class should not be present if is in overlay mode', () => {
it('should all-space class not be present if is in overlay mode', () => {
expect(element.querySelector('#viewer').getAttribute('class')).toEqual('');
});
});
@@ -132,15 +134,15 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
fixture.detectChanges();
});
it('header should be NOT be present if is not overlay mode', () => {
it('should header be NOT be present if is not overlay mode', () => {
expect(element.querySelector('header')).toBeNull();
});
it('Close button should be not present if is not overlay mode', () => {
it('should Close button be not present if is not overlay mode', () => {
expect(element.querySelector('#viewer-close-button')).toBeNull();
});
it('Esc button should not hide the viewer if is not overlay mode', () => {
it('should Esc button not hide the viewer if is not overlay mode', () => {
EventMock.keyDown(27);
fixture.detectChanges();
expect(element.querySelector('#viewer-main-container')).not.toBeNull();
@@ -153,7 +155,7 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
});
describe('Attribute', () => {
it('Url or fileNodeId File should be mandatory', () => {
it('should Url or fileNodeId be mandatory', () => {
component.showViewer = true;
component.fileNodeId = undefined;
component.urlFile = undefined;
@@ -163,7 +165,7 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
}).toThrow();
});
it('If FileNodeId is present should not be thrown any error ', () => {
it('should FileNodeId present not thrown any error ', () => {
component.showViewer = true;
component.fileNodeId = 'file-node-id';
component.urlFile = undefined;
@@ -173,7 +175,7 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
}).not.toThrow();
});
it('If urlFile is present should not be thrown any error ', () => {
it('should urlFile present not thrown any error ', () => {
component.showViewer = true;
component.fileNodeId = undefined;
@@ -182,11 +184,11 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
}).not.toThrow();
});
it('showViewer default value should be true', () => {
it('should showViewer default value be true', () => {
expect(component.showViewer).toBe(true);
});
it('if showViewer value is false the viewer should be hide', () => {
it('should viewer be hide if showViewer value is false', () => {
component.showViewer = false;
fixture.detectChanges();
@@ -195,7 +197,7 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
});
describe('Extension Type Test', () => {
it('if extension file is a pdf the pdf viewer should be loaded', (done) => {
it('should extension file pdf be loaded', (done) => {
component.urlFile = 'base/src/assets/fake-test-file.pdf';
component.ngOnChanges(null).then(() => {
@@ -205,7 +207,7 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
});
});
it('if extension file is a image the img viewer should be loaded', (done) => {
it('should extension file png be loaded', (done) => {
component.urlFile = 'fake-url-file.png';
component.ngOnChanges(null).then(() => {
@@ -215,7 +217,7 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
});
});
it('if extension file is a video the the media player should be loaded', (done) => {
it('should extension file mp4 be loaded', (done) => {
component.urlFile = 'fake-url-file.mp4';
component.ngOnChanges(null).then(() => {
@@ -225,7 +227,17 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
});
});
it('if extension file is a not supported the not supported div should be loaded', (done) => {
it('should extension file txt be loaded', (done) => {
component.urlFile = 'fake-url-file.txt';
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
expect(element.querySelector('txt-viewer')).not.toBeNull();
done();
});
});
it('should the not supported div be loaded if the file is a not supported extension', (done) => {
component.urlFile = 'fake-url-file.unsupported';
component.ngOnChanges(null).then(() => {
@@ -293,6 +305,17 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
});
});
it('should display the txt viewer if the file identified by mimetype is a txt when the filename has wrong extension', (done) => {
component.urlFile = 'content.bin';
component.mimeType = 'text/txt';
component.ngOnChanges(null).then(() => {
fixture.detectChanges();
expect(element.querySelector('txt-viewer')).not.toBeNull();
done();
});
});
it('should display the media player if the file identified by mimetype is a media when the filename has no extension', (done) => {
component.urlFile = 'content';
component.mimeType = 'video/mp4';
@@ -317,7 +340,7 @@ describe('Test ng2-alfresco-viewer ViewerComponent', () => {
});
describe('Events', () => {
it('if extension change exextensionChange event should be fired ', (done) => {
it('should if the extension change extension Change event be fired ', (done) => {
component.extensionChange.subscribe((fileExtension) => {
expect(fileExtension).toEqual('png');

52
ng2-components/ng2-alfresco-viewer/src/components/viewer.component.ts
View File

@@ -80,7 +80,6 @@ export class ViewerComponent {
throw new Error('Attribute urlFile or fileNodeId or blobFile is required');
}
return new Promise((resolve, reject) => {
let alfrescoApi = this.apiService.getInstance();
if (this.blobFile) {
this.mimeType = this.blobFile.type;
this.extensionChange.emit(this.mimeType);
@@ -93,10 +92,10 @@ export class ViewerComponent {
this.urlFileContent = this.urlFile;
resolve();
} else if (this.fileNodeId) {
alfrescoApi.nodes.getNodeInfo(this.fileNodeId).then((data: MinimalNodeEntryEntity) => {
this.apiService.getInstance().nodes.getNodeInfo(this.fileNodeId).then((data: MinimalNodeEntryEntity) => {
this.mimeType = data.content.mimeType;
this.displayName = data.name;
this.urlFileContent = alfrescoApi.content.getContentUrl(data.id);
this.urlFileContent = this.apiService.getInstance().content.getContentUrl(data.id);
this.extension = this.getFileExtension(data.name);
this.extensionChange.emit(this.extension);
this.loaded = true;
@@ -145,7 +144,7 @@ export class ViewerComponent {
* @param {string} url - url file
* @returns {string} name file
*/
getFilenameFromUrl(url: string) {
getFilenameFromUrl(url: string): string {
let anchor = url.indexOf('#');
let query = url.indexOf('?');
let end = Math.min(
@@ -160,7 +159,7 @@ export class ViewerComponent {
* @param {string} fileName - file name
* @returns {string} file name extension
*/
private getFileExtension(fileName: string) {
private getFileExtension(fileName: string): string {
return fileName.split('.').pop().toLowerCase();
}
@@ -169,7 +168,7 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
private isImage() {
private isImage(): boolean {
return this.isImageExtension() || this.isImageMimeType();
}
@@ -178,7 +177,7 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
private isMedia() {
private isMedia(): boolean {
return this.isMediaExtension(this.extension) || this.isMediaMimeType();
}
@@ -187,7 +186,7 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
private isImageExtension() {
private isImageExtension(): boolean {
return this.extension === 'png' || this.extension === 'jpg' ||
this.extension === 'jpeg' || this.extension === 'gif' || this.extension === 'bmp';
}
@@ -197,7 +196,7 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
private isMediaMimeType() {
private isMediaMimeType(): boolean {
let mimeExtension;
if (this.mimeType && this.mimeType.indexOf('/')) {
mimeExtension = this.mimeType.substr(this.mimeType.indexOf('/') + 1, this.mimeType.length);
@@ -211,7 +210,7 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
private isMediaExtension(extension: string) {
private isMediaExtension(extension: string): boolean {
return extension === 'mp4' || extension === 'WebM' || extension === 'Ogg';
}
@@ -220,7 +219,7 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
private isImageMimeType() {
private isImageMimeType(): boolean {
return this.mimeType && this.mimeType.indexOf('image/') === 0;
}
@@ -229,17 +228,26 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
private isPdf() {
private isPdf(): boolean {
return this.extension === 'pdf' || this.mimeType === 'application/pdf';
}
/**
* check if the current file is a supported txt extension
*
* @returns {boolean}
*/
private isText(): boolean {
return this.extension === 'txt' || this.mimeType === 'text/txt';
}
/**
* check if the current file is a supported extension
*
* @returns {boolean}
*/
supportedExtension() {
return this.isImage() || this.isPdf() || this.isMedia() || this.isExternalSupportedExtension();
supportedExtension(): boolean {
return this.isImage() || this.isPdf() || this.isMedia() || this.isText() || this.isExternalSupportedExtension();
}
/**
@@ -247,7 +255,7 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
isExternalSupportedExtension() {
isExternalSupportedExtension(): boolean {
let externalType: string;
if (this.externalExtensions && (this.externalExtensions instanceof Array)) {
@@ -274,8 +282,6 @@ export class ViewerComponent {
/**
* Check if in the document there are scrollable main area and disable it
*
* @returns {boolean}
*/
private blockOtherScrollBar() {
let mainElements: any = document.getElementsByTagName('main');
@@ -286,9 +292,7 @@ export class ViewerComponent {
}
/**
* Check if in the document there are scrollable main area and renable it
*
* @returns {boolean}
* Check if in the document there are scrollable main area and re-enable it
*/
private unblockOtherScrollBar() {
let mainElements: any = document.getElementsByTagName('main');
@@ -303,7 +307,7 @@ export class ViewerComponent {
*
* @returns {boolean}
*/
private isParentElementHeaderBar() {
private isParentElementHeaderBar(): boolean {
return !!this.closestElement(this.element.nativeElement, 'header');
}
@@ -313,7 +317,7 @@ export class ViewerComponent {
* @param {string} nodeName
* @returns {HTMLElement}
*/
private closestElement(element: HTMLElement, nodeName: string) {
private closestElement(element: HTMLElement, nodeName: string): HTMLElement {
let parent = element.parentElement;
if (parent) {
if (parent.nodeName.toLowerCase() === nodeName) {
@@ -340,8 +344,10 @@ export class ViewerComponent {
/**
* return true if the data about the node in the ecm are loaded
*
* @returns {boolean}
*/
isLoaded() {
isLoaded(): boolean {
return this.fileNodeId ? this.loaded : true;
}
}