GUI -- TopoView - Port numbers now appear when hovering over a link.
- (but they are centered on the node -- still need to move them away from the node).

Change-Id: I491851ef2f4d31b85db0dbc2b3145218a4913844
diff --git a/web/gui/src/main/webapp/app/view/topo/topoD3.js b/web/gui/src/main/webapp/app/view/topo/topoD3.js
index a555ac1..7017a75 100644
--- a/web/gui/src/main/webapp/app/view/topo/topoD3.js
+++ b/web/gui/src/main/webapp/app/view/topo/topoD3.js
@@ -413,6 +413,27 @@
         return sus.translate(xMid, yMid);
     }
 
+    function applyPortLabels(data, portLabelG) {
+        var entering = portLabelG.selectAll('.portLabel')
+            .data(data).enter().append('g')
+            .classed('portLabel', true)
+            .attr('id', function (d) { return d.id; });
+
+        entering.each(function (d) {
+            var el = d3.select(this),
+                rect = el.append('rect'),
+                text = el.append('text').text(d.num);
+
+            rect.attr(rectAroundText(el));
+            text.attr('dy', linkLabelOffset);
+            el.attr('transform', transformPort(d));
+        });
+    }
+
+    function transformPort(d) {
+        // TODO: offset along the link, away from the node
+        return sus.translate(d.baseX, d.baseY);
+    }
 
     // ==========================
     // Module definition
@@ -459,8 +480,8 @@
 
                 linkEntering: linkEntering,
                 applyLinkLabels: applyLinkLabels,
-
-                transformLabel: transformLabel
+                transformLabel: transformLabel,
+                applyPortLabels: applyPortLabels
             };
         }]);
 }());