Merge pull request #873 from Alfresco/dev-denys-632

Activiti Form bug fixes

ng2-components/ng2-activiti-form/src/components/activiti-form.component.ts

@@ -28,8 +28,6 @@ import { FormService } from './../services/form.service';
 import { NodeService } from './../services/node.service';
 import { FormModel, FormOutcomeModel, FormValues, FormFieldModel, FormOutcomeEvent } from './widgets/core/index';
 
-declare var componentHandler;
-
 import { WidgetVisibilityService }  from './../services/widget-visibility.service';
 
 /**

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

@@ -16,7 +16,7 @@
  */
 
 import { Component, ElementRef, OnInit } from '@angular/core';
-import { WidgetComponent } from './../widget.component';
+import { TextFieldWidgetComponent } from './../textfield-widget.component';
 
 @Component({
     moduleId: module.id,
@@ -24,12 +24,12 @@ import { WidgetComponent } from './../widget.component';
     templateUrl: './amount.widget.html',
     styleUrls: ['./amount.widget.css']
 })
-export class AmountWidget extends WidgetComponent implements OnInit {
+export class AmountWidget extends TextFieldWidgetComponent implements OnInit {
 
     currency: string = '$';
 
-    constructor(private elementRef: ElementRef) {
+    constructor(elementRef: ElementRef) {
-        super();
+        super(elementRef);
     }
 
     ngOnInit() {
@@ -38,21 +38,4 @@ export class AmountWidget extends WidgetComponent implements OnInit {
         }
     }
 
-    setupMaterialComponents(componentHandler: any): boolean {
-        // workaround for MDL issues with dynamic components
-        if (componentHandler) {
-            componentHandler.upgradeAllRegistered();
-            if (this.elementRef && this.hasValue()) {
-                let el = this.elementRef.nativeElement;
-                let container = el.querySelector('.mdl-textfield');
-                if (container) {
-                    container.MaterialTextfield.change(this.field.value);
-                }
-            }
-
-            return true;
-        }
-        return false;
-    }
-
 }

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

@@ -22,9 +22,6 @@ import { ExternalContent } from '../core/external-content';
 import { ExternalContentLink } from '../core/external-content-link';
 import { FormFieldModel } from '../core/form-field.model';
 
-declare var componentHandler;
-declare let dialogPolyfill: any;
-
 @Component({
     moduleId: module.id,
     selector: 'attach-widget',

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

@@ -18,8 +18,6 @@
 import { Component } from '@angular/core';
 import { WidgetComponent } from './../widget.component';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'checkbox-widget',

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

@@ -18,8 +18,6 @@
 import { Component, Input, AfterViewInit, Output, EventEmitter } from '@angular/core';
 import { ContainerModel, FormFieldModel } from './../core/index';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'container-widget',

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

@@ -18,8 +18,6 @@
 import { FormFieldModel } from './form-field.model';
 import { FormFieldTypes } from './form-field-types';
 
-declare var moment: any;
-
 export interface FormFieldValidator {
 
     isSupported(field: FormFieldModel): boolean;

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

@@ -16,7 +16,7 @@
  */
 
 import { Component, ElementRef } from '@angular/core';
-import { WidgetComponent } from './../widget.component';
+import { TextFieldWidgetComponent } from './../textfield-widget.component';
 
 @Component({
     moduleId: module.id,
@@ -24,27 +24,10 @@ import { WidgetComponent } from './../widget.component';
     templateUrl: './date.widget.html',
     styleUrls: ['./date.widget.css']
 })
-export class DateWidget extends WidgetComponent {
+export class DateWidget extends TextFieldWidgetComponent {
 
-    constructor(private elementRef: ElementRef) {
+    constructor(elementRef: ElementRef) {
-        super();
+        super(elementRef);
-    }
-
-    setupMaterialComponents(componentHandler: any): boolean {
-        // workaround for MDL issues with dynamic components
-        if (componentHandler) {
-            componentHandler.upgradeAllRegistered();
-            if (this.elementRef && this.hasValue()) {
-                let el = this.elementRef.nativeElement;
-                let container = el.querySelector('.mdl-textfield');
-                if (container) {
-                    container.MaterialTextfield.change(this.field.value);
-                }
-            }
-
-            return true;
-        }
-        return false;
     }
 
 }

ng2-components/ng2-activiti-form/src/components/widgets/display-text/display-text.widget.ts

@@ -18,8 +18,6 @@
 import { Component } from '@angular/core';
 import { WidgetComponent } from './../widget.component';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'display-text-widget',

ng2-components/ng2-activiti-form/src/components/widgets/display-value/display-value.widget.ts

@@ -21,8 +21,6 @@ import { FormFieldTypes } from '../core/form-field-types';
 import { FormService } from '../../../services/form.service';
 import { FormFieldOption } from './../core/form-field-option';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'display-value-widget',
@@ -31,11 +29,10 @@ declare var componentHandler;
 })
 export class DisplayValueWidget extends WidgetComponent implements OnInit {
 
-    DEFAULT_URL: string = '#';
-    DEFAULT_URL_SCHEME: string = 'http://';
-
     value: any;
     fieldType: string;
+    linkUrl: string;
+    linkText: string;
 
     constructor(private formService: FormService) {
         super();
@@ -84,6 +81,26 @@ export class DisplayValueWidget extends WidgetComponent implements OnInit {
                                 this.loadRadioButtonValue();
                             }
                             break;
+                        case FormFieldTypes.DATE:
+                            if (this.value) {
+                                let d = moment(this.value.split('T')[0]);
+                                if (d.isValid()) {
+                                    this.value = d.format('D-M-YYYY');
+                                }
+                            }
+                            break;
+                        case FormFieldTypes.AMOUNT:
+                            if (this.value) {
+                                let currency = this.field.currency || '$';
+                                this.value = `${currency} ${this.field.value}`;
+                            }
+                            break;
+                        case FormFieldTypes.HYPERLINK:
+                            if (this.value) {
+                                this.linkUrl = this.getHyperlinkUrl(this.field);
+                                this.linkText = this.getHyperlinkText(this.field);
+                            }
+                            break;
                         default:
                             this.value = this.field.value;
                             break;
@@ -122,27 +139,4 @@ export class DisplayValueWidget extends WidgetComponent implements OnInit {
                 }
             );
     }
-
-    // TODO: TAKEN FROM hyperlink WIDGET, OPTIMIZE
-    get linkUrl(): string {
-        let url = this.DEFAULT_URL;
-
-        if (this.field && this.field.hyperlinkUrl) {
-            url = this.field.hyperlinkUrl;
-            if (!/^https?:\/\//i.test(url)) {
-                url = this.DEFAULT_URL_SCHEME + url;
-            }
-        }
-
-        return url;
-    }
-
-    // TODO: TAKEN FROM hyperlink WIDGET, OPTIMIZE
-    get linkText(): string {
-        if (this.field) {
-            return this.field.displayText || this.field.hyperlinkUrl;
-        }
-        return null;
-    }
-
 }

ng2-components/ng2-activiti-form/src/components/widgets/hyperlink/hyperlink.widget.spec.ts

@@ -18,6 +18,7 @@
 import { HyperlinkWidget } from './hyperlink.widget';
 import { FormModel } from './../core/form.model';
 import { FormFieldModel } from './../core/form-field.model';
+import { WidgetComponent } from './../widget.component';
 
 describe('HyperlinkWidget', () => {
 
@@ -33,6 +34,7 @@ describe('HyperlinkWidget', () => {
         widget.field = new FormFieldModel(new FormModel(), {
             displayText: text
         });
+        widget.ngOnInit();
 
         expect(widget.linkText).toBe(text);
     });
@@ -44,12 +46,15 @@ describe('HyperlinkWidget', () => {
             displayText: null,
             hyperlinkUrl: url
         });
+        widget.ngOnInit();
 
         expect(widget.linkText).toBe(url);
     });
 
     it('should require field to get link text', () => {
         widget.field = null;
+        widget.ngOnInit();
+
         expect(widget.linkText).toBeNull();
     });
 
@@ -58,21 +63,25 @@ describe('HyperlinkWidget', () => {
             displayText: null,
             hyperlinkUrl: null
         });
+        widget.ngOnInit();
 
         expect(widget.linkText).toBeNull();
     });
 
     it('should return default url for missing field', () => {
         widget.field = null;
-        expect(widget.linkUrl).toBe(HyperlinkWidget.DEFAULT_URL);
+        widget.ngOnInit();
+
+        expect(widget.linkUrl).toBe(WidgetComponent.DEFAULT_HYPERLINK_URL);
     });
 
     it('should return default url for missing field property', () => {
         widget.field = new FormFieldModel(new FormModel(), {
             hyperlinkUrl: null
         });
+        widget.ngOnInit();
 
-        expect(widget.linkUrl).toBe(HyperlinkWidget.DEFAULT_URL);
+        expect(widget.linkUrl).toBe(WidgetComponent.DEFAULT_HYPERLINK_URL);
     });
 
     it('should prepend url with scheme', () => {
@@ -80,8 +89,9 @@ describe('HyperlinkWidget', () => {
         widget.field = new FormFieldModel(new FormModel(), {
             hyperlinkUrl: url
         });
+        widget.ngOnInit();
 
-        expect(widget.linkUrl).toBe(`${HyperlinkWidget.DEFAULT_URL_SCHEME}${url}`);
+        expect(widget.linkUrl).toBe(`${WidgetComponent.DEFAULT_HYPERLINK_SCHEME}${url}`);
     });
 
     it('should not prepend url with scheme', () => {
@@ -89,6 +99,7 @@ describe('HyperlinkWidget', () => {
         widget.field = new FormFieldModel(new FormModel(), {
             hyperlinkUrl: url
         });
+        widget.ngOnInit();
 
         expect(widget.linkUrl).toBe(url);
     });

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

@@ -15,40 +15,25 @@
  * limitations under the License.
  */
 
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { WidgetComponent } from './../widget.component';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'hyperlink-widget',
     templateUrl: './hyperlink.widget.html',
     styleUrls: ['./hyperlink.widget.css']
 })
-export class HyperlinkWidget extends WidgetComponent {
+export class HyperlinkWidget extends WidgetComponent implements OnInit {
 
-    static DEFAULT_URL: string = '#';
+    linkUrl: string = WidgetComponent.DEFAULT_HYPERLINK_URL;
-    static DEFAULT_URL_SCHEME: string = 'http://';
+    linkText: string = null;
 
-    get linkUrl(): string {
+    ngOnInit() {
-        let url = HyperlinkWidget.DEFAULT_URL;
-
-        if (this.field && this.field.hyperlinkUrl) {
-            url = this.field.hyperlinkUrl;
-            if (!/^https?:\/\//i.test(url)) {
-                url = HyperlinkWidget.DEFAULT_URL_SCHEME + url;
-            }
-        }
-
-        return url;
-    }
-
-    get linkText(): string {
         if (this.field) {
-            return this.field.displayText || this.field.hyperlinkUrl;
+            this.linkUrl = this.getHyperlinkUrl(this.field);
+            this.linkText = this.getHyperlinkText(this.field);
         }
-        return null;
     }
 
 }

ng2-components/ng2-activiti-form/src/components/widgets/multiline-text/multiline-text.widget.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, ElementRef } from '@angular/core';
-import { WidgetComponent } from './../widget.component';
+import { TextFieldWidgetComponent } from './../textfield-widget.component';
 
 @Component({
     moduleId: module.id,
@@ -24,27 +24,10 @@ import { WidgetComponent } from './../widget.component';
     templateUrl: './multiline-text.widget.html',
     styleUrls: ['./multiline-text.widget.css']
 })
-export class MultilineTextWidget extends WidgetComponent {
+export class MultilineTextWidget extends TextFieldWidgetComponent {
 
-    constructor(private elementRef: ElementRef) {
+    constructor(elementRef: ElementRef) {
-        super();
+        super(elementRef);
-    }
-
-    setupMaterialComponents(handler: any): boolean {
-        // workaround for MDL issues with dynamic components
-        if (handler) {
-            handler.upgradeAllRegistered();
-            if (this.elementRef && this.hasValue()) {
-                let el = this.elementRef.nativeElement;
-                let container = el.querySelector('.mdl-textfield');
-                if (container) {
-                    container.MaterialTextfield.change(this.field.value);
-                }
-            }
-
-            return true;
-        }
-        return false;
     }
 
 }

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

@@ -16,7 +16,7 @@
  */
 
 import { Component, ElementRef } from '@angular/core';
-import { WidgetComponent } from './../widget.component';
+import { TextFieldWidgetComponent } from './../textfield-widget.component';
 
 @Component({
     moduleId: module.id,
@@ -24,24 +24,10 @@ import { WidgetComponent } from './../widget.component';
     templateUrl: './number.widget.html',
     styleUrls: ['./number.widget.css']
 })
-export class NumberWidget extends WidgetComponent {
+export class NumberWidget extends TextFieldWidgetComponent {
 
-    constructor(private elementRef: ElementRef) {
+    constructor(elementRef: ElementRef) {
-        super();
+        super(elementRef);
     }
 
-    setupMaterialComponents(handler: any): boolean {
-        // workaround for MDL issues with dynamic components
-        if (handler) {
-            handler.upgradeAllRegistered();
-            if (this.elementRef && this.hasValue()) {
-                let container = this.elementRef.nativeElement.querySelector('.mdl-textfield');
-                if (container) {
-                    container.MaterialTextfield.change(this.field.value.toString());
-                }
-            }
-            return true;
-        }
-        return false;
-    }
 }

ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.ts

@@ -20,8 +20,6 @@ import { WidgetComponent } from './../widget.component';
 import { FormService } from '../../../services/form.service';
 import { FormFieldOption } from './../core/form-field-option';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'radio-buttons-widget',

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

@@ -18,4 +18,3 @@
         </div>
     </div>
 </div>
--

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

@@ -18,8 +18,6 @@
 import { Component, Input, AfterViewInit, EventEmitter, Output } from '@angular/core';
 import { TabModel, FormFieldModel } from './../core/index';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'tabs-widget',

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

@@ -16,7 +16,7 @@
  */
 
 import { Component, ElementRef } from '@angular/core';
-import { WidgetComponent } from './../widget.component';
+import { TextFieldWidgetComponent } from './../textfield-widget.component';
 
 @Component({
     moduleId: module.id,
@@ -24,27 +24,10 @@ import { WidgetComponent } from './../widget.component';
     templateUrl: './text.widget.html',
     styleUrls: ['./text.widget.css']
 })
-export class TextWidget extends WidgetComponent {
+export class TextWidget extends TextFieldWidgetComponent {
 
-    constructor(private elementRef: ElementRef) {
+    constructor(elementRef: ElementRef) {
-        super();
+        super(elementRef);
-    }
-
-    setupMaterialComponents(componentHandler: any): boolean {
-        // workaround for MDL issues with dynamic components
-        if (componentHandler) {
-            componentHandler.upgradeAllRegistered();
-            if (this.elementRef && this.hasValue()) {
-                let el = this.elementRef.nativeElement;
-                let container = el.querySelector('.mdl-textfield');
-                if (container) {
-                    container.MaterialTextfield.change(this.field.value);
-                }
-            }
-
-            return true;
-        }
-        return false;
     }
 
 }

ng2-components/ng2-activiti-form/src/components/widgets/textfield-widget.component.ts

@@ -0,0 +1,47 @@
+/*!
+ * @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 { ElementRef } from '@angular/core';
+import { WidgetComponent } from './widget.component';
+
+export abstract class TextFieldWidgetComponent extends WidgetComponent {
+
+    protected elementRef: ElementRef;
+
+    constructor(elementRef: ElementRef) {
+        super();
+        this.elementRef = elementRef;
+    }
+
+    // Overrides base implementation
+    setupMaterialComponents(handler: any): boolean {
+        // workaround for MDL issues with dynamic components
+        if (handler) {
+            handler.upgradeAllRegistered();
+            if (this.elementRef && this.hasValue()) {
+                let el = this.elementRef.nativeElement;
+                let container = el.querySelector('.mdl-textfield');
+                if (container) {
+                    container.MaterialTextfield.change(this.field.value.toString());
+                }
+            }
+            return true;
+        }
+        return false;
+    }
+
+}

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

@@ -20,8 +20,6 @@ import { FormService } from './../../../services/form.service';
 import { WidgetComponent } from './../widget.component';
 import { FormFieldOption } from './../core/form-field-option';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'typeahead-widget',

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

@@ -19,8 +19,6 @@ import { Component, OnInit } from '@angular/core';
 import { WidgetComponent } from './../widget.component';
 import { AlfrescoSettingsService, AlfrescoAuthenticationService } from 'ng2-alfresco-core';
 
-declare var componentHandler;
-
 @Component({
     moduleId: module.id,
     selector: 'upload-widget',

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

@@ -18,14 +18,14 @@
 import { Input, AfterViewInit, Output, EventEmitter } from '@angular/core';
 import { FormFieldModel } from './core/index';
 
-declare let __moduleName: string;
-declare var componentHandler;
-
 /**
  * Base widget component.
  */
 export class WidgetComponent implements AfterViewInit {
 
+    static DEFAULT_HYPERLINK_URL: string = '#';
+    static DEFAULT_HYPERLINK_SCHEME: string = 'http://';
+
     @Input()
     field: FormFieldModel;
 
@@ -67,4 +67,22 @@ export class WidgetComponent implements AfterViewInit {
         this.fieldChanged.emit(field);
     }
 
+    protected getHyperlinkUrl(field: FormFieldModel) {
+        let url = WidgetComponent.DEFAULT_HYPERLINK_URL;
+        if (field && field.hyperlinkUrl) {
+            url = field.hyperlinkUrl;
+            if (!/^https?:\/\//i.test(url)) {
+                url = `${WidgetComponent.DEFAULT_HYPERLINK_SCHEME}${url}`;
+            }
+        }
+        return url;
+    }
+
+    protected getHyperlinkText(field: FormFieldModel) {
+        if (field) {
+            return field.displayText || field.hyperlinkUrl;
+        }
+        return null;
+    }
+
 }

ng2-components/ng2-activiti-form/src/declarations.d.ts

@@ -0,0 +1,23 @@
+/*!
+ * @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.
+ */
+
+declare var module: any;
+declare var moment: any;
+
+// MDL
+declare var componentHandler: any;
+declare let dialogPolyfill: any;

ng2-components/ng2-activiti-form/tsconfig.json

@@ -8,14 +8,13 @@
         "sourceMap": true,
         "removeComments": true,
         "declaration": true,
-        "outDir": "dist"
+        "outDir": "dist",
+        "types": ["core-js", "jasmine"]
     },
     "exclude": [
         "demo",
         "dist",
         "node_modules",
-        "typings/main",
-        "typings/main.d.ts",
         "dist"
     ]
 }