홍길동 / onos

Go to a project
Toggle navigation Toggle navigation pinning
Simon Hunt
6d9bd03c 1 parent 47b2f55b

GUI -- [ONOS-347] - Suppress display of offline-devices (press the 'M' key). 

 - also minor cleanup of link "online" state, based on src/tgt nodes online state.

Change-Id: I6d4c634e4d9f7f994f9871b7c95e3264d6ada2bb
Inline Side-by-side
Showing 4 changed files with 105 additions and 24 deletions
1 +{
2 + "event": "removeDevice",
3 + "payload": {
4 + "id": "of:0000ffffffff0003",
5 + "type": "switch",
6 + "online": false,
7 + "location": {
8 + "type": "latlng",
9 + "lat": 40.7127,
10 + "lng": -74.0059
11 + },
12 + "labels": [
13 + "",
14 + "sw-3",
15 + "0000ffffffff0003"
16 + ],
17 + "metaUi": {
18 + "x": 800,
19 + "y": 280
20 + }
21 + }
22 +}
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
3 "payload": { 3 "payload": {
4 "id": "of:0000ffffffff0003/21-of:0000ffffffff0008/20", 4 "id": "of:0000ffffffff0003/21-of:0000ffffffff0008/20",
5 "type": "direct", 5 "type": "direct",
6 + "online": true,
6 "linkWidth": 2, 7 "linkWidth": 2,
7 "src": "of:0000ffffffff0003", 8 "src": "of:0000ffffffff0003",
8 "srcPort": "21", 9 "srcPort": "21",
......
...@@ -24,6 +24,7 @@ ...@@ -24,6 +24,7 @@
24 "10. update link (increase width, update props)", 24 "10. update link (increase width, update props)",
25 "11. update link (reduce width, update props)", 25 "11. update link (reduce width, update props)",
26 "12. remove link", 26 "12. remove link",
27 - "13. remove host (10.0.0.17)" 27 + "13. remove host (10.0.0.17)",
28 + "13. remove device [3]"
28 ] 29 ]
29 } 30 }
......
...@@ -145,6 +145,7 @@ ...@@ -145,6 +145,7 @@
145 D: [toggleDetails, 'Disable / enable details pane'], 145 D: [toggleDetails, 'Disable / enable details pane'],
146 B: [toggleBg, 'Toggle background image'], 146 B: [toggleBg, 'Toggle background image'],
147 H: [toggleHosts, 'Toggle host visibility'], 147 H: [toggleHosts, 'Toggle host visibility'],
148 + M: [toggleOffline, 'Toggle offline visibility'],
148 L: [cycleLabels, 'Cycle device labels'], 149 L: [cycleLabels, 'Cycle device labels'],
149 P: togglePorts, 150 P: togglePorts,
150 U: [unpin, 'Unpin node (hover mouse over)'], 151 U: [unpin, 'Unpin node (hover mouse over)'],
...@@ -203,6 +204,7 @@ ...@@ -203,6 +204,7 @@
203 cat7 = d3u.cat7(), 204 cat7 = d3u.cat7(),
204 colorAffinity = false, 205 colorAffinity = false,
205 showHosts = false, 206 showHosts = false,
207 + showOffline = true,
206 useDetails = true, 208 useDetails = true,
207 haveDetails = false; 209 haveDetails = false;
208 210
...@@ -330,6 +332,12 @@ ...@@ -330,6 +332,12 @@
330 flash('Hosts ' + visVal(showHosts)); 332 flash('Hosts ' + visVal(showHosts));
331 } 333 }
332 334
335 + function toggleOffline() {
336 + showOffline = !showOffline;
337 + updateOfflineVisibility();
338 + flash('Offline devices ' + visVal(showOffline));
339 + }
340 +
333 function cycleLabels() { 341 function cycleLabels() {
334 deviceLabelIndex = (deviceLabelIndex === 2) 342 deviceLabelIndex = (deviceLabelIndex === 2)
335 ? 0 : deviceLabelIndex + 1; 343 ? 0 : deviceLabelIndex + 1;
...@@ -711,13 +719,20 @@ ...@@ -711,13 +719,20 @@
711 evTrace(data); 719 evTrace(data);
712 var device = data.payload, 720 var device = data.payload,
713 id = device.id, 721 id = device.id,
714 - d = network.lookup[id]; 722 + d = network.lookup[id],
723 + wasOnline;
724 +
715 if (d) { 725 if (d) {
726 + wasOnline = d.online;
716 $.extend(d, device); 727 $.extend(d, device);
717 if (positionNode(d, true)) { 728 if (positionNode(d, true)) {
718 sendUpdateMeta(d, true); 729 sendUpdateMeta(d, true);
719 } 730 }
720 updateNodes(); 731 updateNodes();
732 + if (wasOnline !== d.online) {
733 + findAttachedLinks(d.id).forEach(restyleLinkElement);
734 + updateOfflineVisibility(d);
735 + }
721 } else { 736 } else {
722 logicError('updateDevice lookup fail. ID = "' + id + '"'); 737 logicError('updateDevice lookup fail. ID = "' + id + '"');
723 } 738 }
...@@ -742,7 +757,10 @@ ...@@ -742,7 +757,10 @@
742 d = network.lookup[id]; 757 d = network.lookup[id];
743 if (d) { 758 if (d) {
744 $.extend(d, host); 759 $.extend(d, host);
745 - updateHostState(d); 760 + if (positionNode(d, true)) {
761 + sendUpdateMeta(d, true);
762 + }
763 + updateNodes(d);
746 } else { 764 } else {
747 logicError('updateHost lookup fail. ID = "' + id + '"'); 765 logicError('updateHost lookup fail. ID = "' + id + '"');
748 } 766 }
...@@ -1339,8 +1357,10 @@ ...@@ -1339,8 +1357,10 @@
1339 class: 'link', 1357 class: 'link',
1340 1358
1341 type: function () { return 'hostLink'; }, 1359 type: function () { return 'hostLink'; },
1342 - // TODO: ideally, we should see if our edge switch is online... 1360 + online: function () {
1343 - online: function () { return true; }, 1361 + // hostlink target is edge switch
1362 + return lnk.target.online;
1363 + },
1344 linkWidth: function () { return 1; } 1364 linkWidth: function () { return 1; }
1345 }); 1365 });
1346 return lnk; 1366 return lnk;
...@@ -1366,8 +1386,9 @@ ...@@ -1366,8 +1386,9 @@
1366 }, 1386 },
1367 online: function () { 1387 online: function () {
1368 var s = lnk.fromSource, 1388 var s = lnk.fromSource,
1369 - t = lnk.fromTarget; 1389 + t = lnk.fromTarget,
1370 - return (s && s.online) || (t && t.online); 1390 + both = lnk.source.online && lnk.target.online;
1391 + return both && ((s && s.online) || (t && t.online));
1371 }, 1392 },
1372 linkWidth: function () { 1393 linkWidth: function () {
1373 var s = lnk.fromSource, 1394 var s = lnk.fromSource,
...@@ -1435,12 +1456,12 @@ ...@@ -1435,12 +1456,12 @@
1435 1456
1436 // operate on exiting links: 1457 // operate on exiting links:
1437 link.exit() 1458 link.exit()
1438 - .attr('stroke-dasharray', '3, 3') 1459 + .attr('stroke-dasharray', '3 3')
1439 .style('opacity', 0.5) 1460 .style('opacity', 0.5)
1440 .transition() 1461 .transition()
1441 .duration(1500) 1462 .duration(1500)
1442 .attr({ 1463 .attr({
1443 - 'stroke-dasharray': '3, 12', 1464 + 'stroke-dasharray': '3 12',
1444 stroke: config.topo.linkOutColor, 1465 stroke: config.topo.linkOutColor,
1445 'stroke-width': config.topo.linkOutWidth 1466 'stroke-width': config.topo.linkOutWidth
1446 }) 1467 })
...@@ -1575,8 +1596,6 @@ ...@@ -1575,8 +1596,6 @@
1575 node.fixed = true; 1596 node.fixed = true;
1576 node.px = node.x = x; 1597 node.px = node.x = x;
1577 node.py = node.y = y; 1598 node.py = node.y = y;
1578 - //node.px = x;
1579 - //node.py = y;
1580 return; 1599 return;
1581 } 1600 }
1582 1601
...@@ -1586,8 +1605,6 @@ ...@@ -1586,8 +1605,6 @@
1586 node.fixed = true; 1605 node.fixed = true;
1587 node.px = node.x = coord[0]; 1606 node.px = node.x = coord[0];
1588 node.py = node.y = coord[1]; 1607 node.py = node.y = coord[1];
1589 - //node.x = coord[0];
1590 - //node.y = coord[1];
1591 return true; 1608 return true;
1592 } 1609 }
1593 1610
...@@ -1726,15 +1743,8 @@ ...@@ -1726,15 +1743,8 @@
1726 } 1743 }
1727 1744
1728 function updateHostLabel(d) { 1745 function updateHostLabel(d) {
1729 - var label = hostLabel(d), 1746 + var label = trimLabel(hostLabel(d));
1730 - host = d.el; 1747 + d.el.select('text').text(label);
1731 -
1732 - host.select('text').text(label);
1733 - }
1734 -
1735 - // FIXME : fold this into updateNodes.
1736 - function updateHostState(hostData) {
1737 - updateHostLabel(hostData);
1738 } 1748 }
1739 1749
1740 function updateHostVisibility() { 1750 function updateHostVisibility() {
...@@ -1743,6 +1753,53 @@ ...@@ -1743,6 +1753,53 @@
1743 linkG.selectAll('.hostLink').style('visibility', v); 1753 linkG.selectAll('.hostLink').style('visibility', v);
1744 } 1754 }
1745 1755
1756 + function findOfflineNodes() {
1757 + var a = [];
1758 + network.nodes.forEach(function (d) {
1759 + if (d.class === 'device' && !d.online) {
1760 + a.push(d);
1761 + }
1762 + });
1763 + return a;
1764 + }
1765 +
1766 + function updateOfflineVisibility(dev) {
1767 + var so = showOffline,
1768 + sh = showHosts,
1769 + vb = 'visibility',
1770 + v, off, al, ah, db, b;
1771 +
1772 + function updAtt(show) {
1773 + al.forEach(function (d) {
1774 + b = show && ((d.type() !== 'hostLink') || sh);
1775 + d.el.style(vb, visVal(b));
1776 + });
1777 + ah.forEach(function (d) {
1778 + b = show && sh;
1779 + d.el.style(vb, visVal(b));
1780 + });
1781 + }
1782 +
1783 + if (dev) {
1784 + // updating a specific device that just toggled off/on-line
1785 + db = dev.online || so;
1786 + dev.el.style(vb, visVal(db));
1787 + al = findAttachedLinks(dev.id);
1788 + ah = findAttachedHosts(dev.id);
1789 + updAtt(db);
1790 + } else {
1791 + // updating all offline devices
1792 + v = visVal(so);
1793 + off = findOfflineNodes();
1794 + off.forEach(function (d) {
1795 + d.el.style(vb, v);
1796 + al = findAttachedLinks(d.id);
1797 + ah = findAttachedHosts(d.id);
1798 + updAtt(so);
1799 + });
1800 + }
1801 + }
1802 +
1746 function nodeMouseOver(d) { 1803 function nodeMouseOver(d) {
1747 hovered = d; 1804 hovered = d;
1748 requestTrafficForMode(); 1805 requestTrafficForMode();
...@@ -1779,8 +1836,8 @@ ...@@ -1779,8 +1836,8 @@
1779 }); 1836 });
1780 1837
1781 node.filter('.host').each(function (d) { 1838 node.filter('.host').each(function (d) {
1782 - var node = d.el; 1839 + updateHostLabel(d);
1783 - // TODO: appropriate update of host visuals 1840 + positionNode(d, true);
1784 }); 1841 });
1785 1842
1786 // operate on entering nodes: 1843 // operate on entering nodes:
......