Documentacion agregada - previo a la presentacion

[VSoRC/.git] / js / topology / topology.js

diff --git a/js/topology/topology.js b/js/topology/topology.js
index c2baab70821adc21ce78f442b4e546ddaba5865c..7808f33e749c1669a366302c2c42f9b66bfb6e13 100644 (file)
--- a/js/topology/topology.js
+++ b/js/topology/topology.js
@@ -43,6 +43,14 @@ $(function () {
     //          "port": {"source": "00000003", "target": "00000002"}, "value": 4},
     //       ...
     //     ]}
+function displayMessage(msg) {
+    var $x = $("#snackbar");
+    $x.text(msg)
+    $x.toggleClass("show");
+    setTimeout(function () { $x.toggleClass("show"); }, 3000);
+}
+
+
     function toGraph(top) {
         var nodes = [];
         var links = [];
@@ -74,8 +82,9 @@ $(function () {
         }
 
         lst = top.hosts;
+        console.log(top.hosts);
         for (var i = 0; i < lst.length; i++) {
-            nodes.push({ "id": lst[i].mac, "type": "host" });
+            nodes.push({ "id": lst[i].mac, "type": "host","ip": lst[i].ipv4});
             links.push({
                 "source": lst[i].port.dpid, "target": lst[i].mac, "value": 2,
                 "port": { "source": lst[i].port.port_no, "target": 0 }
@@ -139,7 +148,7 @@ $(function () {
         node.append("image")
             .attr("xlink:href", function (d) {
                 if (d.type === "switch") {
-                    return "img/switch.svg"
+                    return "img/switch.png"
                 } else if (d.type === "cloud") {
                     return "img/cloud.svg"
                 } else {
@@ -153,6 +162,12 @@ $(function () {
             .attr("class", "label")
             .attr("dy", size + 14)
             .text(function (d) { return d.id; });
+
+
+       node.append("text")
+            .attr("class", "label")
+            .attr("dy", size + 26)
+            .text(function (d) { if (d.type === "host")return (d.ip); });
             // .text(function (d) { return d.id.replace(/^0+/, ''); });
 
 
@@ -276,7 +291,7 @@ $(function () {
 
     function getTopology() {
         tabObj.buildTabs("#main", ["Graph", "Tables"], "Nothing to show!");
-        var $svg = $('<svg width="1116" height="600"></svg>');
+        var $svg = $('<svg width="800" height="600"></svg>');
         var $data = $('<div id="data"></div>');
         tabObj.buildContent('Graph', $svg);
         tabObj.buildContent('Tables', $data);
@@ -284,25 +299,24 @@ $(function () {
 
 
 
-
+// La funcion jsonget fue creada para sustituir el metodo json de D3
 
         function jsonget() {
-
           let xhr = new XMLHttpRequest();
           xhr.open('GET', "/gettopo" , true);
           //console.log(xhr); //para ver en la consola
           xhr.onload = function() {
             if (xhr.status == 200) { //can use this.status instead
               //console.log(xhr.responseText);// para ver en la consola
-
-              listTopology(JSON.parse(xhr.responseText));
+               if(xhr.response === null || xhr.response === ""){
+               displayMessage("No response from controller")
+               }
               plotGraph(toGraph(JSON.parse(xhr.responseText)));
             }
           }
           xhr.send();
         }
-
-        jsonget();
+      jsonget();