diff options
5 files changed, 329 insertions, 383 deletions
diff --git a/catalog-ui/src/app/directives/graphs-v2/composition-graph/composition-graph.directive.ts b/catalog-ui/src/app/directives/graphs-v2/composition-graph/composition-graph.directive.ts index e40792dc7e..804e772ac4 100644 --- a/catalog-ui/src/app/directives/graphs-v2/composition-graph/composition-graph.directive.ts +++ b/catalog-ui/src/app/directives/graphs-v2/composition-graph/composition-graph.directive.ts @@ -35,133 +35,126 @@ import { NodesFactory, Point } from "app/models"; -import {ComponentInstanceFactory, ComponentFactory, GRAPH_EVENTS, GraphColors} from "app/utils"; -import {EventListenerService, LoaderService} from "app/services"; -import {CompositionGraphLinkUtils} from "./utils/composition-graph-links-utils"; -import {CompositionGraphGeneralUtils} from "./utils/composition-graph-general-utils"; -import {CompositionGraphNodesUtils} from "./utils/composition-graph-nodes-utils"; -import {CommonGraphUtils} from "../common/common-graph-utils"; -import {MatchCapabilitiesRequirementsUtils} from "./utils/match-capability-requierment-utils"; -import {CompositionGraphPaletteUtils} from "./utils/composition-graph-palette-utils"; -import {ComponentInstanceNodesStyle} from "../common/style/component-instances-nodes-style"; -import {CytoscapeEdgeEditation} from 'third-party/cytoscape.js-edge-editation/CytoscapeEdgeEditation.js'; -import {ComponentServiceNg2} from "../../../ng2/services/component-services/component.service"; -import {ComponentGenericResponse} from "../../../ng2/services/responses/component-generic-response"; -import {ModalService} from "../../../ng2/services/modal.service"; -import {ConnectionWizardService} from "../../../ng2/pages/connection-wizard/connection-wizard.service"; -import {StepModel} from "../../../models/wizard-step"; -import {FromNodeStepComponent} from "app/ng2/pages/connection-wizard/from-node-step/from-node-step.component"; -import {PropertiesStepComponent} from "app/ng2/pages/connection-wizard/properties-step/properties-step.component"; -import {ToNodeStepComponent} from "app/ng2/pages/connection-wizard/to-node-step/to-node-step.component"; -import {ConnectionWizardHeaderComponent} from "app/ng2/pages/connection-wizard/connection-wizard-header/connection-wizard-header.component"; -import {ConnectionPropertiesViewComponent} from "../../../ng2/pages/connection-wizard/connection-properties-view/connection-properties-view.component"; -import {ComponentInstanceServiceNg2} from "../../../ng2/services/component-instance-services/component-instance.service"; -import {EVENTS} from "../../../utils/constants"; -import {PropertyBEModel} from "../../../models/properties-inputs/property-be-model"; -import {ForwardingPath} from "app/models/forwarding-path"; -import {ServicePathGraphUtils} from "./utils/composition-graph-service-path-utils"; -import {CompositionCiServicePathLink} from "app/models/graph/graph-links/composition-graph-links/composition-ci-service-path-link"; +import { ComponentInstanceFactory, ComponentFactory, GRAPH_EVENTS, GraphColors } from "app/utils"; +import { EventListenerService, LoaderService } from "app/services"; +import { CompositionGraphLinkUtils } from "./utils/composition-graph-links-utils"; +import { CompositionGraphGeneralUtils } from "./utils/composition-graph-general-utils"; +import { CompositionGraphNodesUtils } from "./utils/composition-graph-nodes-utils"; +import { CommonGraphUtils } from "../common/common-graph-utils"; +import { MatchCapabilitiesRequirementsUtils } from "./utils/match-capability-requierment-utils"; +import { CompositionGraphPaletteUtils } from "./utils/composition-graph-palette-utils"; +import { ComponentInstanceNodesStyle } from "../common/style/component-instances-nodes-style"; +import { CytoscapeEdgeEditation } from 'third-party/cytoscape.js-edge-editation/CytoscapeEdgeEditation.js'; +import { ComponentServiceNg2 } from "../../../ng2/services/component-services/component.service"; +import { ComponentGenericResponse } from "../../../ng2/services/responses/component-generic-response"; +import { ModalService } from "../../../ng2/services/modal.service"; +import { ConnectionWizardService } from "../../../ng2/pages/connection-wizard/connection-wizard.service"; +import { StepModel } from "../../../models/wizard-step"; +import { FromNodeStepComponent } from "app/ng2/pages/connection-wizard/from-node-step/from-node-step.component"; +import { PropertiesStepComponent } from "app/ng2/pages/connection-wizard/properties-step/properties-step.component"; +import { ToNodeStepComponent } from "app/ng2/pages/connection-wizard/to-node-step/to-node-step.component"; +import { ConnectionWizardHeaderComponent } from "app/ng2/pages/connection-wizard/connection-wizard-header/connection-wizard-header.component"; +import { ConnectionPropertiesViewComponent } from "../../../ng2/pages/connection-wizard/connection-properties-view/connection-properties-view.component"; +import { ComponentInstanceServiceNg2 } from "../../../ng2/services/component-instance-services/component-instance.service"; +import { EVENTS } from "../../../utils/constants"; +import { PropertyBEModel } from "../../../models/properties-inputs/property-be-model"; +import { ForwardingPath } from "app/models/forwarding-path"; +import { ServicePathGraphUtils } from "./utils/composition-graph-service-path-utils"; +import { CompositionCiServicePathLink } from "app/models/graph/graph-links/composition-graph-links/composition-ci-service-path-link"; import { ZoneInstance, ZoneInstanceMode, ZoneInstanceType, ZoneInstanceAssignmentType } from "app/models/graph/zones/zone-instance"; -import {Zone} from "app/models/graph/zones/zone"; -import {CompositionGraphZoneUtils} from "./utils/composition-graph-zone-utils"; -import {UIZoneInstanceObject} from "../../../models/ui-models/ui-zone-instance-object"; -import {GroupInstance} from "../../../models/graph/zones/group-instance"; -import {PolicyInstance} from "../../../models/graph/zones/policy-instance"; +import { Zone } from "app/models/graph/zones/zone"; +import { CompositionGraphZoneUtils } from "./utils/composition-graph-zone-utils"; +import { UIZoneInstanceObject } from "../../../models/ui-models/ui-zone-instance-object"; +import { GroupInstance } from "../../../models/graph/zones/group-instance"; +import { PolicyInstance } from "../../../models/graph/zones/policy-instance"; export interface ICompositionGraphScope extends ng.IScope { - component:Component; - isLoading:boolean; - isViewOnly:boolean; - withSidebar:boolean; + component: Component; + isLoading: boolean; + isViewOnly: boolean; + withSidebar: boolean; //zones newZoneInstance; - zoneTagMode:string; - activeZoneInstance:ZoneInstance; - zones:Array<Zone>; - zoneMinimizeToggle(zoneType:ZoneInstanceType):void; - zoneInstanceTagged(taggedInstance:ZoneInstance):void; - zoneInstanceModeChanged(newMode:ZoneInstanceMode, instance:ZoneInstance, zoneId:ZoneInstanceType); - unsetActiveZoneInstance():void; - clickOutsideZoneInstance():void; - zoneAssignmentSaveStart():void; - zoneAssignmentSaveComplete(success:boolean):void; + zoneTagMode: string; + activeZoneInstance: ZoneInstance; + zones: Array<Zone>; + zoneMinimizeToggle(zoneType: ZoneInstanceType): void; + zoneInstanceTagged(taggedInstance: ZoneInstance): void; + zoneInstanceModeChanged(newMode: ZoneInstanceMode, instance: ZoneInstance, zoneId: ZoneInstanceType); + unsetActiveZoneInstance(): void; + clickOutsideZoneInstance(): void; + zoneAssignmentSaveStart(): void; + zoneAssignmentSaveComplete(success: boolean): void; // Link menu - create link menu - relationMenuDirectiveObj:ConnectRelationModel; - isLinkMenuOpen:boolean; - createLinkFromMenu:(chosenMatch:Match, vl:Component)=>void; - saveChangedCapabilityProperties:()=>Promise<PropertyBEModel[]>; + relationMenuDirectiveObj: ConnectRelationModel; + isLinkMenuOpen: boolean; + createLinkFromMenu: (chosenMatch: Match, vl: Component) => void; + saveChangedCapabilityProperties: () => Promise<PropertyBEModel[]>; //modify link menu - for now only delete menu - relationMenuTimeout:ng.IPromise<any>; - linkMenuObject:LinkMenu; - isOnDrag:boolean; + relationMenuTimeout: ng.IPromise<any>; + linkMenuObject: LinkMenu; + isOnDrag: boolean; //left palette functions callbacks - dropCallback(event:JQueryEventObject, ui:any):void; - beforeDropCallback(event:IDragDropEvent):void; - verifyDrop(event:JQueryEventObject, ui:any):void; + dropCallback(event: JQueryEventObject, ui: any): void; + beforeDropCallback(event: IDragDropEvent): void; + verifyDrop(event: JQueryEventObject, ui: any): void; //Links menus - viewRelation(link:Cy.CollectionEdges):void; - deleteRelation(link:Cy.CollectionEdges):void; + viewRelation(link: Cy.CollectionEdges): void; + deleteRelation(link: Cy.CollectionEdges): void; hideRelationMenu(); //search,zoom in/out/all - componentInstanceNames:Array<string>; //id, name - zoom(zoomIn:boolean):void; - zoomAllWithoutSidebar():void; - getAutoCompleteValues(searchTerm:string):void; - highlightSearchMatches(searchTerm:string):void; - - canvasMenuProps:any; - - createOrUpdateServicePath(data:any):void; - deletePathsOnCy():void; - drawPathOnCy(data:ForwardingPath):void; - selectedPathId:string; - - /*//asset popover menu - assetPopoverObj:AssetPopoverObj; - assetPopoverOpen:boolean; - hideAssetPopover():void; - deleteNode(nodeId:string):void;*/ + componentInstanceNames: Array<string>; //id, name + zoom(zoomIn: boolean): void; + zoomAllWithoutSidebar(): void; + getAutoCompleteValues(searchTerm: string): void; + highlightSearchMatches(searchTerm: string): void; + + canvasMenuProps: any; + + createOrUpdateServicePath(data: any): void; + deletePathsOnCy(): void; + drawPathOnCy(data: ForwardingPath): void; + selectedPathId: string; } export class CompositionGraph implements ng.IDirective { - private _cy:Cy.Instance; - private _currentlyCLickedNodePosition:Cy.Position; - // private $document:JQuery = $(document); - private dragElement:JQuery; - private dragComponent:ComponentInstance; - - constructor(private $q:ng.IQService, - private $log:ng.ILogService, - private $timeout:ng.ITimeoutService, - private NodesFactory:NodesFactory, - private CompositionGraphLinkUtils:CompositionGraphLinkUtils, - private GeneralGraphUtils:CompositionGraphGeneralUtils, - private ComponentInstanceFactory:ComponentInstanceFactory, - private NodesGraphUtils:CompositionGraphNodesUtils, - private eventListenerService:EventListenerService, - private ComponentFactory:ComponentFactory, - private LoaderService:LoaderService, - private commonGraphUtils:CommonGraphUtils, - private matchCapabilitiesRequirementsUtils:MatchCapabilitiesRequirementsUtils, - private CompositionGraphPaletteUtils:CompositionGraphPaletteUtils, - private compositionGraphZoneUtils:CompositionGraphZoneUtils, - private ComponentServiceNg2:ComponentServiceNg2, - private ModalServiceNg2:ModalService, - private ConnectionWizardServiceNg2:ConnectionWizardService, - private ComponentInstanceServiceNg2:ComponentInstanceServiceNg2, - private servicePathGraphUtils:ServicePathGraphUtils) { + private _cy: Cy.Instance; + private _currentlyCLickedNodePosition: Cy.Position; + private dragElement: JQuery; + private dragComponent: ComponentInstance; + + constructor(private $q: ng.IQService, + private $log: ng.ILogService, + private $timeout: ng.ITimeoutService, + private NodesFactory: NodesFactory, + private CompositionGraphLinkUtils: CompositionGraphLinkUtils, + private GeneralGraphUtils: CompositionGraphGeneralUtils, + private ComponentInstanceFactory: ComponentInstanceFactory, + private NodesGraphUtils: CompositionGraphNodesUtils, + private eventListenerService: EventListenerService, + private ComponentFactory: ComponentFactory, + private LoaderService: LoaderService, + private commonGraphUtils: CommonGraphUtils, + private matchCapabilitiesRequirementsUtils: MatchCapabilitiesRequirementsUtils, + private CompositionGraphPaletteUtils: CompositionGraphPaletteUtils, + private compositionGraphZoneUtils: CompositionGraphZoneUtils, + private ComponentServiceNg2: ComponentServiceNg2, + private ModalServiceNg2: ModalService, + private ConnectionWizardServiceNg2: ConnectionWizardService, + private ComponentInstanceServiceNg2: ComponentInstanceServiceNg2, + private servicePathGraphUtils: ServicePathGraphUtils) { } @@ -173,7 +166,7 @@ export class CompositionGraph implements ng.IDirective { withSidebar: '=' }; - link = (scope:ICompositionGraphScope, el:JQuery) => { + link = (scope: ICompositionGraphScope, el: JQuery) => { this.loadGraph(scope, el); if (!scope.component.groupInstances || !scope.component.policies) { @@ -184,7 +177,7 @@ export class CompositionGraph implements ng.IDirective { this.loadGraphData(scope); } - + scope.$on('$destroy', () => { this._cy.destroy(); _.forEach(GRAPH_EVENTS, (event) => { @@ -196,7 +189,7 @@ export class CompositionGraph implements ng.IDirective { }; - private loadGraphData = (scope:ICompositionGraphScope) => { + private loadGraphData = (scope: ICompositionGraphScope) => { this.initGraphNodes(scope.component.componentInstances, scope.isViewOnly); this.commonGraphUtils.initGraphLinks(this._cy, scope.component.componentInstancesRelations, scope.component.getRelationRequirementCapability.bind(scope.component)); this.commonGraphUtils.initUcpeChildren(this._cy); @@ -206,7 +199,7 @@ export class CompositionGraph implements ng.IDirective { }); } - private loadGraph = (scope:ICompositionGraphScope, el:JQuery) => { + private loadGraph = (scope: ICompositionGraphScope, el: JQuery) => { let graphEl = el.find('.sdc-composition-graph-wrapper'); this.initGraph(graphEl, scope.isViewOnly); this.initDropZone(scope); @@ -216,7 +209,7 @@ export class CompositionGraph implements ng.IDirective { this.initViewMode(scope.isViewOnly); }; - private initGraph(graphEl:JQuery, isViewOnly:boolean) { + private initGraph(graphEl: JQuery, isViewOnly: boolean) { this._cy = cytoscape({ container: graphEl, @@ -233,7 +226,7 @@ export class CompositionGraph implements ng.IDirective { }); } - private initViewMode(isViewOnly:boolean) { + private initViewMode(isViewOnly: boolean) { if (isViewOnly) { //remove event listeners @@ -246,9 +239,9 @@ export class CompositionGraph implements ng.IDirective { } }; - private registerCustomEvents(scope:ICompositionGraphScope, el:JQuery) { + private registerCustomEvents(scope: ICompositionGraphScope, el: JQuery) { - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_GROUP_INSTANCE_UPDATE, (groupInstance:GroupInstance) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_GROUP_INSTANCE_UPDATE, (groupInstance: GroupInstance) => { this.compositionGraphZoneUtils.findAndUpdateZoneInstanceData(scope.zones, groupInstance); this.GeneralGraphUtils.showGroupUpdateSuccess(); }); @@ -258,7 +251,7 @@ export class CompositionGraph implements ng.IDirective { this.GeneralGraphUtils.showPolicyUpdateSuccess(); }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_PALETTE_COMPONENT_HOVER_IN, (leftPaletteComponent:LeftPaletteComponent) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_PALETTE_COMPONENT_HOVER_IN, (leftPaletteComponent: LeftPaletteComponent) => { if (scope.isOnDrag) { return; } @@ -280,7 +273,7 @@ export class CompositionGraph implements ng.IDirective { //----------------------- ORIT TO FIX------------------------// - this.ComponentServiceNg2.getCapabilitiesAndRequirements(leftPaletteComponent.componentType, leftPaletteComponent.uniqueId).subscribe((response:ComponentGenericResponse) => { + this.ComponentServiceNg2.getCapabilitiesAndRequirements(leftPaletteComponent.componentType, leftPaletteComponent.uniqueId).subscribe((response: ComponentGenericResponse) => { let component = this.ComponentFactory.createEmptyComponent(leftPaletteComponent.componentType); component.uniqueId = component.uniqueId; @@ -290,17 +283,17 @@ export class CompositionGraph implements ng.IDirective { }); }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_ADD_ZONE_INSTANCE_FROM_PALETTE, (component:Component, paletteComponent:LeftPaletteComponent, startPosition:Point) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_ADD_ZONE_INSTANCE_FROM_PALETTE, (component: Component, paletteComponent: LeftPaletteComponent, startPosition: Point) => { - let zoneType:ZoneInstanceType = this.compositionGraphZoneUtils.getZoneTypeForPaletteComponent(paletteComponent.categoryType); + let zoneType: ZoneInstanceType = this.compositionGraphZoneUtils.getZoneTypeForPaletteComponent(paletteComponent.categoryType); this.compositionGraphZoneUtils.showZone(scope.zones[zoneType]); this.LoaderService.showLoader('composition-graph'); - this.compositionGraphZoneUtils.createZoneInstanceFromLeftPalette(zoneType, component, paletteComponent.type).subscribe((zoneInstance:ZoneInstance) => { + this.compositionGraphZoneUtils.createZoneInstanceFromLeftPalette(zoneType, component, paletteComponent.type).subscribe((zoneInstance: ZoneInstance) => { this.LoaderService.hideLoader('composition-graph'); this.compositionGraphZoneUtils.addInstanceToZone(scope.zones[zoneInstance.type], zoneInstance, true); this.compositionGraphZoneUtils.createPaletteToZoneAnimation(startPosition, zoneType, zoneInstance); - }, (error)=> { + }, (error) => { this.LoaderService.hideLoader('composition-graph'); }); }); @@ -317,12 +310,12 @@ export class CompositionGraph implements ng.IDirective { this.dragComponent = this.ComponentInstanceFactory.createComponentInstanceFromComponent(dragComponent); }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_PALETTE_COMPONENT_DRAG_ACTION, (event:IDragDropEvent) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_PALETTE_COMPONENT_DRAG_ACTION, (event: IDragDropEvent) => { this.CompositionGraphPaletteUtils.onComponentDrag(this._cy, event, this.dragElement, this.dragComponent); }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_NAME_CHANGED, (component:ComponentInstance) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_COMPONENT_INSTANCE_NAME_CHANGED, (component: ComponentInstance) => { let selectedNode = this._cy.getElementById(component.uniqueId); selectedNode.data().componentInstance.name = component.name; @@ -331,14 +324,14 @@ export class CompositionGraph implements ng.IDirective { }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE, (componentInstance:ComponentInstance) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE, (componentInstance: ComponentInstance) => { let nodeToDelete = this._cy.getElementById(componentInstance.uniqueId); this.NodesGraphUtils.deleteNode(this._cy, scope.component, nodeToDelete); }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_ZONE_INSTANCE, (deletedInstance:UIZoneInstanceObject) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_ZONE_INSTANCE, (deletedInstance: UIZoneInstanceObject) => { - if(deletedInstance.type === ZoneInstanceType.POLICY){ + if (deletedInstance.type === ZoneInstanceType.POLICY) { scope.component.policies = scope.component.policies.filter(policy => policy.uniqueId !== deletedInstance.uniqueId); } else if (deletedInstance.type === ZoneInstanceType.GROUP) { scope.component.groupInstances = scope.component.groupInstances.filter(group => group.uniqueId !== deletedInstance.uniqueId); @@ -351,25 +344,17 @@ export class CompositionGraph implements ng.IDirective { this.eventListenerService.notifyObservers(EVENTS.UPDATE_PANEL); }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE_SUCCESS, (componentInstanceId:string)=> { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_COMPONENT_INSTANCE_SUCCESS, (componentInstanceId: string) => { if (!_.isEmpty(scope.zones)) { this.compositionGraphZoneUtils.updateTargetsOrMembersOnCanvasDelete(componentInstanceId, scope.zones, ZoneInstanceAssignmentType.COMPONENT_INSTANCES); } }); - // not in use; commenting out - // this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_MULTIPLE_COMPONENTS, () => { - - // this._cy.$('node:selected').each((i:number, node:Cy.CollectionNodes) => { - // this.NodesGraphUtils.deleteNode(this._cy, scope.component, node); - // }); - // }); - - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_EDGE, (releaseLoading:boolean, linksToDelete:Cy.CollectionEdges) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_DELETE_EDGE, (releaseLoading: boolean, linksToDelete: Cy.CollectionEdges) => { this.CompositionGraphLinkUtils.deleteLink(this._cy, scope.component, releaseLoading, linksToDelete); }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_INSERT_NODE_TO_UCPE, (node:Cy.CollectionNodes, ucpe:Cy.CollectionNodes, updateExistingNode:boolean) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_INSERT_NODE_TO_UCPE, (node: Cy.CollectionNodes, ucpe: Cy.CollectionNodes, updateExistingNode: boolean) => { this.commonGraphUtils.initUcpeChildData(node, ucpe); //check if item is a VL, and if so, skip adding the binding to ucpe @@ -378,29 +363,29 @@ export class CompositionGraph implements ng.IDirective { } if (updateExistingNode) { - let vlsPendingDeletion:Cy.CollectionNodes = this.NodesGraphUtils.deleteNodeVLsUponMoveToOrFromUCPE(scope.component, node.cy(), node); //delete connected VLs that no longer have 2 links + let vlsPendingDeletion: Cy.CollectionNodes = this.NodesGraphUtils.deleteNodeVLsUponMoveToOrFromUCPE(scope.component, node.cy(), node); //delete connected VLs that no longer have 2 links this.CompositionGraphLinkUtils.deleteLinksWhenNodeMovedFromOrToUCPE(scope.component, node.cy(), node, vlsPendingDeletion); //delete all connected links if needed this.GeneralGraphUtils.pushUpdateComponentInstanceActionToQueue(scope.component, true, node.data().componentInstance); //update componentInstance position } }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_REMOVE_NODE_FROM_UCPE, (node:Cy.CollectionNodes, ucpe:Cy.CollectionNodes) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_REMOVE_NODE_FROM_UCPE, (node: Cy.CollectionNodes, ucpe: Cy.CollectionNodes) => { this.commonGraphUtils.removeUcpeChildData(node); - let vlsPendingDeletion:Cy.CollectionNodes = this.NodesGraphUtils.deleteNodeVLsUponMoveToOrFromUCPE(scope.component, node.cy(), node); + let vlsPendingDeletion: Cy.CollectionNodes = this.NodesGraphUtils.deleteNodeVLsUponMoveToOrFromUCPE(scope.component, node.cy(), node); this.CompositionGraphLinkUtils.deleteLinksWhenNodeMovedFromOrToUCPE(scope.component, node.cy(), node, vlsPendingDeletion); //delete all connected links if needed this.GeneralGraphUtils.pushUpdateComponentInstanceActionToQueue(scope.component, true, node.data().componentInstance); //update componentInstance position }); - this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_VERSION_CHANGED, (component:Component) => { + this.eventListenerService.registerObserverCallback(GRAPH_EVENTS.ON_VERSION_CHANGED, (component: Component) => { scope.component = component; this._cy.elements().remove(); this.loadGraphData(scope); }); - scope.zoom = (zoomIn:boolean):void => { - let currentZoom:number = this._cy.zoom(); + scope.zoom = (zoomIn: boolean): void => { + let currentZoom: number = this._cy.zoom(); if (zoomIn) { this.GeneralGraphUtils.zoomGraphTo(this._cy, currentZoom + .1); } else { @@ -416,24 +401,24 @@ export class CompositionGraph implements ng.IDirective { }); }; - scope.getAutoCompleteValues = (searchTerm:string) => { + scope.getAutoCompleteValues = (searchTerm: string) => { if (searchTerm.length > 1) { //US requirement: only display search results after 2nd letter typed. - let nodes:Cy.CollectionNodes = this.NodesGraphUtils.getMatchingNodesByName(this._cy, searchTerm); + let nodes: Cy.CollectionNodes = this.NodesGraphUtils.getMatchingNodesByName(this._cy, searchTerm); scope.componentInstanceNames = _.map(nodes, node => node.data('name')); } else { scope.componentInstanceNames = []; } }; - scope.highlightSearchMatches = (searchTerm:string) => { + scope.highlightSearchMatches = (searchTerm: string) => { this.NodesGraphUtils.highlightMatchingNodesByName(this._cy, searchTerm); - let matchingNodes:Cy.CollectionNodes = this.NodesGraphUtils.getMatchingNodesByName(this._cy, searchTerm); + let matchingNodes: Cy.CollectionNodes = this.NodesGraphUtils.getMatchingNodesByName(this._cy, searchTerm); this.GeneralGraphUtils.zoomAll(this._cy, matchingNodes); }; - scope.saveChangedCapabilityProperties = ():Promise<PropertyBEModel[]> => { + scope.saveChangedCapabilityProperties = (): Promise<PropertyBEModel[]> => { return new Promise<PropertyBEModel[]>((resolve) => { - const capabilityPropertiesBE:PropertyBEModel[] = this.ConnectionWizardServiceNg2.changedCapabilityProperties.map((prop) => { + const capabilityPropertiesBE: PropertyBEModel[] = this.ConnectionWizardServiceNg2.changedCapabilityProperties.map((prop) => { prop.value = prop.getJSONValue(); const propBE = new PropertyBEModel(prop); propBE.parentUniqueId = this.ConnectionWizardServiceNg2.selectedMatch.relationship.relation.capabilityOwnerId; @@ -460,7 +445,7 @@ export class CompositionGraph implements ng.IDirective { }); }; - scope.createLinkFromMenu = ():void => { + scope.createLinkFromMenu = (): void => { scope.isLinkMenuOpen = false; scope.saveChangedCapabilityProperties().then(() => { @@ -477,23 +462,23 @@ export class CompositionGraph implements ng.IDirective { }); }; - scope.createOrUpdateServicePath = (data:any) => { + scope.createOrUpdateServicePath = (data: any) => { this.servicePathGraphUtils.createOrUpdateServicePath(scope, data); }; scope.deletePathsOnCy = () => { - this.servicePathGraphUtils.deletePathsFromGraph(this._cy, <Service> scope.component); + this.servicePathGraphUtils.deletePathsFromGraph(this._cy, <Service>scope.component); }; - scope.drawPathOnCy = (data:ForwardingPath) => { - this.servicePathGraphUtils.drawPath(this._cy, data, <Service> scope.component); + scope.drawPathOnCy = (data: ForwardingPath) => { + this.servicePathGraphUtils.drawPath(this._cy, data, <Service>scope.component); }; - scope.viewRelation = (link:Cy.CollectionEdges) => { + scope.viewRelation = (link: Cy.CollectionEdges) => { scope.hideRelationMenu(); const linkData = link.data(); - const sourceNode:CompositionCiNodeBase = link.source().data(); - const targetNode:CompositionCiNodeBase = link.target().data(); - const relationship:Relationship = linkData.relation.relationships[0]; + const sourceNode: CompositionCiNodeBase = link.source().data(); + const targetNode: CompositionCiNodeBase = link.target().data(); + const relationship: Relationship = linkData.relation.relationships[0]; scope.component.getRelationRequirementCapability(relationship, sourceNode.componentInstance, targetNode.componentInstance).then((objReqCap) => { const capability = objReqCap.capability; @@ -505,12 +490,12 @@ export class CompositionGraph implements ng.IDirective { this.ConnectionWizardServiceNg2.selectedMatch.relationship = relationship; const title = `Connection Properties`; - const saveButton:ButtonModel = new ButtonModel('Save', 'blue', () => { + const saveButton: ButtonModel = new ButtonModel('Save', 'blue', () => { scope.saveChangedCapabilityProperties().then(() => { this.ModalServiceNg2.closeCurrentModal(); }) }); - const cancelButton:ButtonModel = new ButtonModel('Cancel', 'white', () => { + const cancelButton: ButtonModel = new ButtonModel('Cancel', 'white', () => { this.ModalServiceNg2.closeCurrentModal(); }); const modal = new ModalModel('xl', title, '', [saveButton, cancelButton]); @@ -536,7 +521,7 @@ export class CompositionGraph implements ng.IDirective { }); }; - scope.deleteRelation = (link:Cy.CollectionEdges) => { + scope.deleteRelation = (link: Cy.CollectionEdges) => { scope.hideRelationMenu(); //if multiple edges selected, delete the VL itself so edges get deleted automatically @@ -546,25 +531,9 @@ export class CompositionGraph implements ng.IDirective { this.CompositionGraphLinkUtils.deleteLink(this._cy, scope.component, true, link); } }; - - /* - scope.hideAssetPopover = ():void => { - - this.commonGraphUtils.safeApply(scope, () => { - scope.assetPopoverOpen = false; - scope.assetPopoverObj = null; - }); - }; - - scope.deleteNode = (nodeId:string):void => { - if (!scope.isViewOnly) { - this.NodesGraphUtils.confirmDeleteNode(nodeId, this._cy, scope.component); - //scope.hideAssetPopover(); - } - };*/ } - private registerCytoscapeGraphEvents(scope:ICompositionGraphScope) { + private registerCytoscapeGraphEvents(scope: ICompositionGraphScope) { this._cy.on('addedgemouseup', (event, data) => { scope.relationMenuDirectiveObj = this.CompositionGraphLinkUtils.onLinkDrawn(this._cy, data.source, data.target); @@ -574,48 +543,41 @@ export class CompositionGraph implements ng.IDirective { //TODO: init with the selected values this.ConnectionWizardServiceNg2.selectedMatch = null; - let steps:Array<StepModel> = []; - let fromNodeName:string = scope.relationMenuDirectiveObj.fromNode.componentInstance.name; - let toNodeName:string = scope.relationMenuDirectiveObj.toNode.componentInstance.name; + let steps: Array<StepModel> = []; + let fromNodeName: string = scope.relationMenuDirectiveObj.fromNode.componentInstance.name; + let toNodeName: string = scope.relationMenuDirectiveObj.toNode.componentInstance.name; steps.push(new StepModel(fromNodeName, FromNodeStepComponent)); steps.push(new StepModel(toNodeName, ToNodeStepComponent)); steps.push(new StepModel('Properties', PropertiesStepComponent)); let wizardTitle = 'Connect: ' + fromNodeName + ' to ' + toNodeName; let modalInstance = this.ModalServiceNg2.createMultiStepsWizard(wizardTitle, steps, scope.createLinkFromMenu, ConnectionWizardHeaderComponent); modalInstance.instance.open(); - - // - // this.ModalServiceNg2.createMultiStepsWizard('Connect', )Connect - // scope.$apply(() => { - // scope.isLinkMenuOpen = true; - // }); } }); - this._cy.on('tapstart', 'node', (event:Cy.EventObject) => { + this._cy.on('tapstart', 'node', (event: Cy.EventObject) => { scope.isOnDrag = true; this._currentlyCLickedNodePosition = angular.copy(event.cyTarget[0].position()); //update node position on drag if (event.cyTarget.data().isUcpe) { this._cy.nodes('.ucpe-cp').unlock(); event.cyTarget.style('opacity', 0.5); } - //scope.hideAssetPopover(); }); - this._cy.on('drag', 'node', (event:Cy.EventObject) => { + this._cy.on('drag', 'node', (event: Cy.EventObject) => { if (event.cyTarget.data().isDraggable) { - event.cyTarget.style({'overlay-opacity': 0.24}); + event.cyTarget.style({ 'overlay-opacity': 0.24 }); if (this.GeneralGraphUtils.isValidDrop(this._cy, event.cyTarget)) { - event.cyTarget.style({'overlay-color': GraphColors.NODE_BACKGROUND_COLOR}); + event.cyTarget.style({ 'overlay-color': GraphColors.NODE_BACKGROUND_COLOR }); } else { - event.cyTarget.style({'overlay-color': GraphColors.NODE_OVERLAPPING_BACKGROUND_COLOR}); + event.cyTarget.style({ 'overlay-color': GraphColors.NODE_OVERLAPPING_BACKGROUND_COLOR }); } } if (event.cyTarget.data().isUcpe) { let pos = event.cyTarget.position(); - this._cy.nodes('[?isInsideGroup]').positions((i, node)=> { + this._cy.nodes('[?isInsideGroup]').positions((i, node) => { return { x: pos.x + node.data("ucpeOffset").x, y: pos.y + node.data("ucpeOffset").y @@ -624,19 +586,6 @@ export class CompositionGraph implements ng.IDirective { } }); - /* this._cy.on('mouseover', 'node', (event:Cy.EventObject) => { - if (!this._cy.scratch('_edge_editation_highlights')) { - this.commonGraphUtils.safeApply(scope, () => { - this.showNodePopoverMenu(scope, event.cyTarget[0]); - }); - } - }); - - this._cy.on('mouseout', 'node', (event:Cy.EventObject) => { - scope.hideAssetPopover(); - });*/ - - this._cy.on('handlemouseover', (event, payload) => { if (payload.node.grabbed() || this._cy.scratch('_edge_editation_highlights') === true) { //no need to add opacity while we are dragging and hovering othe nodes- or if opacity was already calculated for these nodes @@ -644,7 +593,7 @@ export class CompositionGraph implements ng.IDirective { } if (scope.zoneTagMode) { - scope.zoneTagMode = scope.zones[scope.activeZoneInstance.type].getHoverTagModeId(); + scope.zoneTagMode = scope.zones[scope.activeZoneInstance.type].getHoverTagModeId(); return; } @@ -657,7 +606,6 @@ export class CompositionGraph implements ng.IDirective { this.matchCapabilitiesRequirementsUtils.fadeNonMachingComponents(filteredNodesData, nodesData, this._cy, payload.node.data()); this._cy.scratch()._edge_editation_highlights = true; - /*scope.hideAssetPopover();*/ }); this._cy.on('handlemouseout', () => { @@ -673,7 +621,7 @@ export class CompositionGraph implements ng.IDirective { }); - this._cy.on('tapend', (event:Cy.EventObject) => { + this._cy.on('tapend', (event: Cy.EventObject) => { scope.isOnDrag = false; if (scope.zoneTagMode) { return; @@ -698,13 +646,13 @@ export class CompositionGraph implements ng.IDirective { else { //On Node clicked - this._cy.nodes(':grabbed').style({'overlay-opacity': 0}); + this._cy.nodes(':grabbed').style({ 'overlay-opacity': 0 }); - let isUcpe:boolean = event.cyTarget.data().isUcpe; + let isUcpe: boolean = event.cyTarget.data().isUcpe; let newPosition = event.cyTarget[0].position(); //node position changed (drop after drag event) - we need to update position if (this._currentlyCLickedNodePosition.x !== newPosition.x || this._currentlyCLickedNodePosition.y !== newPosition.y) { - let nodesMoved:Cy.CollectionNodes = this._cy.$(':grabbed'); + let nodesMoved: Cy.CollectionNodes = this._cy.$(':grabbed'); if (isUcpe) { nodesMoved = nodesMoved.add(this._cy.nodes('[?isInsideGroup]:free')); //'child' nodes will not be recognized as "grabbed" elements within cytoscape. manually add them to collection of nodes moved. } @@ -716,8 +664,6 @@ export class CompositionGraph implements ng.IDirective { } scope.$apply(() => { this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_NODE_SELECTED, event.cyTarget.data().componentInstance); - //open node popover menu - //this.showNodePopoverMenu(scope, event.cyTarget[0]); }); } @@ -729,25 +675,25 @@ export class CompositionGraph implements ng.IDirective { } }); - this._cy.on('boxselect', 'node', (event:Cy.EventObject) => { + this._cy.on('boxselect', 'node', (event: Cy.EventObject) => { scope.unsetActiveZoneInstance(); this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_NODE_SELECTED, event.cyTarget.data().componentInstance); }); - this._cy.on('canvasredraw', (event:Cy.EventObject) => { + this._cy.on('canvasredraw', (event: Cy.EventObject) => { if (scope.zoneTagMode) { this.compositionGraphZoneUtils.showZoneTagIndications(this._cy, scope.activeZoneInstance); } }); - this._cy.on('handletagclick', (event:Cy.EventObject, eventData:any) => { + this._cy.on('handletagclick', (event: Cy.EventObject, eventData: any) => { this.compositionGraphZoneUtils.handleTagClick(this._cy, scope.activeZoneInstance, eventData.nodeId); }); } - private openModifyLinkMenu = (scope:ICompositionGraphScope, linkMenuObject:LinkMenu, timeOutInMilliseconds?:number) => { + private openModifyLinkMenu = (scope: ICompositionGraphScope, linkMenuObject: LinkMenu, timeOutInMilliseconds?: number) => { scope.hideRelationMenu(); this.$timeout(() => { scope.canvasMenuProps = { @@ -769,7 +715,7 @@ export class CompositionGraph implements ng.IDirective { } }); } - if(!scope.isViewOnly){ + if (!scope.isViewOnly) { scope.canvasMenuProps.items.push({ contents: 'Delete', styleClass: 'w-sdc-canvas-menu-item-delete', @@ -784,10 +730,10 @@ export class CompositionGraph implements ng.IDirective { }); }; - private initGraphNodes(componentInstances:ComponentInstance[], isViewOnly:boolean) { + private initGraphNodes(componentInstances: ComponentInstance[], isViewOnly: boolean) { - setTimeout(()=> { + setTimeout(() => { let handles = new CytoscapeEdgeEditation; handles.init(this._cy); if (!isViewOnly) { //Init nodes handle extension - enable dynamic links @@ -801,23 +747,23 @@ export class CompositionGraph implements ng.IDirective { _.each(componentInstances, (instance) => { - let compositionGraphNode:CompositionCiNodeBase = this.NodesFactory.createNode(instance); + let compositionGraphNode: CompositionCiNodeBase = this.NodesFactory.createNode(instance); this.commonGraphUtils.addComponentInstanceNodeToGraph(this._cy, compositionGraphNode); }); } - private initDropZone(scope:ICompositionGraphScope) { + private initDropZone(scope: ICompositionGraphScope) { if (scope.isViewOnly) { return; } - scope.dropCallback = (event:IDragDropEvent) => { + scope.dropCallback = (event: IDragDropEvent) => { this.$log.debug(`composition-graph::dropCallback:: fired`); this.CompositionGraphPaletteUtils.addNodeFromPalette(this._cy, event, scope.component); }; - scope.verifyDrop = (event:JQueryEventObject) => { + scope.verifyDrop = (event: JQueryEventObject) => { if (!this.dragElement || this.dragElement.hasClass('red')) { return false; @@ -825,8 +771,8 @@ export class CompositionGraph implements ng.IDirective { return true; }; - scope.beforeDropCallback = (event:IDragDropEvent):ng.IPromise<void> => { - let deferred:ng.IDeferred<void> = this.$q.defer<void>(); + scope.beforeDropCallback = (event: IDragDropEvent): ng.IPromise<void> => { + let deferred: ng.IDeferred<void> = this.$q.defer<void>(); if (this.dragElement.hasClass('red')) { deferred.reject(); } else { @@ -838,22 +784,22 @@ export class CompositionGraph implements ng.IDirective { } - private initZones = (scope:ICompositionGraphScope):void => { + private initZones = (scope: ICompositionGraphScope): void => { scope.zones = this.compositionGraphZoneUtils.createCompositionZones(); - scope.zoneMinimizeToggle = (zoneType:ZoneInstanceType):void => { + scope.zoneMinimizeToggle = (zoneType: ZoneInstanceType): void => { scope.zones[zoneType].minimized = !scope.zones[zoneType].minimized; }; - scope.zoneInstanceModeChanged = (newMode:ZoneInstanceMode, instance:ZoneInstance, zoneId:ZoneInstanceType):void => { + scope.zoneInstanceModeChanged = (newMode: ZoneInstanceMode, instance: ZoneInstance, zoneId: ZoneInstanceType): void => { if (scope.zoneTagMode) { //we're in tag mode. if (instance == scope.activeZoneInstance && newMode == ZoneInstanceMode.NONE) { //we want to turn tag mode off. scope.zoneTagMode = null; scope.activeZoneInstance.mode = ZoneInstanceMode.SELECTED; this.compositionGraphZoneUtils.endCyTagMode(this._cy); this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_CANVAS_TAG_END, instance); - + } } else { if (instance != scope.activeZoneInstance || (instance == scope.activeZoneInstance && newMode > ZoneInstanceMode.HOVER)) { //when active zone instance gets hover/none,dont actually change mode, just show/hide indications @@ -888,13 +834,13 @@ export class CompositionGraph implements ng.IDirective { } }; - scope.zoneInstanceTagged = (taggedInstance:ZoneInstance) => { + scope.zoneInstanceTagged = (taggedInstance: ZoneInstance) => { scope.activeZoneInstance.addOrRemoveAssignment(taggedInstance.instanceData.uniqueId, ZoneInstanceAssignmentType.GROUPS); - let newHandle:string = this.compositionGraphZoneUtils.getCorrectHandleForNode(taggedInstance.instanceData.uniqueId, scope.activeZoneInstance); + let newHandle: string = this.compositionGraphZoneUtils.getCorrectHandleForNode(taggedInstance.instanceData.uniqueId, scope.activeZoneInstance); taggedInstance.showHandle(newHandle); } - scope.zoneBackgroundClicked = ():void => { + scope.zoneBackgroundClicked = (): void => { if (!scope.zoneTagMode && scope.activeZoneInstance) { scope.unsetActiveZoneInstance(); } @@ -904,15 +850,15 @@ export class CompositionGraph implements ng.IDirective { this.LoaderService.showLoader('composition-graph'); } - scope.zoneAssignmentSaveComplete = (success:boolean) => { + scope.zoneAssignmentSaveComplete = (success: boolean) => { this.LoaderService.hideLoader('composition-graph'); if (!success) { this.GeneralGraphUtils.showUpdateFailure(); } }; - scope.unsetActiveZoneInstance = ():void => { - if(scope.activeZoneInstance){ + scope.unsetActiveZoneInstance = (): void => { + if (scope.activeZoneInstance) { scope.activeZoneInstance.mode = ZoneInstanceMode.NONE; scope.activeZoneInstance = null; scope.zoneTagMode = null; @@ -923,25 +869,25 @@ export class CompositionGraph implements ng.IDirective { public static factory = ($q, - $log, - $timeout, - NodesFactory, - LinksGraphUtils, - GeneralGraphUtils, - ComponentInstanceFactory, - NodesGraphUtils, - EventListenerService, - ComponentFactory, - LoaderService, - CommonGraphUtils, - MatchCapabilitiesRequirementsUtils, - CompositionGraphPaletteUtils, - CompositionGraphZoneUtils, - ComponentServiceNg2, - ModalService, - ConnectionWizardService, - ComponentInstanceServiceNg2, - ServicePathGraphUtils) => { + $log, + $timeout, + NodesFactory, + LinksGraphUtils, + GeneralGraphUtils, + ComponentInstanceFactory, + NodesGraphUtils, + EventListenerService, + ComponentFactory, + LoaderService, + CommonGraphUtils, + MatchCapabilitiesRequirementsUtils, + CompositionGraphPaletteUtils, + CompositionGraphZoneUtils, + ComponentServiceNg2, + ModalService, + ConnectionWizardService, + ComponentInstanceServiceNg2, + ServicePathGraphUtils) => { return new CompositionGraph( $q, $log, diff --git a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-palette-utils.ts b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-palette-utils.ts index 438673e427..10d0d42922 100644 --- a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-palette-utils.ts +++ b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-palette-utils.ts @@ -18,24 +18,24 @@ * ============LICENSE_END========================================================= */ -import {EventListenerService, LoaderService} from "app/services"; -import {CapabilitiesGroup, NodesFactory, ComponentInstance, Component, CompositionCiNodeBase, RequirementsGroup} from "app/models"; -import {ComponentFactory, ComponentInstanceFactory, GRAPH_EVENTS, GraphUIObjects} from "app/utils"; -import {CompositionGraphGeneralUtils} from "./composition-graph-general-utils"; -import {CommonGraphUtils} from "../../common/common-graph-utils"; +import { EventListenerService, LoaderService } from "app/services"; +import { CapabilitiesGroup, NodesFactory, ComponentInstance, Component, CompositionCiNodeBase, RequirementsGroup } from "app/models"; +import { ComponentFactory, ComponentInstanceFactory, GRAPH_EVENTS, GraphUIObjects } from "app/utils"; +import { CompositionGraphGeneralUtils } from "./composition-graph-general-utils"; +import { CommonGraphUtils } from "../../common/common-graph-utils"; import 'sdc-angular-dragdrop'; -import {LeftPaletteComponent} from "../../../../models/components/displayComponent"; +import { LeftPaletteComponent } from "../../../../models/components/displayComponent"; export class CompositionGraphPaletteUtils { - constructor(private ComponentFactory:ComponentFactory, - private $filter:ng.IFilterService, - private loaderService:LoaderService, - private generalGraphUtils:CompositionGraphGeneralUtils, - private componentInstanceFactory:ComponentInstanceFactory, - private nodesFactory:NodesFactory, - private commonGraphUtils:CommonGraphUtils, - private eventListenerService:EventListenerService) { + constructor(private ComponentFactory: ComponentFactory, + private $filter: ng.IFilterService, + private loaderService: LoaderService, + private generalGraphUtils: CompositionGraphGeneralUtils, + private componentInstanceFactory: ComponentInstanceFactory, + private nodesFactory: NodesFactory, + private commonGraphUtils: CommonGraphUtils, + private eventListenerService: EventListenerService) { } /** @@ -46,13 +46,13 @@ export class CompositionGraphPaletteUtils { * @returns {Cy.BoundingBox} * @private */ - private _getNodeBBox(cy:Cy.Instance, event:IDragDropEvent, position?:Cy.Position) { + private _getNodeBBox(cy: Cy.Instance, event: IDragDropEvent, position?: Cy.Position) { let bbox = <Cy.BoundingBox>{}; if (!position) { position = this.commonGraphUtils.getCytoscapeNodePosition(cy, event); } - let cushionWidth:number = 40; - let cushionHeight:number = 40; + let cushionWidth: number = 40; + let cushionHeight: number = 40; bbox.x1 = position.x - cushionWidth / 2; bbox.y1 = position.y - cushionHeight / 2; @@ -68,21 +68,21 @@ export class CompositionGraphPaletteUtils { * @param event * @param component */ - private _createComponentInstanceOnGraphFromPaletteComponent(cy:Cy.Instance, fullComponent:LeftPaletteComponent, event:IDragDropEvent, component:Component) { + private _createComponentInstanceOnGraphFromPaletteComponent(cy: Cy.Instance, fullComponent: LeftPaletteComponent, event: IDragDropEvent, component: Component) { - let componentInstanceToCreate:ComponentInstance = this.componentInstanceFactory.createComponentInstanceFromComponent(fullComponent); - let cytoscapePosition:Cy.Position = this.commonGraphUtils.getCytoscapeNodePosition(cy, event); + let componentInstanceToCreate: ComponentInstance = this.componentInstanceFactory.createComponentInstanceFromComponent(fullComponent); + let cytoscapePosition: Cy.Position = this.commonGraphUtils.getCytoscapeNodePosition(cy, event); componentInstanceToCreate.posX = cytoscapePosition.x; componentInstanceToCreate.posY = cytoscapePosition.y; - let onFailedCreatingInstance:(error:any) => void = (error:any) => { + let onFailedCreatingInstance: (error: any) => void = (error: any) => { this.loaderService.hideLoader('composition-graph'); }; //on success - update node data - let onSuccessCreatingInstance = (createInstance:ComponentInstance):void => { + let onSuccessCreatingInstance = (createInstance: ComponentInstance): void => { this.loaderService.hideLoader('composition-graph'); @@ -93,11 +93,11 @@ export class CompositionGraphPaletteUtils { createInstance.icon = fullComponent.icon; createInstance.setInstanceRC(); - let newNode:CompositionCiNodeBase = this.nodesFactory.createNode(createInstance); - let cyNode:Cy.CollectionNodes = this.commonGraphUtils.addComponentInstanceNodeToGraph(cy, newNode); + let newNode: CompositionCiNodeBase = this.nodesFactory.createNode(createInstance); + let cyNode: Cy.CollectionNodes = this.commonGraphUtils.addComponentInstanceNodeToGraph(cy, newNode); //check if node was dropped into a UCPE - let ucpe:Cy.CollectionElements = this.commonGraphUtils.isInUcpe(cy, cyNode.boundingbox()); + let ucpe: Cy.CollectionElements = this.commonGraphUtils.isInUcpe(cy, cyNode.boundingbox()); if (ucpe.length > 0) { this.eventListenerService.notifyObservers(GRAPH_EVENTS.ON_INSERT_NODE_TO_UCPE, cyNode, ucpe, false); } @@ -120,7 +120,7 @@ export class CompositionGraphPaletteUtils { * @param dragElement * @param dragComponent */ - public onComponentDrag(cy:Cy.Instance, event:IDragDropEvent, dragElement:JQuery, dragComponent:ComponentInstance) { + public onComponentDrag(cy: Cy.Instance, event: IDragDropEvent, dragElement: JQuery, dragComponent: ComponentInstance) { if (event.clientX < GraphUIObjects.DIAGRAM_PALETTE_WIDTH_OFFSET || event.clientY < GraphUIObjects.DIAGRAM_HEADER_OFFSET) { //hovering over palette. Dont bother computing validity of drop dragElement.removeClass('red'); @@ -147,10 +147,10 @@ export class CompositionGraphPaletteUtils { * @param event * @param component */ - public addNodeFromPalette(cy:Cy.Instance, event:IDragDropEvent, component:Component) { + public addNodeFromPalette(cy: Cy.Instance, event: IDragDropEvent, component: Component) { this.loaderService.showLoader('composition-graph'); - let draggedComponent:LeftPaletteComponent = event.dataTransfer.component; + let draggedComponent: LeftPaletteComponent = event.dataTransfer.component; if (this.generalGraphUtils.componentRequirementsAndCapabilitiesCaching.containsKey(draggedComponent.uniqueId)) { let fullComponent = this.generalGraphUtils.componentRequirementsAndCapabilitiesCaching.getValue(draggedComponent.uniqueId); @@ -161,7 +161,7 @@ export class CompositionGraphPaletteUtils { } else { this.ComponentFactory.getComponentFromServer(draggedComponent.getComponentSubType(), draggedComponent.uniqueId) - .then((fullComponent:Component) => { + .then((fullComponent: Component) => { draggedComponent.capabilities = fullComponent.capabilities; draggedComponent.requirements = fullComponent.requirements; this._createComponentInstanceOnGraphFromPaletteComponent(cy, draggedComponent, event, component); diff --git a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-service-path-utils.ts b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-service-path-utils.ts index 1a348912fc..48befef22d 100644 --- a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-service-path-utils.ts +++ b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-service-path-utils.ts @@ -19,34 +19,34 @@ */ import * as _ from "lodash"; -import {LoaderService} from "app/services"; -import {CompositionGraphGeneralUtils} from "./composition-graph-general-utils"; -import {ICompositionGraphScope} from "../composition-graph.directive"; -import {ServiceServiceNg2} from 'app/ng2/services/component-services/service.service'; -import {Service} from "../../../../models/components/service"; -import {ForwardingPath} from "app/models/forwarding-path"; -import {ForwardingPathLink} from "app/models/forwarding-path-link"; -import {CompositionCiServicePathLink} from "../../../../models/graph/graph-links/composition-graph-links/composition-ci-service-path-link"; -import {CommonGraphUtils} from "app/directives/graphs-v2/common/common-graph-utils"; +import { LoaderService } from "app/services"; +import { CompositionGraphGeneralUtils } from "./composition-graph-general-utils"; +import { ICompositionGraphScope } from "../composition-graph.directive"; +import { ServiceServiceNg2 } from 'app/ng2/services/component-services/service.service'; +import { Service } from "../../../../models/components/service"; +import { ForwardingPath } from "app/models/forwarding-path"; +import { ForwardingPathLink } from "app/models/forwarding-path-link"; +import { CompositionCiServicePathLink } from "../../../../models/graph/graph-links/composition-graph-links/composition-ci-service-path-link"; +import { CommonGraphUtils } from "app/directives/graphs-v2/common/common-graph-utils"; export class ServicePathGraphUtils { constructor( - private loaderService:LoaderService, - private generalGraphUtils:CompositionGraphGeneralUtils, - private serviceService:ServiceServiceNg2, - private commonGraphUtils:CommonGraphUtils - ) {} + private loaderService: LoaderService, + private generalGraphUtils: CompositionGraphGeneralUtils, + private serviceService: ServiceServiceNg2, + private commonGraphUtils: CommonGraphUtils + ) { } - public deletePathsFromGraph(cy: Cy.Instance, service:Service){ - cy.remove(`[type="${CompositionCiServicePathLink.LINK_TYPE}"]`); + public deletePathsFromGraph(cy: Cy.Instance, service: Service) { + cy.remove(`[type="${CompositionCiServicePathLink.LINK_TYPE}"]`); } - - public drawPath(cy: Cy.Instance, forwardingPath: ForwardingPath, service:Service) { + + public drawPath(cy: Cy.Instance, forwardingPath: ForwardingPath, service: Service) { let pathElements = forwardingPath.pathElements.listToscaDataDefinition; _.forEach(pathElements, (link: ForwardingPathLink) => { - let data:CompositionCiServicePathLink = new CompositionCiServicePathLink(link); + let data: CompositionCiServicePathLink = new CompositionCiServicePathLink(link); data.source = _.find( service.componentInstances, instance => instance.name === data.forwardingPathLink.fromNode @@ -61,7 +61,7 @@ export class ServicePathGraphUtils { }); } - public createOrUpdateServicePath = (scope:ICompositionGraphScope, path: any): void => { + public createOrUpdateServicePath = (scope: ICompositionGraphScope, path: any): void => { let service = <Service>scope.component; this.loaderService.showLoader('composition-graph'); diff --git a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-zone-utils.ts b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-zone-utils.ts index bcf0cb7bb9..cf6c7e3bd6 100644 --- a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-zone-utils.ts +++ b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/composition-graph-zone-utils.ts @@ -1,26 +1,26 @@ -import {PolicyInstance} from "app/models/graph/zones/policy-instance"; -import {ZoneInstance, ZoneInstanceType, ZoneInstanceAssignmentType} from "app/models/graph/zones/zone-instance"; -import {Zone} from "app/models/graph/zones/zone"; -import {DynamicComponentService} from "app/ng2/services/dynamic-component.service"; -import {PaletteAnimationComponent} from "app/ng2/components/ui/palette-animation/palette-animation.component"; -import {Point, LeftPaletteMetadataTypes, Component} from "../../../../models"; -import {CanvasHandleTypes} from "app/utils"; -import {PoliciesService} from "../../../../ng2/services/policies.service"; -import {Observable} from "rxjs"; -import {GroupsService} from "../../../../ng2/services/groups.service"; -import {GroupInstance} from "app/models/graph/zones/group-instance"; +import { PolicyInstance } from "app/models/graph/zones/policy-instance"; +import { ZoneInstance, ZoneInstanceType, ZoneInstanceAssignmentType } from "app/models/graph/zones/zone-instance"; +import { Zone } from "app/models/graph/zones/zone"; +import { DynamicComponentService } from "app/ng2/services/dynamic-component.service"; +import { PaletteAnimationComponent } from "app/ng2/components/ui/palette-animation/palette-animation.component"; +import { Point, LeftPaletteMetadataTypes, Component } from "../../../../models"; +import { CanvasHandleTypes } from "app/utils"; +import { PoliciesService } from "../../../../ng2/services/policies.service"; +import { Observable } from "rxjs"; +import { GroupsService } from "../../../../ng2/services/groups.service"; +import { GroupInstance } from "app/models/graph/zones/group-instance"; export class CompositionGraphZoneUtils { - constructor(private dynamicComponentService:DynamicComponentService, - private policiesService:PoliciesService, - private groupsService:GroupsService) { + constructor(private dynamicComponentService: DynamicComponentService, + private policiesService: PoliciesService, + private groupsService: GroupsService) { } - public createCompositionZones = ():Array<Zone> => { - let zones:Array<Zone> = []; + public createCompositionZones = (): Array<Zone> => { + let zones: Array<Zone> = []; zones[ZoneInstanceType.POLICY] = new Zone('Policies', 'P', ZoneInstanceType.POLICY); zones[ZoneInstanceType.GROUP] = new Zone('Groups', 'G', ZoneInstanceType.GROUP); @@ -28,12 +28,12 @@ export class CompositionGraphZoneUtils { return zones; } - public showZone = (zone:Zone):void => { + public showZone = (zone: Zone): void => { zone.visible = true; zone.minimized = false; } - public getZoneTypeForPaletteComponent = (componentCategory:LeftPaletteMetadataTypes) => { + public getZoneTypeForPaletteComponent = (componentCategory: LeftPaletteMetadataTypes) => { if (componentCategory == LeftPaletteMetadataTypes.Group) { return ZoneInstanceType.GROUP; } else if (componentCategory == LeftPaletteMetadataTypes.Policy) { @@ -41,10 +41,10 @@ export class CompositionGraphZoneUtils { } }; - public initZoneInstances(zones:Array<Zone>, component:Component) { + public initZoneInstances(zones: Array<Zone>, component: Component) { if (component.groupInstances && component.groupInstances.length) { this.showZone(zones[ZoneInstanceType.GROUP]); - _.forEach(component.groupInstances, (group:GroupInstance) => { + _.forEach(component.groupInstances, (group: GroupInstance) => { let newInstance = new ZoneInstance(group, component); this.addInstanceToZone(zones[ZoneInstanceType.GROUP], newInstance); }); @@ -52,7 +52,7 @@ export class CompositionGraphZoneUtils { if (component.policies && component.policies.length) { this.showZone(zones[ZoneInstanceType.POLICY]); - _.forEach(component.policies, (policy:PolicyInstance) => { + _.forEach(component.policies, (policy: PolicyInstance) => { let newInstance = new ZoneInstance(policy, component); this.addInstanceToZone(zones[ZoneInstanceType.POLICY], newInstance); @@ -60,19 +60,19 @@ export class CompositionGraphZoneUtils { } } - public findAndUpdateZoneInstanceData (zones: Array<Zone>, instanceData:PolicyInstance | GroupInstance) { - _.forEach(zones, (zone:Zone) => { - _.forEach(zone.instances, (zoneInstance:ZoneInstance) => { - if(zoneInstance.instanceData.uniqueId === instanceData.uniqueId){ + public findAndUpdateZoneInstanceData(zones: Array<Zone>, instanceData: PolicyInstance | GroupInstance) { + _.forEach(zones, (zone: Zone) => { + _.forEach(zone.instances, (zoneInstance: ZoneInstance) => { + if (zoneInstance.instanceData.uniqueId === instanceData.uniqueId) { zoneInstance.updateInstanceData(instanceData); } }); }); } - public updateTargetsOrMembersOnCanvasDelete = (canvasNodeID:string, zones:Array<Zone>, type:ZoneInstanceAssignmentType):void => { + public updateTargetsOrMembersOnCanvasDelete = (canvasNodeID: string, zones: Array<Zone>, type: ZoneInstanceAssignmentType): void => { _.forEach(zones, (zone) => { - _.forEach(zone.instances, (zoneInstance:ZoneInstance) => { + _.forEach(zone.instances, (zoneInstance: ZoneInstance) => { if (zoneInstance.isAlreadyAssigned(canvasNodeID)) { zoneInstance.addOrRemoveAssignment(canvasNodeID, type); //remove it from our list of BE targets and members as well (so that it will not be sent in future calls to BE). @@ -82,7 +82,7 @@ export class CompositionGraphZoneUtils { }); }; - public createZoneInstanceFromLeftPalette = (zoneType:ZoneInstanceType, component:Component, paletteComponentType:string):Observable<ZoneInstance> => { + public createZoneInstanceFromLeftPalette = (zoneType: ZoneInstanceType, component: Component, paletteComponentType: string): Observable<ZoneInstance> => { if (zoneType === ZoneInstanceType.POLICY) { return this.policiesService.createPolicyInstance(component.componentType, component.uniqueId, paletteComponentType).map(response => { let newInstance = new PolicyInstance(response); @@ -98,16 +98,16 @@ export class CompositionGraphZoneUtils { } } - public addInstanceToZone(zone:Zone, instance:ZoneInstance, hide?:boolean) { - if(hide){ + public addInstanceToZone(zone: Zone, instance: ZoneInstance, hide?: boolean) { + if (hide) { instance.hidden = true; } zone.instances.push(instance); }; - private findZoneCoordinates(zoneType):Point { - let point:Point = new Point(0, 0); + private findZoneCoordinates(zoneType): Point { + let point: Point = new Point(0, 0); let zone = angular.element(document.querySelector('.' + zoneType + '-zone')); let wrapperZone = zone.offsetParent(); point.x = zone.prop('offsetLeft') + wrapperZone.prop('offsetLeft'); @@ -115,7 +115,7 @@ export class CompositionGraphZoneUtils { return point; } - public createPaletteToZoneAnimation = (startPoint:Point, zoneType:ZoneInstanceType, newInstance:ZoneInstance) => { + public createPaletteToZoneAnimation = (startPoint: Point, zoneType: ZoneInstanceType, newInstance: ZoneInstance) => { let zoneTypeName = ZoneInstanceType[zoneType].toLowerCase(); let paletteToZoneAnimation = this.dynamicComponentService.createDynamicComponent(PaletteAnimationComponent); paletteToZoneAnimation.instance.from = startPoint; @@ -126,56 +126,56 @@ export class CompositionGraphZoneUtils { paletteToZoneAnimation.instance.runAnimation(); } - public startCyTagMode = (cy:Cy.Instance) => { + public startCyTagMode = (cy: Cy.Instance) => { cy.autolock(true); cy.nodes().unselectify(); cy.emit('tagstart'); //dont need to show handles because they're already visible bcz of hover event }; - public endCyTagMode = (cy:Cy.Instance) => { + public endCyTagMode = (cy: Cy.Instance) => { cy.emit('tagend'); cy.nodes().selectify(); cy.autolock(false); }; - public handleTagClick = (cy:Cy.Instance, zoneInstance:ZoneInstance, nodeId:string) => { + public handleTagClick = (cy: Cy.Instance, zoneInstance: ZoneInstance, nodeId: string) => { zoneInstance.addOrRemoveAssignment(nodeId, ZoneInstanceAssignmentType.COMPONENT_INSTANCES); this.showZoneTagIndicationForNode(nodeId, zoneInstance, cy); }; - public showGroupZoneIndications = (groupInstances:Array<ZoneInstance>, policyInstance:ZoneInstance) => { - groupInstances.forEach((groupInstance:ZoneInstance)=> { - let handle:string = this.getCorrectHandleForNode(groupInstance.instanceData.uniqueId, policyInstance); + public showGroupZoneIndications = (groupInstances: Array<ZoneInstance>, policyInstance: ZoneInstance) => { + groupInstances.forEach((groupInstance: ZoneInstance) => { + let handle: string = this.getCorrectHandleForNode(groupInstance.instanceData.uniqueId, policyInstance); groupInstance.showHandle(handle); }) }; - public hideGroupZoneIndications = (instances:Array<ZoneInstance>) => { + public hideGroupZoneIndications = (instances: Array<ZoneInstance>) => { instances.forEach((instance) => { instance.hideHandle(); }) } - public showZoneTagIndications = (cy:Cy.Instance, zoneInstance:ZoneInstance) => { + public showZoneTagIndications = (cy: Cy.Instance, zoneInstance: ZoneInstance) => { cy.nodes().forEach(node => { - let handleType:string = this.getCorrectHandleForNode(node.id(), zoneInstance); + let handleType: string = this.getCorrectHandleForNode(node.id(), zoneInstance); cy.emit('showhandle', [node, handleType]); }); }; - public showZoneTagIndicationForNode = (nodeId:string, zoneInstance:ZoneInstance, cy:Cy.Instance) => { + public showZoneTagIndicationForNode = (nodeId: string, zoneInstance: ZoneInstance, cy: Cy.Instance) => { let node = cy.getElementById(nodeId); - let handleType:string = this.getCorrectHandleForNode(nodeId, zoneInstance); + let handleType: string = this.getCorrectHandleForNode(nodeId, zoneInstance); cy.emit('showhandle', [node, handleType]); } - public hideZoneTagIndications = (cy:Cy.Instance) => { + public hideZoneTagIndications = (cy: Cy.Instance) => { cy.emit('hidehandles'); }; - public getCorrectHandleForNode = (nodeId:string, zoneInstance:ZoneInstance):string => { + public getCorrectHandleForNode = (nodeId: string, zoneInstance: ZoneInstance): string => { if (zoneInstance.isAlreadyAssigned(nodeId)) { if (zoneInstance.type == ZoneInstanceType.POLICY) { return CanvasHandleTypes.TAGGED_POLICY; diff --git a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/match-capability-requierment-utils.ts b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/match-capability-requierment-utils.ts index eac907a9b2..aa1991069e 100644 --- a/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/match-capability-requierment-utils.ts +++ b/catalog-ui/src/app/directives/graphs-v2/composition-graph/utils/match-capability-requierment-utils.ts @@ -23,7 +23,7 @@ import { Requirement, CompositionCiLinkBase, CapabilitiesGroup, RequirementsGroup, Match, CompositionCiNodeBase, Component, Capability } from "app/models"; -import {ComponentInstance} from "../../../../models/componentsInstances/componentInstance"; +import { ComponentInstance } from "../../../../models/componentsInstances/componentInstance"; /** * Created by obarda on 1/1/2017. */ @@ -35,8 +35,8 @@ export class MatchCapabilitiesRequirementsUtils { * @param filteredNodesData * @param cy */ - public highlightMatchingComponents(filteredNodesData, cy:Cy.Instance) { - _.each(filteredNodesData, (data:any) => { + public highlightMatchingComponents(filteredNodesData, cy: Cy.Instance) { + _.each(filteredNodesData, (data: any) => { let node = cy.getElementById(data.id); cy.emit('showhandle', [node]); }); @@ -49,16 +49,16 @@ export class MatchCapabilitiesRequirementsUtils { * @param cy * @param hoveredNodeData */ - public fadeNonMachingComponents(filteredNodesData, nodesData, cy:Cy.Instance, hoveredNodeData?) { + public fadeNonMachingComponents(filteredNodesData, nodesData, cy: Cy.Instance, hoveredNodeData?) { let fadeNodes = _.xorWith(nodesData, filteredNodesData, (node1, node2) => { return node1.id === node2.id; }); if (hoveredNodeData) { _.remove(fadeNodes, hoveredNodeData); } - cy.batch(()=> { + cy.batch(() => { _.each(fadeNodes, (node) => { - cy.getElementById(node.id).style({'background-image-opacity': 0.4}); + cy.getElementById(node.id).style({ 'background-image-opacity': 0.4 }); }); }) } @@ -67,21 +67,21 @@ export class MatchCapabilitiesRequirementsUtils { * Resets all nodes to regular opacity * @param cy */ - public resetFadedNodes(cy:Cy.Instance) { - cy.batch(()=> { - cy.nodes().style({'background-image-opacity': 1}); + public resetFadedNodes(cy: Cy.Instance) { + cy.batch(() => { + cy.nodes().style({ 'background-image-opacity': 1 }); }) } - private static isRequirementFulfilled(fromNodeId:string, requirement:any, links:Array<CompositionCiLinkBase>):boolean { - if(requirement.maxOccurrences === 'UNBOUNDED'){ + private static isRequirementFulfilled(fromNodeId: string, requirement: any, links: Array<CompositionCiLinkBase>): boolean { + if (requirement.maxOccurrences === 'UNBOUNDED') { return false; } - let linksWithThisReq:Array<CompositionCiLinkBase> = _.filter(links, { + let linksWithThisReq: Array<CompositionCiLinkBase> = _.filter(links, { 'relation': { 'fromNode': fromNodeId, 'relationships': [{ - 'relation':{ + 'relation': { 'requirementOwnerId': requirement.ownerId, 'requirement': requirement.name, 'relationship': { @@ -95,7 +95,7 @@ export class MatchCapabilitiesRequirementsUtils { return linksWithThisReq.length == requirement.maxOccurrences; }; - private static isMatch(requirement:Requirement, capability:Capability):boolean { + private static isMatch(requirement: Requirement, capability: Capability): boolean { if (capability.type === requirement.capability) { if (requirement.node) { if (_.includes(capability.capabilitySources, requirement.node)) { @@ -108,15 +108,15 @@ export class MatchCapabilitiesRequirementsUtils { return false; }; - public getMatchedRequirementsCapabilities(fromComponentInstance:ComponentInstance, - toComponentInstance:ComponentInstance, - links:Array<CompositionCiLinkBase>):Array<Match> { - let fromToMatches:Array<Match> = this.getMatches(fromComponentInstance.requirements, + public getMatchedRequirementsCapabilities(fromComponentInstance: ComponentInstance, + toComponentInstance: ComponentInstance, + links: Array<CompositionCiLinkBase>): Array<Match> { + let fromToMatches: Array<Match> = this.getMatches(fromComponentInstance.requirements, toComponentInstance.capabilities, links, fromComponentInstance.uniqueId, toComponentInstance.uniqueId, true); - let toFromMatches:Array<Match> = this.getMatches(toComponentInstance.requirements, + let toFromMatches: Array<Match> = this.getMatches(toComponentInstance.requirements, fromComponentInstance.capabilities, links, fromComponentInstance.uniqueId, @@ -127,16 +127,16 @@ export class MatchCapabilitiesRequirementsUtils { /***** REFACTORED FUNCTIONS START HERE *****/ - public getMatches(requirements:RequirementsGroup, capabilities:CapabilitiesGroup, links:Array<CompositionCiLinkBase>, - fromId:string, toId:string, isFromTo: boolean):Array<Match> { - let matches:Array<Match> = []; + public getMatches(requirements: RequirementsGroup, capabilities: CapabilitiesGroup, links: Array<CompositionCiLinkBase>, + fromId: string, toId: string, isFromTo: boolean): Array<Match> { + let matches: Array<Match> = []; let unfulfilledReqs = this.getUnfulfilledRequirements(fromId, requirements, links); - _.forEach(unfulfilledReqs, (req)=> { - _.forEach(_.flatten(_.values(capabilities)), (capability:Capability)=> { + _.forEach(unfulfilledReqs, (req) => { + _.forEach(_.flatten(_.values(capabilities)), (capability: Capability) => { if (MatchCapabilitiesRequirementsUtils.isMatch(req, capability)) { - if(isFromTo) { + if (isFromTo) { matches.push(new Match(req, capability, isFromTo, fromId, toId)); - } else{ + } else { matches.push(new Match(req, capability, isFromTo, toId, fromId)); } } @@ -145,10 +145,10 @@ export class MatchCapabilitiesRequirementsUtils { return matches; } - public getUnfulfilledRequirements = (fromNodeId:string, requirements:RequirementsGroup, links:Array<CompositionCiLinkBase>):Array<Requirement>=> { + public getUnfulfilledRequirements = (fromNodeId: string, requirements: RequirementsGroup, links: Array<CompositionCiLinkBase>): Array<Requirement> => { - let requirementArray:Array<Requirement> = []; - _.forEach(_.flatten(_.values(requirements)), (requirement:Requirement)=> { + let requirementArray: Array<Requirement> = []; + _.forEach(_.flatten(_.values(requirements)), (requirement: Requirement) => { if (requirement.name !== 'dependency' && requirement.parentName !== 'dependency' && !MatchCapabilitiesRequirementsUtils.isRequirementFulfilled(fromNodeId, requirement, links)) { requirementArray.push(requirement); } @@ -163,9 +163,9 @@ export class MatchCapabilitiesRequirementsUtils { * @param capabilities * @returns {boolean} */ - public containsMatch = (requirements:Array<Requirement>, capabilities:CapabilitiesGroup):boolean => { - return _.some(requirements, (req:Requirement)=> { - return _.some(_.flatten(_.values(capabilities)), (capability:Capability) => { + public containsMatch = (requirements: Array<Requirement>, capabilities: CapabilitiesGroup): boolean => { + return _.some(requirements, (req: Requirement) => { + return _.some(_.flatten(_.values(capabilities)), (capability: Capability) => { return MatchCapabilitiesRequirementsUtils.isMatch(req, capability); }); }); @@ -178,11 +178,11 @@ export class MatchCapabilitiesRequirementsUtils { * 2. node has an unfulfilled requirement that matches the component's capabilities * 3. vl is passed in which has the capability to fulfill requirement from component and requirement on node. */ - public findMatchingNodes(component:Component, nodeDataArray:Array<CompositionCiNodeBase>, - links:Array<CompositionCiLinkBase>):Array<any> //TODO allow for VL array and TEST + public findMatchingNodes(component: Component, nodeDataArray: Array<CompositionCiNodeBase>, + links: Array<CompositionCiLinkBase>): Array<any> //TODO allow for VL array and TEST { - let componentRequirements:Array<Requirement> = this.getUnfulfilledRequirements(component.uniqueId, component.requirements, links); - return _.filter(nodeDataArray, (node:any)=> { + let componentRequirements: Array<Requirement> = this.getUnfulfilledRequirements(component.uniqueId, component.requirements, links); + return _.filter(nodeDataArray, (node: any) => { if (node && node.componentInstance) { //Check if component has an unfulfilled requirement that can be met by one of nodes's capabilities (#1) @@ -190,7 +190,7 @@ export class MatchCapabilitiesRequirementsUtils { return true; } else { //Check if node has unfulfilled requirement that can be filled by component (#2) - let nodeRequirements:Array<Requirement> = this.getUnfulfilledRequirements(node.componentInstance.uniqueId, node.componentInstance.requirements, links); + let nodeRequirements: Array<Requirement> = this.getUnfulfilledRequirements(node.componentInstance.uniqueId, node.componentInstance.requirements, links); if (!nodeRequirements.length) return false; if (this.containsMatch(nodeRequirements, component.capabilities)) { return true; |