X-Git-Url: https://git.josue.xyz/?a=blobdiff_plain;f=js%2Ftopology%2Ftopology.js;h=7808f33e749c1669a366302c2c42f9b66bfb6e13;hb=8bd25d906f766566ceee02d3d70e9890689a4c1a;hp=eb1d8d1e80aff94b9c842a811d9481190a8e9836;hpb=1f2664ee622668b8d63ea5aba76e574d56677c20;p=VSoRC%2F.git

diff --git a/js/topology/topology.js b/js/topology/topology.js
index eb1d8d1..7808f33 100644
--- a/js/topology/topology.js
+++ b/js/topology/topology.js
@@ -43,11 +43,20 @@ $(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 = [];
 
         var lst = top.switches;
+
         for (var i = 0; i < lst.length; i++) {
             nodes.push({ "id": lst[i].dpid, "type": "switch" });
         }
@@ -73,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 }
@@ -138,11 +148,11 @@ $(function () {
         node.append("image")
             .attr("xlink:href", function (d) {
                 if (d.type === "switch") {
-                    return "/home/img/switch.svg"
+                    return "img/switch.png"
                 } else if (d.type === "cloud") {
-                    return "/home/img/cloud.svg"
+                    return "img/cloud.svg"
                 } else {
-                    return "/home/img/pc.svg"
+                    return "img/pc.svg"
                 }
             })
             .on("mouseover", handleMouseOver)
@@ -152,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+/, ''); });
 
 
@@ -275,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);
@@ -283,25 +299,24 @@ $(function () {
 
 
 
-
+// La funcion jsonget fue creada para sustituir el metodo json de D3
 
         function jsonget() {
-          const url = "http://"+location.hostname+":8080/topology"
           let xhr = new XMLHttpRequest();
-          xhr.open('GET', url , true);
+          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
-              data = JSON.parse(xhr.responseText)
-              listTopology(data)
-              plotGraph(toGraph(data));
+		if(xhr.response === null || xhr.response === ""){
+		displayMessage("No response from controller")
+		}
+              plotGraph(toGraph(JSON.parse(xhr.responseText)));
             }
           }
           xhr.send();
         }
-
-        jsonget();
+      jsonget();