Integration beetwen Viewer and Activiti Content (#1765)

* Provide a FormService event when you click on the uploaded content

* Add a formContentClick event to the Form component

* Provide a way to pass Blob to viewer

* Provide a way to use the viewer using a Blob
 - Fix the pdf viewer
 - Fix the image viewer
 - Fix the media viewer

* Update the viewer documentation

* Use the ContentService provided by the core

* Fix and improve unit test

* Add unit test blob viewer

demo-shell-ng2/app/components/activiti/activiti-demo.component.html

@@ -37,7 +37,7 @@
                                            [sort]="taskFilter.filter.sort"
                                            [data]="dataTasks"
                                            [landingTaskId]="currentTaskId"
-                                           (rowClick)="onTaskRowClick($event)" 
+                                           (rowClick)="onTaskRowClick($event)"
                                            (onSuccess)="onSuccessTaskList($event)"
                                            (row-click)="onRowClick($event)"
                                            (row-dblclick)="onRowDblClick($event)"
@@ -55,6 +55,7 @@
                         <activiti-task-details #activitidetails
                             [taskId]="currentTaskId"
                             (formCompleted)="onFormCompleted($event)"
+                            (formContentClicked)="onFormContentClick($event)"
                             (taskCreated)="onTaskCreated($event)">
                         </activiti-task-details>
                     </div>
@@ -142,3 +143,11 @@
 
     </main>
 </div>
+
+<div *ngIf="fileShowed">
+    <alfresco-viewer [(showViewer)]="fileShowed"
+                     [blobFile]="content"
+                     [displayName]="contentName"
+                     [overlayMode]="true">
+    </alfresco-viewer>
+</div>

demo-shell-ng2/app/components/activiti/activiti-demo.component.ts

@@ -78,6 +78,11 @@ export class ActivitiDemoComponent implements AfterViewInit {
     @Input()
     appId: number = null;
 
+    fileShowed: boolean = false;
+
+    content: Blob;
+    contentName: string;
+
     layoutType: string;
     currentTaskId: string;
     currentProcessInstanceId: string;
@@ -92,6 +97,8 @@ export class ActivitiDemoComponent implements AfterViewInit {
     processFilter: FilterProcessRepresentationModel;
 
     sub: Subscription;
+    blobFile: any;
+    flag: boolean = true;
 
     dataTasks: ObjectDataTableAdapter;
     dataProcesses: ObjectDataTableAdapter;
@@ -113,6 +120,7 @@ export class ActivitiDemoComponent implements AfterViewInit {
         );
         this.dataProcesses.setSorting(new DataSorting('started', 'desc'));
 
+
         // Uncomment this line to replace all 'text' field editors with custom component
         // formRenderingService.setComponentTypeResolver('text', () => CustomEditorComponent, true);
 
@@ -126,6 +134,7 @@ export class ActivitiDemoComponent implements AfterViewInit {
         formService.formFieldValueChanged.subscribe((e: FormFieldEvent) => {
             console.log(`Field value changed. Form: ${e.form.id}, Field: ${e.field.id}, Value: ${e.field.value}`);
         });
+
     }
 
     ngOnInit() {
@@ -242,6 +251,12 @@ export class ActivitiDemoComponent implements AfterViewInit {
         this.currentTaskId = null;
     }
 
+    onFormContentClick(content: any) {
+        this.fileShowed = true;
+        this.content = content.contentBlob;
+        this.contentName = content.name;
+    }
+
     onTaskCreated(data: any) {
         this.currentTaskId = data.parentTaskId;
         this.activititasklist.reload();