aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/directives
diff options
context:
space:
mode:
authormiriame <miriam.eini@amdocs.com>2019-02-13 15:17:26 +0200
committermiriame <miriam.eini@amdocs.com>2019-02-14 10:45:13 +0200
commitc2ce914541e694c7d1c8853b88936095e8b9ede4 (patch)
treed9d6dfa4b011c6868048d83a2116743b283b1cb1 /catalog-ui/src/app/directives
parentd72aaa18d4dbfb8017dce566d9c41ccc00985528 (diff)
Add 'Service Dependencies' tab in composition page
Issue-ID: SDC-1987 Change-Id: Ib5b688c12234c81fe6f89b2b5d37dd16a75b0db9 Signed-off-by: miriame <miriam.eini@amdocs.com>
Diffstat (limited to 'catalog-ui/src/app/directives')
-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();