inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-26 17:24:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make the rendition conversion great again (#2126)

Browse Source
This commit is contained in:
Popovics András 2017-07-25 14:49:32 +01:00 committed by Eugenio Romano
parent df32a49c9e
commit a17d85adb5
3 changed files with 100 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -3,12 +3,25 @@
<div *ngIf="!isConversionStarted" class="viewer-download-text mdl-card__supporting-text">
<h4>File '<span>{{nameFile}}</span>' is of an unsupported format</h4>
</div>
<md-spinner *ngIf="isConversionStarted" id="conversion-spinner" class="adf-conversion-spinner" color="primary"></md-spinner>
<md-spinner *ngIf="isConversionStarted"
id="conversion-spinner"
class="adf-conversion-spinner"
color="primary"
data-automation-id="viewer-conversion-spinner"></md-spinner>
<div class="button-container mdl-card__actions">
<button md-button id="viewer-download-button" aria-label="Download" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--accent" (click)="download()">
<md-icon class="viewer-button-icon">cloud_download</md-icon> Download
</button>
<button md-button *ngIf="convertible" [disabled]="isConversionStarted" id="viewer-convert-button" aria-label="Convert to PDF" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="convertToPdf()">
<button *ngIf="convertible"
md-button
id="viewer-convert-button"
aria-label="Convert to PDF"
class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary"
[disabled]="isConversionStarted"
(click)="convertToPdf()"
data-automation-id="viewer-convert-button">
<md-icon class="viewer-button-icon">insert_drive_file</md-icon> Convert to PDF
</button>
<button md-button *ngIf="displayable" id="viewer-display-button" aria-label="Show PDF" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--primary" (click)="showPDF()">
@ -18,4 +31,9 @@
</div>
</section>
<pdf-viewer *ngIf="isConversionFinished" id="pdf-rendition-viewer" [showToolbar]="showToolbar" [urlFile]="renditionUrl" [nameFile]="nameFile"></pdf-viewer>
<pdf-viewer *ngIf="isConversionFinished"
id="pdf-rendition-viewer"
[showToolbar]="showToolbar"
[urlFile]="renditionUrl"
[nameFile]="nameFile"
data-automation-id="pdf-rendition-viewer"></pdf-viewer>

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

@ -18,6 +18,7 @@
import { DebugElement } from '@angular/core';
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { MdButtonModule, MdIconModule, MdProgressSpinnerModule } from '@angular/material';
import { By } from '@angular/platform-browser';
import {
AlfrescoApiService,
AlfrescoAuthenticationService,
@ -35,9 +36,9 @@ interface RenditionResponse {
entry: {
status: string
};
};
}
describe('Test ng2-alfresco-viewer Not Supported Format View component', () => {
describe('NotSupportedFormatComponent', () => {
const nodeId = 'not-supported-node-id';
@ -157,6 +158,60 @@ describe('Test ng2-alfresco-viewer Not Supported Format View component', () => {
expect(element.querySelector('#viewer-convert-button')).toBeNull();
});
}));
it('should start the conversion when clicking on the "Convert to PDF" button', () => {
component.convertible = true;
fixture.detectChanges();
const convertButton = debug.query(By.css('[data-automation-id="viewer-convert-button"]'));
convertButton.triggerEventHandler('click', null);
fixture.detectChanges();
const conversionSpinner = debug.query(By.css('[data-automation-id="viewer-conversion-spinner"]'));
expect(renditionsService.convert).toHaveBeenCalled();
expect(conversionSpinner).not.toBeNull();
});
it('should remove the spinner if an error happens during conversion', () => {
component.convertToPdf();
conversionSubject.error('whatever');
fixture.detectChanges();
const conversionSpinner = debug.query(By.css('[data-automation-id="viewer-conversion-spinner"]'));
expect(conversionSpinner).toBeNull();
});
it('should remove the spinner and show the pdf if conversion has finished', () => {
component.convertToPdf();
conversionSubject.complete();
fixture.detectChanges();
const conversionSpinner = debug.query(By.css('[data-automation-id="viewer-conversion-spinner"]'));
const pdfRenditionViewer = debug.query(By.css('[data-automation-id="pdf-rendition-viewer"]'));
expect(conversionSpinner).toBeNull();
expect(pdfRenditionViewer).not.toBeNull();
});
it('should unsubscribe from the conversion subscription on ngOnDestroy', () => {
component.convertToPdf();
component.ngOnDestroy();
conversionSubject.complete();
fixture.detectChanges();
const pdfRenditionViewer = debug.query(By.css('[data-automation-id="pdf-rendition-viewer"]'));
expect(pdfRenditionViewer).toBeNull();
});
it('should not throw error on ngOnDestroy if the conversion hasn\'t started at all' , () => {
const callNgOnDestroy = () => {
component.ngOnDestroy();
};
expect(callNgOnDestroy).not.toThrowError();
});
});
describe('User Interaction', () => {

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

@ -17,7 +17,7 @@
/* tslint:disable:component-selector */
import { Component, Input, OnInit } from '@angular/core';
import { Component, Input, OnDestroy, OnInit } from '@angular/core';
import { ContentService, RenditionsService } from 'ng2-alfresco-core';
import { AlfrescoApiService } from 'ng2-alfresco-core';
@ -28,7 +28,7 @@ const DEFAULT_CONVERSION_ENCODING = 'pdf';
templateUrl: './notSupportedFormat.component.html',
styleUrls: ['./notSupportedFormat.component.css']
})
export class NotSupportedFormatComponent implements OnInit {
export class NotSupportedFormatComponent implements OnInit, OnDestroy {
@Input()
nameFile: string;
@ -50,6 +50,7 @@ export class NotSupportedFormatComponent implements OnInit {
isConversionStarted: boolean = false;
isConversionFinished: boolean = false;
renditionUrl: string|null = null;
conversionsubscription: any = null;
constructor(
private contentService: ContentService,
@ -57,6 +58,15 @@ export class NotSupportedFormatComponent implements OnInit {
private apiService: AlfrescoApiService
) {}
/**
* Checks for available renditions if the nodeId is present
*/
ngOnInit() {
if (this.nodeId) {
this.checkRendition();
}
}
/**
* Download file opening it in a new window
*/
@ -68,12 +78,6 @@ export class NotSupportedFormatComponent implements OnInit {
}
}
ngOnInit() {
if (this.nodeId) {
this.checkRendition();
}
}
/**
* Update component's button according to the given rendition's availability
*
@ -104,7 +108,7 @@ export class NotSupportedFormatComponent implements OnInit {
convertToPdf(): void {
this.isConversionStarted = true;
this.renditionsService.convert(this.nodeId, DEFAULT_CONVERSION_ENCODING)
this.conversionsubscription = this.renditionsService.convert(this.nodeId, DEFAULT_CONVERSION_ENCODING)
.subscribe({
error: (error) => { this.isConversionStarted = false; },
complete: () => { this.showPDF(); }
@ -119,4 +123,13 @@ export class NotSupportedFormatComponent implements OnInit {
this.isConversionStarted = false;
this.isConversionFinished = true;
}
/**
* Kills the subscription polling if it has been started
*/
ngOnDestroy(): void {
if (this.isConversionStarted) {
this.conversionsubscription.unsubscribe();
}
}
}