Add support for directives on VFC

This change also updates the directives values according to Tosca 1.3 spec

Issue-ID: SDC-3074
Change-Id: Ia6a68c9a23a71a2c17ba2c006990342811aa7b4e
Signed-off-by: aribeiro <anderson.ribeiro@est.tech>

4 files changed, 69 insertions, 39 deletions

diff --git a/catalog-ui/src/app/models/componentsInstances/componentInstance.ts b/catalog-ui/src/app/models/componentsInstances/componentInstance.ts
index d3a99e5390..e311589637 100644
--- a/catalog-ui/src/app/models/componentsInstances/componentInstance.ts
+++ b/catalog-ui/src/app/models/componentsInstances/componentInstance.ts
@@ -34,6 +34,7 @@ import {
 import {ResourceType, ComponentType} from "../../utils/constants";
 import {Capability} from "../capability";
 import {Requirement} from "../requirement";
+import {DirectivesEnum} from "../../ng2/components/logic/service-dependencies/directive-option";
 
 export interface IComponentInstance {
 
@@ -104,10 +105,6 @@ export class ComponentInstance implements IComponentInstance{
     public originArchived:boolean;
     public directives: string[];
 
-    DIRECTIVES_TYPES = {
-        SELECTABLE: 'selectable'
-    };
-
     constructor(componentInstance?:ComponentInstance) {
 
         if (componentInstance) {
@@ -161,6 +158,10 @@ export class ComponentInstance implements IComponentInstance{
         return this.originType === ComponentType.SERVICE_PROXY;
     }
 
+    public isVFC = ():boolean => {
+        return this.originType === ResourceType.VFC;
+    }
+
     public getComponentUid = ():string => {
         return this.isServiceProxy()? this.sourceModelUid : this.componentUid;
     }
@@ -229,17 +230,23 @@ export class ComponentInstance implements IComponentInstance{
         return this.iconSprite + ' ' + this.icon;
     }
     public isDependent = () : boolean => {
-        return this.directives && this.directives.indexOf(this.DIRECTIVES_TYPES.SELECTABLE) !== -1;
+       return Array.isArray(this.directives) && this.directives.length > 0;
+    }
+
+    public markAsSelect = () : void => {
+        this.directives.push(DirectivesEnum.SELECT);
     }
 
-    public markAsDependent = () : void => {
-        this.directives.push(this.DIRECTIVES_TYPES.SELECTABLE);
+    public markAsSubstitute = () : void => {
+        this.directives.push(DirectivesEnum.SUBSTITUTE);
     }
 
-    public unmarkAsDependent = () : void => {
-        let index = this.directives.indexOf(this.DIRECTIVES_TYPES.SELECTABLE);
+    public unmarkAsDependent = (actualDirectiveValue: string) : void => {
+        console.info("[START] this.directives: ", this.directives)
+        let index = this.directives.indexOf(actualDirectiveValue);
         if(index >= 0) {
             this.directives.splice(index, 1);
         }
+        console.info("[STOP] this.directives: ", this.directives)
     }
 }
diff --git a/catalog-ui/src/app/models/componentsInstances/fullComponentInstance.ts b/catalog-ui/src/app/models/componentsInstances/fullComponentInstance.ts
index ce5aa1dae9..ab9015d949 100644
--- a/catalog-ui/src/app/models/componentsInstances/fullComponentInstance.ts
+++ b/catalog-ui/src/app/models/componentsInstances/fullComponentInstance.ts
@@ -25,10 +25,6 @@ export class FullComponentInstance extends ComponentInstance {
     public isResourceInstance: boolean;
     public directives: string[];
 
-    DIRECTIVES_TYPES = {
-        SELECTABLE: 'selectable'
-    };
-
     //service
     public serviceApiArtifacts:ArtifactGroupModel;
     public serviceType:string;
@@ -92,19 +88,5 @@ export class FullComponentInstance extends ComponentInstance {
     public isService = ():boolean => {
         return this.isServiceInstance;
     }
-    public isDependent = () : boolean => {
-        return this.directives && this.directives.indexOf(this.DIRECTIVES_TYPES.SELECTABLE) !== -1;
-    }
-
-    public markAsDependent = () : void => {
-        this.directives.push(this.DIRECTIVES_TYPES.SELECTABLE);
-    }
-
-    public unmarkAsDependent = () : void => {
-        const index = this.directives.indexOf(this.DIRECTIVES_TYPES.SELECTABLE);
-        if(index >= 0) {
-            this.directives.splice(index, 1);
-        }
-    }
 
 }
\ No newline at end of file
diff --git a/catalog-ui/src/app/models/graph/nodes/composition-graph-nodes/composition-ci-node-vfc.ts b/catalog-ui/src/app/models/graph/nodes/composition-graph-nodes/composition-ci-node-vfc.ts
index 4c16661548..ce95486ce3 100644
--- a/catalog-ui/src/app/models/graph/nodes/composition-graph-nodes/composition-ci-node-vfc.ts
+++ b/catalog-ui/src/app/models/graph/nodes/composition-graph-nodes/composition-ci-node-vfc.ts
@@ -17,19 +17,44 @@
  * limitations under the License.
  * ============LICENSE_END=========================================================
  */
-import {CompositionCiNodeBase} from "./composition-ci-node-base";
+import {ImagesUrl, GraphUIObjects} from "../../../../utils/constants";
+import {ComponentInstance, CompositionCiNodeBase} from "../../../../models";
 import {ImageCreatorService} from "app/ng2/pages/composition/graph/common/image-creator.service";
-import {ComponentInstance} from "../../../componentsInstances/componentInstance";
-import {ImagesUrl} from "../../../../utils/constants";
 
 export class CompositionCiNodeVfc extends CompositionCiNodeBase {
-    constructor(instance:ComponentInstance, imageCreator:ImageCreatorService) {
-        super(instance, imageCreator);
-        this.initVfc();
-    }
+  private isDependent: boolean;
+  private originalImg: string;
+
+  constructor(instance: ComponentInstance, imageCreator: ImageCreatorService) {
+    super(instance, imageCreator);
+    this.isDependent = instance.isDependent();
+    this.initVfc();
+  }
 
-    private initVfc():void {
-        this.imagesPath = this.imagesPath + ImagesUrl.RESOURCE_ICONS;
-        this.img = this.imagesPath + this.componentInstance.icon + '.png';
+  private initVfc(): void {
+    this.imagesPath = this.imagesPath + ImagesUrl.RESOURCE_ICONS;
+    this.img = this.imagesPath + this.componentInstance.icon + '.png';
+    this.originalImg = this.img;
+    this.imgWidth = GraphUIObjects.DEFAULT_RESOURCE_WIDTH;
+    this.classes = 'vfc-node';
+    if (this.archived) {
+      this.classes = this.classes + ' archived';
+      return;
+    }
+    if (this.isDependent) {
+      this.classes += ' dependent';
+    }
+    if (!this.certified) {
+      this.classes = this.classes + ' not-certified';
     }
+  }
+
+  public initUncertifiedDependentImage(node:Cy.Collection, nodeMinSize:number):string {
+    return this.enhanceImage(node, nodeMinSize, this.imagesPath + 'uncertified_dependent.png');
+  }
+
+  public initDependentImage(node:Cy.Collection, nodeMinSize:number):string {
+    return this.enhanceImage(node, nodeMinSize, this.imagesPath + 'dependent.png');
+  }
+
 }
diff --git a/catalog-ui/src/app/models/graph/nodes/nodes-factory.ts b/catalog-ui/src/app/models/graph/nodes/nodes-factory.ts
index bcd2f7e111..fbcd479603 100644
--- a/catalog-ui/src/app/models/graph/nodes/nodes-factory.ts
+++ b/catalog-ui/src/app/models/graph/nodes/nodes-factory.ts
@@ -19,8 +19,21 @@
  */
 'use strict';
 
-import {CompositionCiNodeUcpeCp, Module, ModuleNodeBase, CompositionCiNodeVf, CompositionCiNodeVl, CompositionCiNodeCp, CompositionCiNodeConfiguration,
-    NodeUcpe, CompositionCiNodeService,CompositionCiNodeServiceProxy, CompositionCiNodeBase, ComponentInstance} from "./../../../models";
+import {
+    CompositionCiNodeUcpeCp,
+    Module,
+    ModuleNodeBase,
+    CompositionCiNodeVf,
+    CompositionCiNodeVl,
+    CompositionCiNodeCp,
+    CompositionCiNodeConfiguration,
+    NodeUcpe,
+    CompositionCiNodeService,
+    CompositionCiNodeServiceProxy,
+    CompositionCiNodeBase,
+    ComponentInstance,
+    CompositionCiNodeVfc
+} from "./../../../models";
 import {ComponentType, ResourceType} from "../../../utils/constants";
 import {ImageCreatorService} from "app/ng2/pages/composition/graph/common/image-creator.service";
 import {Injectable} from "@angular/core";
@@ -42,6 +55,9 @@ export class NodesFactory {
         if (instance.originType === ComponentType.SERVICE_PROXY) {
             return new CompositionCiNodeServiceProxy(instance, this.imageCreator);
         }
+        if (instance.originType == ResourceType.VFC) {
+            return new CompositionCiNodeVfc(instance, this.imageCreator);
+        }
         if (instance.originType === ResourceType.CP) {
             return new CompositionCiNodeCp(instance, this.imageCreator);
         }