X-Git-Url: https://osm.etsi.org/gitweb/?a=blobdiff_plain;f=src%2Femuvim%2Fdashboard%2Fjs%2Fmain.js;h=19169accf4094d83a40458751031cb09abe0d263;hb=1662236de1bcda8b2eaf8194f00bbce19fb96be4;hp=71741f2e2c07200f0e56366c321bb8f62e83dc9e;hpb=5b876700bdef500e17c212f5b0bcea5383e44528;p=osm%2Fvim-emu.git

diff --git a/src/emuvim/dashboard/js/main.js b/src/emuvim/dashboard/js/main.js
index 71741f2..19169ac 100755
--- a/src/emuvim/dashboard/js/main.js
+++ b/src/emuvim/dashboard/js/main.js
@@ -1,3 +1,30 @@
+/*
+ Copyright (c) 2017 SONATA-NFV and Paderborn University
+ ALL RIGHTS RESERVED.
+ 
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+ Neither the name of the SONATA-NFV, Paderborn University
+ nor the names of its contributors may be used to endorse or promote
+ products derived from this software without specific prior written
+ permission.
+
+ This work has been performed in the framework of the SONATA project,
+ funded by the European Commission under Grant number 671517 through
+ the Horizon 2020 and 5G-PPP programmes. The authors would like to
+ acknowledge the contributions of their colleagues of the SONATA
+ partner consortium (www.sonata-nfv.eu).
+*/
 var API_HOST = "http://127.0.0.1:5001";
 var ERROR_ALERT = false;
 var TIMESTAMP = 0;
@@ -40,7 +67,7 @@ function update_table_datacenter(data)
     // clear table
     $("#table_datacenter").empty();
     // header
-    $("#table_datacenter").append('<tr class="tbl-head"><td>Label</td><td>Int. Name</td><td>Switch</td><td>Num. Containers</td><td>Metadata Items</td></tr>');
+    $("#table_datacenter").append('<tr class="tbl-head"><td>Label</td><td>Int. Name</td><td>Switch</td><td>Num. Containers</td><td>VNFs</td></tr>');
     // fill table
     $.each(data, function(i, item) {
         var row_str = "";
@@ -49,7 +76,8 @@ function update_table_datacenter(data)
         row_str += '<td>' + item.internalname + '</td>';
         row_str += '<td>' + item.switch + '</td>';
         row_str += '<td><span class="badge">' + item.n_running_containers + '</span></td>';
-        row_str += '<td><span class="badge">' + Object.keys(item.metadata).length + '</span></td>';
+        //row_str += '<td><span class="badge">' + Object.keys(item.metadata).length + '</span></td>';
+        row_str += '<td>' + item.vnf_list + '</span></td>';
         row_str += '<tr>';
 	$("#table_datacenter").append(row_str);
     });
@@ -65,27 +93,43 @@ function update_table_container(data)
     // clear table
     $("#table_container").empty();
     // header
-    $("#table_container").append('<tr class="tbl-head"><td>Datacenter</td><td>Container</td><td>Image</td><td>docker0</td><td>Status</td></tr>');
+    $("#table_container").append('<tr class="tbl-head"><td>Datacenter</td><td>Container</td><td>Image</td><td>docker0</td><td>--Networking--<div id="table_network"></div></td></tr>');
     // fill table
     $.each(data, function(i, item) {
         var row_str = "";
-        row_str += '<tr class="tbl-row clickable_row" id="container_row_' + i +'">';
+        row_str += '<tr class="tbl-row clickable_row" id="container_row_' + item[0] +'">';
         row_str += '<td>' + item[1].datacenter + '</td>';
         row_str += '<td>' + item[0] + '</td>';
         row_str += '<td>' + item[1].image + '</td>';
-        row_str += '<td><code>' + item[1].docker_network + '<code></td>';
-        if(item[1].state.Status == "running")
-            row_str += '<td><span class="label label-success">running</span></td>';
-        else
-            row_str += '<td><span class="label label-danger">stopped</span></td>';
-        row_str += '<tr>';
-	$("#table_container").append(row_str);
+        row_str += '<td><code>' + item[1].docker_network + '</code></td>';
+        row_str += '<td><table class="interface_table" id="network_list_' + item[0] + '">';
+        //row_str += build_network_table(item[1].network, item[0]);
+        row_str += '</table></td>';
+        row_str += '</tr>';
+	    $("#table_container").append(row_str);
+	    build_network_table(item[1].network, item[0]);
     });
     $("#lbl_container_count").text(data.length);
+    $("#table_network").append('<table class="interface_table"><tr class="interface_row"><td class="interface_port">datacenter port</td><td class="interface_name">interface</td><td class="interface_ip">ip</td><td class="interface_mac">mac</td></tr></table>')
     // update lateness counter
     LAST_UPDATE_TIMESTAMP_CONTAINER = Date.now();
 }
 
+function build_network_table(network_list, id)
+{
+    console.debug('network list ' + id)
+    console.debug(network_list)
+    var row_str = "";
+    network_list.forEach(function(interface) {
+        row_str += '<tr class="interface_row">';
+        row_str += '<td class="interface_port">' + interface.dc_portname + '</td>';
+        row_str += '<td class="interface_name">' + interface.intf_name + '</td>';
+        row_str += '<td class="interface_ip">' + interface.ip + '</td>';
+        row_str += '<td class="interface_mac">' + interface.mac + '</td>';
+        row_str += '</tr>';
+    });
+    $("#network_list_" + id).append(row_str)
+}
 
 function fetch_datacenter()
 {
@@ -105,6 +149,14 @@ function fetch_container()
 }
 
 
+function fetch_d3graph()
+{
+    // do HTTP request and trigger gui update on success
+    var request_url = API_HOST + "/restapi/network/d3jsgraph";
+    console.debug("fetching from: " + request_url);
+    //$.getJSON(request_url,  update_graph);
+}
+
 function fetch_loop()
 {
     // only fetch if we are connected
@@ -153,6 +205,7 @@ function disconnect()
 $(document).ready(function(){
     console.info("document ready");
     // setup global connection error handling
+    /*
     $.ajaxSetup({
         "error": errorAjaxConnection
     });
@@ -160,6 +213,10 @@ $(document).ready(function(){
     // add listeners
     $("#btn_connect").click(connect);
     $("#btn_disconnect").click(disconnect);
+    */
+    setTimeout(fetch_datacenter, 500);//fetch_datacenter();
+    setTimeout(fetch_container, 1000);//fetch_container();
+
 
     // additional refresh on window focus
     $(window).focus(function () {