Added Icons to mCord Topology
diff --git a/applications/mCordPortal/src/app/fw/mast/mast.html b/applications/mCordPortal/src/app/fw/mast/mast.html
index d11e66e..c568713 100644
--- a/applications/mCordPortal/src/app/fw/mast/mast.html
+++ b/applications/mCordPortal/src/app/fw/mast/mast.html
@@ -21,7 +21,7 @@
<a href="#/user">User</a>
</li>
<li ng-class="{active: page.curr === 'bundle'}">
- <a href="#/bundle">Bundle</a>
+ <a href="#/bundle">Services</a>
</li>
<li ng-click="logout()">
<a href="#/contact">Logout</a>
diff --git a/applications/mCordPortal/src/app/view/bundle/bundle.html b/applications/mCordPortal/src/app/view/bundle/bundle.html
index 96d2ab5..48e00c1 100644
--- a/applications/mCordPortal/src/app/view/bundle/bundle.html
+++ b/applications/mCordPortal/src/app/view/bundle/bundle.html
@@ -13,7 +13,7 @@
</div>
<div class="panel panel-primary">
<div class="panel-heading">
- <h3 class="panel-title">Users</h3>
+ <h3 class="panel-title">Services</h3>
</div>
<table class="table">
<tr ng-repeat="func in funcs" class="animate-repeat">
diff --git a/applications/mCordPortal/src/cord.js b/applications/mCordPortal/src/cord.js
index 7ac5672..2636fba 100644
--- a/applications/mCordPortal/src/cord.js
+++ b/applications/mCordPortal/src/cord.js
@@ -75,25 +75,25 @@
bundles: [
{
"id": "family",
- "name": "Advanced Bundle",
+ "name": "Education Bundle",
"desc": "Description for advanced bundle and the amazing thing it can do to managing Video Optimization.",
"functions": [
{
"id": "cache",
"name": "Cache",
- "desc": "Caching Service.",
+ "desc": "Local content and frequently used content are served from local cache service entity. This will increase the quality of service by reduced delay and by avoiding the bottleneck of the legacy cloud based content services.",
"params": {}
},
{
"id": "firewall",
"name": "Firewall",
- "desc": "Normal firewall protection.",
+ "desc": "This provides security services that control the incoming and outgoing network traffic. Enhanced features like IPS (Intrusion Prevention System), threat analysis and content filtering are also available.",
"params": {}
},
{
"id": "video",
"name": "Video Optimization",
- "desc": "Optimization for the video download.",
+ "desc": "This can provide different video transcoding formats to improve video quality during congestion.Priority based badwidth resource allocation is also available",
"params": {
"levels": ["enabled", "disabled"]
}
@@ -108,13 +108,13 @@
{
"id": "cache",
"name": "Cache",
- "desc": "Basic caching service.",
+ "desc": "Local content and frequently used content are served from local cache service entity. This will increase the quality of service by reduced delay and by avoiding the bottleneck of the legacy cloud based content services.",
"params": {}
},
{
"id": "firewall",
"name": "Firewall",
- "desc": "Normal firewall protection.",
+ "desc": "This provides security services that control the incoming and outgoing network traffic. Enhanced features like IPS (Intrusion Prevention System), threat analysis and content filtering are also available.",
"params": {}
}
]
diff --git a/views/ngXosViews/mcordTopology/src/css/mcord.css b/views/ngXosViews/mcordTopology/src/css/mcord.css
index d2d21e7..df22bfe 100644
--- a/views/ngXosViews/mcordTopology/src/css/mcord.css
+++ b/views/ngXosViews/mcordTopology/src/css/mcord.css
@@ -46,6 +46,11 @@
fill: #FFBB78;
}
+.rru.antenna {
+ stroke: #000;
+ fill: brown;
+}
+
.rru-shadow {
fill: #FFBB78;
opacity: .4
@@ -62,5 +67,5 @@
.PGW text {
font-size: 10px;
stroke-width: 0;
- fill: #000;
+ fill: #fff;
}
\ No newline at end of file
diff --git a/views/ngXosViews/mcordTopology/src/js/node_drawer.js b/views/ngXosViews/mcordTopology/src/js/node_drawer.js
index 14bdf99..14d85a7 100644
--- a/views/ngXosViews/mcordTopology/src/js/node_drawer.js
+++ b/views/ngXosViews/mcordTopology/src/js/node_drawer.js
@@ -38,25 +38,38 @@
this.drawBbus = (nodes) => {
- nodes.append('circle')
+ // nodes.append('circle')
+ // .attr({
+ // class: d => d.type,
+ // r: 0,
+ // opacity: 0
+ // })
+ // .transition()
+ // .duration(duration)
+ // // .delay((d, i) => i * (duration / 2))
+ // .attr({
+ // r: 15,
+ // opacity: 1
+ // });
+ nodes
+ .append('path')
.attr({
- class: d => d.type,
- r: 0,
- opacity: 0
+ class: d => `${d.type} antenna`,
+ opacity: 0,
+ d: () => TopologyElements.icons.bbu,
+ transform: `translate(-22, -22), scale(0.4)`
})
.transition()
.duration(duration)
- // .delay((d, i) => i * (duration / 2))
.attr({
- r: 15,
opacity: 1
});
nodes.append('text')
.attr({
'text-anchor': 'start',
- y: 17,
- x: 17,
+ y: 13,
+ x: -14,
opacity: 0
})
.text(d => `BBU ${d.name.substr(d.name.length - 1, 1)}`)
@@ -79,23 +92,37 @@
.duration(duration * 2)
// .delay((d, i) => i * (duration / 2))
.attr({
- r: 30,
+ r: 40,
opacity: 1
});
-
- nodes.append('circle')
+
+ nodes
+ .append('path')
.attr({
- class: d => d.type,
- r: 0,
- opacity: 0
+ class: d => `${d.type} antenna`,
+ opacity: 0,
+ d: () => TopologyElements.icons.rru,
+ transform: `translate(-22, -22), scale(0.4)`
})
.transition()
.duration(duration)
- // .delay((d, i) => i * (duration / 2))
.attr({
- r: 10,
opacity: 1
});
+
+ // nodes.append('circle')
+ // .attr({
+ // class: d => d.type,
+ // r: 0,
+ // opacity: 0
+ // })
+ // .transition()
+ // .duration(duration)
+ // // .delay((d, i) => i * (duration / 2))
+ // .attr({
+ // r: 10,
+ // opacity: 1
+ // });
};
this.drawFabric = (nodes) => {
@@ -125,25 +152,38 @@
};
this.drawOthers = (nodes) => {
- nodes.append('circle')
+ // nodes.append('circle')
+ // .attr({
+ // class: d => d.type,
+ // r: 0,
+ // opacity: 0
+ // })
+ // .transition()
+ // .duration(duration)
+ // // .delay((d, i) => i * (duration / 2))
+ // .attr({
+ // r: 15,
+ // opacity: 1
+ // });
+ nodes
+ .append('path')
.attr({
- class: d => d.type,
- r: 0,
- opacity: 0
+ class: d => `${d.type} antenna`,
+ opacity: 0,
+ d: () => TopologyElements.icons.bbu,
+ transform: `translate(-22, -22), scale(0.4)`
})
.transition()
.duration(duration)
- // .delay((d, i) => i * (duration / 2))
.attr({
- r: 15,
opacity: 1
});
nodes.append('text')
.attr({
'text-anchor': 'start',
- y: 17,
- x: 17,
+ y: 13,
+ x: -12,
opacity: 0
})
.text(d => d.type)
diff --git a/views/ngXosViews/mcordTopology/src/js/static.data.js b/views/ngXosViews/mcordTopology/src/js/static.data.js
index c38239d..79adaa9 100644
--- a/views/ngXosViews/mcordTopology/src/js/static.data.js
+++ b/views/ngXosViews/mcordTopology/src/js/static.data.js
@@ -55,9 +55,11 @@
}
],
icons: {
+ bbu: `M15,100a5,5,0,0,1-5-5v-65a5,5,0,0,1,5-5h80a5,5,0,0,1,5,5v65a5,5,0,0,1-5,5zM14,22.5l11-11a10,3,0,0,1,10-2h40a10,3,0,0,1,10,2l11,11zM16,35a5,5,0,0,1,10,0a5,5,0,0,1-10,0z`,
switch: `M10,20a10,10,0,0,1,10-10h70a10,10,0,0,1,10,10v70a10,10,
0,0,1-10,10h-70a10,10,0,0,1-10-10zM60,26l12,0,0-8,18,13-18,13,0
-8-12,0zM60,60l12,0,0-8,18,13-18,13,0-8-12,0zM50,40l-12,0,0-8
-18,13,18,13,0-8,12,0zM50,74l-12,0,0-8-18,13,18,13,0-8,12,0z`,
+ rru: `M85,71.2c-8.9,10.5-29.6,8.7-45.3-3.5C23.9,55.4,19.8,37,28.6,26.5C29.9,38.6,71.5,69.9,85,71.2z M92.7,76.2M16.2,15 M69.5,100.7v-4c0-1.4-1.2-2.2-2.6-2.2H19.3c-1.4,0-2.8,0.7-2.8,2.2v3.9c0,0.7,0.8,1,1.5,1h50.3C69,101.5,69.5,101.3,69.5,100.7z M77.3,7.5l0,3.7c9,0.1,16.3,7.1,16.2,15.7l3.9,0C97.5,16.3,88.5,7.6,77.3,7.5z M77.6,14.7l0,2.5c5.3,0,9.7,4.2,9.6,9.3l2.6,0C89.9,20,84.4,14.7,77.6,14.7z M82.3,22.2c-1.3-1.2-2.9-1.9-4.7-1.9l0,1.2c1.4,0,2.8,0.6,3.8,1.5c1,1,1.6,2.3,1.6,3.7l1.3,0C84.3,25.1,83.6,23.4,82.3,22.2z M38.9,69.5l-5.1,23h16.5l-2.5-17.2C44.1,73.3,38.9,69.5,38.9,69.5zM58.1,54.1c13.7,10.1,26.5,16.8,29.2,13.7c2.7-3.1-5.6-13-19.3-24.4 M62.9,34.2 M62,37.9C47.7,27.3,33.7,20,31,23.1c-2.7,3.2,7,14.2,20.6,26 M73.9,25.7c-2.9,0.1-5.2,2.3-5.1,4.8c0,0.7,0.2,1.4,0.6,2l0,0L53.8,49.7l3.3,2.5L72.7,35l-0.4-0.3c0.6,0.2,1.3,0.3,1.9,0.3c2.9-0.1,5.2-2.3,5.1-4.9C79.3,27.6,76.8,25.6,73.9,25.7z`
}
})
\ No newline at end of file
diff --git a/xos/configurations/frontend/mocks/mcord.yaml b/xos/configurations/frontend/mocks/mcord.yaml
index 65fc7dc..2c6648b 100644
--- a/xos/configurations/frontend/mocks/mcord.yaml
+++ b/xos/configurations/frontend/mocks/mcord.yaml
@@ -1,6 +1,6 @@
tosca_definitions_version: tosca_simple_yaml_1_0
-description: Setup CORD-related services -- vOLT, vCPE, vBNG.
+description: Setup CORD-related services
imports:
- custom_types/xos.yaml