blob: 49e5d7163bafab5320b248ee1bbb7e3ed4e83b3e [file] [log] [blame]
Matteo Scandoloda19dff2016-02-08 16:55:44 -08001(function () {
2 'use strict';
3
Matteo Scandolo4b3d8722016-02-24 11:22:48 -08004 angular.module('xos.diagnostic')
Matteo Scandoloda19dff2016-02-08 16:55:44 -08005 .directive('serviceTopology', function(){
6 return {
7 restrict: 'E',
8 scope: {
9 serviceChain: '='
10 },
11 bindToController: true,
12 controllerAs: 'vm',
13 template: '',
Matteo Scandoloeeb9c082016-02-09 11:19:22 -080014 controller: function($element, $window, $scope, d3, serviceTopologyConfig, ServiceRelation, Slice, Instances, Subscribers, ServiceTopologyHelper){
Matteo Scandoloda19dff2016-02-08 16:55:44 -080015
16 const el = $element[0];
17
Matteo Scandolo735606c2016-02-09 09:13:30 -080018 d3.select(window)
19 .on('resize', () => {
Matteo Scandolo735606c2016-02-09 09:13:30 -080020 draw(this.serviceChain);
21 });
Matteo Scandoloda19dff2016-02-08 16:55:44 -080022
Matteo Scandolo735606c2016-02-09 09:13:30 -080023 var root, svg;
Matteo Scandoloda19dff2016-02-08 16:55:44 -080024
25 const draw = (tree) => {
Matteo Scandolo735606c2016-02-09 09:13:30 -080026
Matteo Scandolo16763e92016-02-24 15:40:22 -080027 if(!tree){
28 console.error('Tree is missing');
29 return;
30 }
31
Matteo Scandoloeeb9c082016-02-09 11:19:22 -080032 // TODO update instead clear and redraw
33
Matteo Scandolo735606c2016-02-09 09:13:30 -080034 // clean
35 d3.select($element[0]).select('svg').remove();
36
37 const width = el.clientWidth - (serviceTopologyConfig.widthMargin * 2);
38 const height = el.clientHeight - (serviceTopologyConfig.heightMargin * 2);
39
40 const treeLayout = d3.layout.tree()
41 .size([height, width]);
42
43 svg = d3.select($element[0])
44 .append('svg')
45 .style('width', `${el.clientWidth}px`)
46 .style('height', `${el.clientHeight}px`)
47
48 const treeContainer = svg.append('g')
49 .attr('transform', `translate(${serviceTopologyConfig.widthMargin * 4},${serviceTopologyConfig.heightMargin})`);
50
Matteo Scandoloda19dff2016-02-08 16:55:44 -080051 root = tree;
52 root.x0 = height / 2;
53 root.y0 = width / 2;
54
Matteo Scandolo11dc8c42016-02-09 14:46:14 -080055 // ServiceTopologyHelper.drawLegend(svg);
Matteo Scandoloeeb9c082016-02-09 11:19:22 -080056 ServiceTopologyHelper.updateTree(treeContainer, treeLayout, root);
Matteo Scandoloda19dff2016-02-08 16:55:44 -080057 };
58
Matteo Scandoloda19dff2016-02-08 16:55:44 -080059 this.getInstances = (slice) => {
60 Instances.query({slice: slice.id}).$promise
61 .then((instances) => {
62 this.selectedSlice = slice;
63 this.instances = instances;
64 })
Matteo Scandoloba2d63d2016-02-17 13:54:11 -080065 .catch(e => {
66 this.errors = e;
67 throw new Error(e);
68 })
Matteo Scandoloda19dff2016-02-08 16:55:44 -080069 };
70
71 $scope.$watch(() => this.serviceChain, (chain) => {
Matteo Scandolo16763e92016-02-24 15:40:22 -080072 console.log(chain);
73 if(angular.isDefined(chain)){
Matteo Scandoloda19dff2016-02-08 16:55:44 -080074 draw(chain);
75 }
76 });
77 }
78 }
79 });
80
81}());