Showing live traffic in topology view
diff --git a/views/ngXosViews/mcordTopology/gulp/server.js b/views/ngXosViews/mcordTopology/gulp/server.js
index 7605294..162bc97 100644
--- a/views/ngXosViews/mcordTopology/gulp/server.js
+++ b/views/ngXosViews/mcordTopology/gulp/server.js
@@ -23,6 +23,10 @@
target: conf.host || 'http://0.0.0.0:9999'
});
+var traffic = httpProxy.createProxyServer({
+ target: 'http://10.128.13.3'
+});
+
proxy.on('error', function(error, req, res) {
res.writeHead(500, {
@@ -64,6 +68,10 @@
}
proxy.web(req, res);
}
+ else if(req.url.indexOf('videoLocal') !== -1){
+ console.log('traffic: ', req.url);
+ traffic.web(req, res);
+ }
else{
next();
}
diff --git a/views/ngXosViews/mcordTopology/src/css/mcord.css b/views/ngXosViews/mcordTopology/src/css/mcord.css
index 7ef1d47..8fb7540 100644
--- a/views/ngXosViews/mcordTopology/src/css/mcord.css
+++ b/views/ngXosViews/mcordTopology/src/css/mcord.css
@@ -11,7 +11,7 @@
line {
stroke: blue;
- stroke-width: 1;
+ /*stroke-width: 1;*/
}
line.big{
diff --git a/views/ngXosViews/mcordTopology/src/js/main.js b/views/ngXosViews/mcordTopology/src/js/main.js
index 544482e..4b66991 100644
--- a/views/ngXosViews/mcordTopology/src/js/main.js
+++ b/views/ngXosViews/mcordTopology/src/js/main.js
@@ -17,6 +17,16 @@
.config(function($httpProvider){
$httpProvider.interceptors.push('NoHyperlinks');
})
+.service('Traffic', function($http, $q){
+ this.get = () => {
+ var deferred = $q.defer();
+ $http.get('videoLocal.txt')
+ .then(res => {
+ deferred.resolve(res.data);
+ });
+ return deferred.promise;
+ }
+})
.directive('mCordTopology', function(){
return {
restrict: 'E',
@@ -24,12 +34,14 @@
bindToController: true,
controllerAs: 'vm',
template: '',
- controller: function($element, $interval, XosApi, lodash, TopologyElements, NodeDrawer){
+ controller: function($element, $interval, $rootScope, XosApi, lodash, TopologyElements, NodeDrawer, Traffic){
const el = $element[0];
let nodes = [];
let links = [];
+ let traffic = 0;
+ let linkWidth = 1;
const filterBBU = (instances) => {
return lodash.filter(instances, i => i.name.indexOf('BBU') >= 0);
@@ -49,7 +61,19 @@
nodes = TopologyElements.nodes;
links = TopologyElements.links;
- XosApi.Instance_List_GET()
+ Traffic.get()
+ .then((_traffic) => {
+ let delta = (_traffic - traffic);
+ traffic = _traffic
+ linkWidth = _traffic / (delta || traffic);
+
+ if(linkWidth < 1){
+ linkWidth = 1;
+ }
+
+ console.log(`traffic: ${_traffic}`, `linkWidth: ${linkWidth}`);
+ return XosApi.Instance_List_GET()
+ })
.then((instances) => {
addBbuNodes(filterBBU(instances));
addOtherNodes(filterOthers(instances));
@@ -228,18 +252,25 @@
link.enter().append('line')
.attr({
- // class: 'link',
+ class: d => `link ${d.type}`,
+ 'stroke-width': linkWidth,
id: d => d.id,
- opacity: 0,
- class: d => `link ${d.type}`
+ opacity: 0
})
.transition()
.duration(1000)
- // .delay((d, i) => 50 * i)
.attr({
opacity: 1
});
+ link
+ .transition()
+ .duration(1000)
+ .attr({
+ 'stroke-width': linkWidth,
+ opacity: 1
+ });
+
link.exit()
.remove();
@@ -289,7 +320,7 @@
$interval(() => {
getData();
- }, 5000);
+ }, 3000);
getData();