summaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/directives/graphs-v2
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/app/directives/graphs-v2')
-rw-r--r--catalog-ui/src/app/directives/graphs-v2/common/style/component-instances-nodes-style.ts22
-rw-r--r--catalog-ui/src/app/directives/graphs-v2/composition-graph/composition-graph.directive.ts12
2 files changed, 32 insertions, 2 deletions
diff --git a/catalog-ui/src/app/directives/graphs-v2/common/style/component-instances-nodes-style.ts b/catalog-ui/src/app/directives/graphs-v2/common/style/component-instances-nodes-style.ts
index 194845c238..dd50524444 100644
--- a/catalog-ui/src/app/directives/graphs-v2/common/style/component-instances-nodes-style.ts
+++ b/catalog-ui/src/app/directives/graphs-v2/common/style/component-instances-nodes-style.ts
@@ -237,7 +237,27 @@ export class ComponentInstanceNodesStyle {
css: {
'shape': 'rectangle',
'background-image': (ele:Cy.Collection) => {
- return ele.data().setUncertifiedImageBgStyle(ele, GraphUIObjects.NODE_OVERLAP_MIN_SIZE);//Change name to setUncertifiedImageBgStyle??
+ return ele.data().initUncertifiedImage(ele, GraphUIObjects.NODE_OVERLAP_MIN_SIZE);
+ },
+ "border-width": 0
+ }
+ },
+ {
+ selector: '.dependent',
+ css: {
+ 'shape': 'rectangle',
+ 'background-image': (ele:Cy.Collection) => {
+ return ele.data().initDependentImage(ele, GraphUIObjects.NODE_OVERLAP_MIN_SIZE)
+ },
+ "border-width": 0
+ }
+ },
+ {
+ selector: '.dependent.not-certified',
+ css: {
+ 'shape': 'rectangle',
+ 'background-image': (ele:Cy.Collection) => {
+ return ele.data().initUncertifiedDependentImage(ele, GraphUIObjects.NODE_OVERLAP_MIN_SIZE)
},
"border-width": 0
}
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 804e772ac4..502188b3c2 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,7 +35,7 @@ import {
NodesFactory,
Point
} from "app/models";
-import { ComponentInstanceFactory, ComponentFactory, GRAPH_EVENTS, GraphColors } from "app/utils";
+import { ComponentInstanceFactory, ComponentFactory, GRAPH_EVENTS, GraphColors, DEPENDENCY_EVENTS } 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";
@@ -185,6 +185,7 @@ export class CompositionGraph implements ng.IDirective {
});
this.eventListenerService.unRegisterObserver(EVENTS.SHOW_LOADER_EVENT + 'composition-graph');
this.eventListenerService.unRegisterObserver(EVENTS.HIDE_LOADER_EVENT + 'composition-graph');
+ this.eventListenerService.unRegisterObserver(DEPENDENCY_EVENTS.ON_DEPENDENCY_CHANGE);
});
};
@@ -383,6 +384,15 @@ export class CompositionGraph implements ng.IDirective {
this.loadGraphData(scope);
});
+ this.eventListenerService.registerObserverCallback(DEPENDENCY_EVENTS.ON_DEPENDENCY_CHANGE, (ischecked: boolean) => {
+ if (ischecked) {
+ this._cy.$('node:selected').addClass('dependent');
+ } else {
+ // due to defect in cytoscape, just changing the class does not replace the icon, and i need to revert to original icon with no markings.
+ this._cy.$('node:selected').removeClass('dependent');
+ this._cy.$('node:selected').style({'background-image': this._cy.$('node:selected').data('originalImg')});
+ }
+ });
scope.zoom = (zoomIn: boolean): void => {
let currentZoom: number = this._cy.zoom();