Added subscriber S/C tags
diff --git a/views/ngXosViews/diagnostic/src/index.html b/views/ngXosViews/diagnostic/src/index.html
index eacbfe1..34deef6 100644
--- a/views/ngXosViews/diagnostic/src/index.html
+++ b/views/ngXosViews/diagnostic/src/index.html
@@ -33,6 +33,7 @@
<script src="/api/ng-xos.js"></script>
<script src="/api/ng-hpcapi.js"></script>
<script src="/.tmp/main.js"></script>
+<script src="/.tmp/subscriber_service.js"></script>
<script src="/.tmp/subscriber-modal.js"></script>
<script src="/.tmp/serviceTopologyHelper.js"></script>
<script src="/.tmp/serviceTopology.js"></script>
diff --git a/views/ngXosViews/diagnostic/src/js/diagnostic.js b/views/ngXosViews/diagnostic/src/js/diagnostic.js
index c9787ba..d65194c 100644
--- a/views/ngXosViews/diagnostic/src/js/diagnostic.js
+++ b/views/ngXosViews/diagnostic/src/js/diagnostic.js
@@ -30,6 +30,10 @@
ServiceRelation.getBySubscriber(subscriber)
.then((serviceChain) => {
this.serviceChain = serviceChain;
+ return Subscribers.getWithDevices({id: subscriber.id}).$promise;
+ })
+ .then((subscriber) => {
+ this.selectedSubscriber = subscriber;
});
});
}
diff --git a/views/ngXosViews/diagnostic/src/js/logicTopology.js b/views/ngXosViews/diagnostic/src/js/logicTopology.js
index a3501dd..5ca0b30 100644
--- a/views/ngXosViews/diagnostic/src/js/logicTopology.js
+++ b/views/ngXosViews/diagnostic/src/js/logicTopology.js
@@ -11,7 +11,7 @@
bindToController: true,
controllerAs: 'vm',
templateUrl: 'templates/logicTopology.tpl.html',
- controller: function($element, $log, $scope, $rootScope, $timeout, d3, LogicTopologyHelper, Node, Tenant, Ceilometer){
+ controller: function($element, $log, $scope, $rootScope, $timeout, d3, LogicTopologyHelper, Node, Tenant, Ceilometer, serviceTopologyConfig){
$log.info('Logic Plane');
var svg;
@@ -29,8 +29,6 @@
$scope.$watch(() => this.subscribers, (subscribers) => {
if(subscribers){
- // LogicTopologyHelper.addSubscribers(angular.copy(subscribers));
-
Node.queryWithInstances().$promise
.then((computeNodes) => {
LogicTopologyHelper.addComputeNodes(computeNodes);
@@ -43,6 +41,17 @@
$scope.$watch(() => this.selected, (selected) => {
if(selected){
$log.info(`Update logic layer for subscriber ${selected.humanReadableName}`);
+
+ // append the device with to config settings
+ serviceTopologyConfig.elWidths.push(160);
+
+ LogicTopologyHelper.addSubscriber(angular.copy(selected));
+
+ Tenant.getSubscriberTag({subscriber_root: selected.id}).$promise
+ .then((tags) => {
+ LogicTopologyHelper.addSubscriberTag(tags);
+ LogicTopologyHelper.updateTree(svg);
+ })
}
});
@@ -57,6 +66,10 @@
$rootScope.$on('instance.detail', (evt, service) => {
+ // NOTE consider if subscriber is selected or not,
+ // if not select instances
+ // else select containers (and follow subscriber chain to find the correct instance)
+
let param = {
'service_vsg': {kind: 'vCPE'},
'service_vbng': {kind: 'vBNG'},
@@ -69,6 +82,7 @@
return Ceilometer.getInstancesStats(instances);
})
.then((instances) => {
+ console.log(instances);
this.hideInstanceStats = false;
// HACK if array is empty wait for animation
if(instances.length === 0){
@@ -97,7 +111,6 @@
$scope.$apply();
};
-
// listen for subscriber modal event
$rootScope.$on('subscriber.modal.open', () => {
this.openSubscriberModal();
diff --git a/views/ngXosViews/diagnostic/src/js/logicTopologyHelper.js b/views/ngXosViews/diagnostic/src/js/logicTopologyHelper.js
index f860d9e..f17b103 100644
--- a/views/ngXosViews/diagnostic/src/js/logicTopologyHelper.js
+++ b/views/ngXosViews/diagnostic/src/js/logicTopologyHelper.js
@@ -136,6 +136,7 @@
});
// TODO handle node remove
+ var nodeExit = node.exit().remove();
};
/**
@@ -164,6 +165,8 @@
link.transition()
.duration(serviceTopologyConfig.duration)
.attr('d', diagonal);
+
+ link.exit().remove();
};
/**
@@ -190,6 +193,7 @@
// Compute the new tree layout.
[nodes, links] = computeLayout(baseData);
+ // console.log(baseData);
drawNodes(svg, nodes);
drawLinks(svg, links);
}
@@ -197,19 +201,28 @@
/**
* Add Subscribers to the tree
*/
- this.addSubscribers = (subscribers) => {
+ this.addSubscriber = (subscriber) => {
- subscribers.map((subscriber) => {
- subscriber.children = subscriber.devices;
- });
+
+ subscriber.children = subscriber.devices;
// add subscriber to data tree
- baseData.children[0].children[0].children[0].children = subscribers;
-
+ baseData.children[0].children[0].children[0].children = [subscriber];
return baseData;
};
/**
+ * Add Subscriber tag to LAN Network
+ */
+
+ this.addSubscriberTag = (tags) => {
+ baseData.children[0].children[0].children[0].subscriberTag = {
+ cTag: tags.c_tag,
+ sTag: tags.s_tag
+ }
+ };
+
+ /**
* Add compute nodes to the rack element
*/
diff --git a/views/ngXosViews/diagnostic/src/js/nodeDrawer.js b/views/ngXosViews/diagnostic/src/js/nodeDrawer.js
index 62e2cdf..94ff406 100644
--- a/views/ngXosViews/diagnostic/src/js/nodeDrawer.js
+++ b/views/ngXosViews/diagnostic/src/js/nodeDrawer.js
@@ -26,6 +26,26 @@
'text-anchor': 'middle'
})
.text(d => d.name)
+
+ nodes.each(function(n){
+ let currentNode = d3.select(this);
+ // cicle trouch node to add Tags and Public IP
+ if(n.name === 'LAN' && angular.isDefined(n.subscriberTag)){
+ currentNode.append('text')
+ .attr({
+ 'text-anchor': 'middle',
+ y: 40
+ })
+ .text(() => `C-Tag: ${n.subscriberTag.cTag}`);
+
+ currentNode.append('text')
+ .attr({
+ 'text-anchor': 'middle',
+ y: 60
+ })
+ .text(() => `S-Tag: ${n.subscriberTag.sTag}`);
+ }
+ });
}
this.addRack = (nodes) => {
diff --git a/views/ngXosViews/diagnostic/src/js/rest_services.js b/views/ngXosViews/diagnostic/src/js/rest_services.js
index 885b3de..877b485 100644
--- a/views/ngXosViews/diagnostic/src/js/rest_services.js
+++ b/views/ngXosViews/diagnostic/src/js/rest_services.js
@@ -28,6 +28,16 @@
return instances;
}
}
+ },
+ getSubscriberTag: {
+ method: 'GET',
+ isArray: true,
+ interceptor: {
+ response: (res) => {
+ // NOTE we should receive only one vOLT tenant here
+ return JSON.parse(res.data[0].service_specific_attribute);
+ }
+ }
}
});
})
@@ -127,7 +137,7 @@
});
})
.service('Subscribers', function($resource, $q, SubscriberDevice){
- return $resource('/xos/subscribers', {id: '@id'}, {
+ return $resource('/xos/subscribers/:id', {id: '@id'}, {
queryWithDevices: {
method: 'GET',
isArray: true,
@@ -138,7 +148,7 @@
* For each subscriber retrieve devices and append them
*/
- const deferred = $q.defer();
+ let deferred = $q.defer();
let requests = [];
@@ -169,6 +179,29 @@
return deferred.promise;
}
}
+ },
+ getWithDevices: {
+ method: 'GET',
+ isArray: false,
+ interceptor: {
+ response: (res) => {
+ let d = $q.defer();
+
+ SubscriberDevice.query({id: res.data.id}).$promise
+ .then(devices => {
+ devices.map(d => d.type = 'device');
+ res.data.devices = devices;
+ res.data.type = 'subscriber';
+ console.log(res.data);
+ d.resolve(res.data);
+ })
+ .catch(err => {
+ d.reject(err);
+ });
+
+ return d.promise;
+ }
+ }
}
});
})
@@ -289,13 +322,20 @@
// TODO refactor
const buildChild = (services, tenants, currentService) => {
+
+ const response = {
+ type: 'service',
+ name: currentService.humanReadableName,
+ service: currentService
+ };
+
let tenant = lodash.find(tenants, {subscriber_service: currentService.id});
if(tenant){
let next = lodash.find(services, {id: tenant.provider_service});
- currentService.children = [buildChild(services, tenants, next)];
+ response.children = [buildChild(services, tenants, next)];
}
else {
- currentService.children = [
+ response.children = [
{
name: 'Router',
type: 'router',
@@ -303,9 +343,8 @@
}
]
}
- currentService.type = 'service';
delete currentService.id; // conflict with d3
- return currentService;
+ return response;
}
let baseService = lodash.find(services, {id: 3});
diff --git a/views/ngXosViews/diagnostic/src/js/serviceTopology.js b/views/ngXosViews/diagnostic/src/js/serviceTopology.js
index 3d602fe..b358abf 100644
--- a/views/ngXosViews/diagnostic/src/js/serviceTopology.js
+++ b/views/ngXosViews/diagnostic/src/js/serviceTopology.js
@@ -32,8 +32,6 @@
const width = el.clientWidth - (serviceTopologyConfig.widthMargin * 2);
const height = el.clientHeight - (serviceTopologyConfig.heightMargin * 2);
- console.log(el.clientWidth, el.clientHeight);
-
const treeLayout = d3.layout.tree()
.size([height, width]);
diff --git a/views/ngXosViews/diagnostic/src/js/serviceTopologyHelper.js b/views/ngXosViews/diagnostic/src/js/serviceTopologyHelper.js
index 817e79e..47fc5eb 100644
--- a/views/ngXosViews/diagnostic/src/js/serviceTopologyHelper.js
+++ b/views/ngXosViews/diagnostic/src/js/serviceTopologyHelper.js
@@ -225,8 +225,8 @@
$rootScope.$emit('instance.detail.hide', {});
return updateTree(_svg, _layout, _source);
}
-
- $rootScope.$emit('instance.detail', {name: d.humanReadableName});
+
+ $rootScope.$emit('instance.detail', {name: d.name});
// unselect all
_svg.selectAll('circle')