new "document" widget (#2307)

ng2-components/ng2-activiti-form/src/components/widgets/content/content.widget.html

@@ -1,4 +1,4 @@
-<md-card class="example-card" class="adf-content-container" *ngIf="content">
+<md-card class="adf-content-container" *ngIf="content">
     <md-card-content *ngIf="showDocumentContent">
         <div *ngIf="content.isThumbnailSupported()" >
             <img id="thumbnailPreview" class="adf-img-upload-widget" [src]="content.thumbnailUrl" alt="{{content.name}}">

ng2-components/ng2-activiti-form/src/components/widgets/content/content.widget.scss

@@ -1,8 +1,4 @@
 .adf {
-    &-content-container  {
-
-    }
-
     &-img-upload-widget {
         width: 100%;
         height: 100%;

ng2-components/ng2-activiti-form/src/components/widgets/core/form-field.model.ts

@@ -168,7 +168,10 @@ export class FormFieldModel extends FormWidgetModel {
 
             if (FormFieldTypes.isReadOnlyType(json.type)) {
                 if (json.params && json.params.field && json.params.field.responseVariable) {
-                    this.value = this.getVariablesValue(json.params.field.name, form);
+                    const value = this.getVariablesValue(json.params.field.name, form);
+                    if (value) {
+                        this.value = value;
+                    }
                 }
             }
 
@@ -189,11 +192,15 @@ export class FormFieldModel extends FormWidgetModel {
             return currentVariable.name === variableName;
         });
 
-        if (variable.type === 'boolean') {
-            return JSON.parse(variable.value);
+        if (variable) {
+            if (variable.type === 'boolean') {
+                return JSON.parse(variable.value);
+            }
+
+            return variable.value;
         }
 
-        return variable.value;
+        return null;
     }
 
     private containerFactory(json: any, form: FormModel): void {

ng2-components/ng2-activiti-form/src/components/widgets/document/document.widget.html

@@ -0,0 +1,5 @@
+<div class="adf-form-document-widget {{field.className}}">
+    <ng-container *ngIf="hasFile">
+        <adf-content [id]="fileId" [showDocumentContent]="true"></adf-content>
+    </ng-container>
+</div>

ng2-components/ng2-activiti-form/src/components/widgets/document/document.widget.ts

@@ -0,0 +1,50 @@
+/*!
+ * @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, OnInit, ViewEncapsulation } from '@angular/core';
+import { FormService } from './../../../services/form.service';
+import { baseHost , WidgetComponent } from './../widget.component';
+
+@Component({
+    selector: 'adf-form-document-widget',
+    templateUrl: 'document.widget.html',
+    host: baseHost,
+    encapsulation: ViewEncapsulation.None
+})
+export class DocumentWidgetComponent extends WidgetComponent implements OnInit {
+
+    fileId: string = null;
+    hasFile: boolean = false;
+
+    constructor(public formService: FormService) {
+         super(formService);
+    }
+
+    ngOnInit() {
+        if (this.field) {
+            const file = this.field.value;
+
+            if (file) {
+                this.fileId = file.id;
+                this.hasFile = true;
+            } else {
+                this.fileId = null;
+                this.hasFile = false;
+            }
+        }
+    }
+}

ng2-components/ng2-activiti-form/src/components/widgets/index.ts

@@ -24,6 +24,7 @@ import { AttachWidgetComponent } from './attach/attach.widget';
 import { CheckboxWidgetComponent } from './checkbox/checkbox.widget';
 import { DateWidgetComponent } from './date/date.widget';
 import { DisplayTextWidgetComponentComponent } from './display-text/display-text.widget';
+import { DocumentWidgetComponent } from './document/document.widget';
 import { DropdownWidgetComponent } from './dropdown/dropdown.widget';
 import { DynamicTableWidgetComponent } from './dynamic-table/dynamic-table.widget';
 import { BooleanEditorComponent } from './dynamic-table/editors/boolean/boolean.editor';
@@ -70,6 +71,7 @@ export * from './date/date.widget';
 export * from './amount/amount.widget';
 export * from './dynamic-table/dynamic-table.widget';
 export * from './error/error.component';
+export { DocumentWidgetComponent } from './document/document.widget';
 
 // editors (dynamic table)
 export * from './dynamic-table/editors/row.editor';
@@ -104,7 +106,8 @@ export const WIDGET_DIRECTIVES: any[] = [
     BooleanEditorComponent,
     TextEditorComponent,
     RowEditorComponent,
-    ErrorWidgetComponent
+    ErrorWidgetComponent,
+    DocumentWidgetComponent
 ];
 
 export const MASK_DIRECTIVE: any[] = [

ng2-components/ng2-activiti-form/src/services/form-rendering.service.ts

@@ -24,6 +24,7 @@ import {
     ContainerWidgetComponent,
     DateWidgetComponent,
     DisplayTextWidgetComponentComponent,
+    DocumentWidgetComponent,
     DropdownWidgetComponent,
     DynamicTableWidgetComponent,
     FormFieldModel,
@@ -58,7 +59,8 @@ export class FormRenderingService {
         'functional-group': DefaultTypeResolver.fromType(FunctionalGroupWidgetComponent),
         'dynamic-table': DefaultTypeResolver.fromType(DynamicTableWidgetComponent),
         'container': DefaultTypeResolver.fromType(ContainerWidgetComponent),
-        'group': DefaultTypeResolver.fromType(ContainerWidgetComponent)
+        'group': DefaultTypeResolver.fromType(ContainerWidgetComponent),
+        'document': DefaultTypeResolver.fromType(DocumentWidgetComponent)
     };
 
     constructor() {