1 var API_HOST
= "http://127.0.0.1:5001";
2 var ERROR_ALERT
= false;
5 var LATENESS_UPDATE_INTERVAL
= 50;
6 var DATA_UPDATE_INTERVAL
= 1000 * 10;
7 var LAST_UPDATE_TIMESTAMP_CONTAINER
= 0;
8 var LAST_UPDATE_TIMESTAMP_DATACENTER
= 0;
11 function update_lateness_loop() {
12 lateness_datacenter
= (Date
.now() - LAST_UPDATE_TIMESTAMP_DATACENTER
) / 1000;
13 $("#lbl_lateness_datacenter").text("Lateness: " + Number(lateness_datacenter
).toPrecision(3) + "s");
14 lateness_container
= (Date
.now() - LAST_UPDATE_TIMESTAMP_CONTAINER
) / 1000;
15 $("#lbl_lateness_container").text("Lateness: " + Number(lateness_container
).toPrecision(3) + "s");
16 // loop while connected
18 setTimeout(update_lateness_loop
, LATENESS_UPDATE_INTERVAL
)
22 function errorAjaxConnection()
29 alert("ERROR!\nAPI request failed.\n\n Please check the backend connection.", function() {
37 function update_table_datacenter(data
)
41 $("#table_datacenter").empty();
43 $("#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>');
45 $.each(data
, function(i
, item
) {
47 row_str
+= '<tr class="tbl-row clickable_row" id="datacenter_row_' + i
+'">';
48 row_str
+= '<td>' + item
.label
+ '1</td>';
49 row_str
+= '<td>' + item
.internalname
+ '</td>';
50 row_str
+= '<td>' + item
.switch + '</td>';
51 row_str
+= '<td><span class="badge">' + item
.n_running_containers
+ '</span></td>';
52 //row_str += '<td><span class="badge">' + Object.keys(item.metadata).length + '</span></td>';
53 row_str
+= '<td>' + item
.vnf_list
+ '</span></td>';
55 $("#table_datacenter").append(row_str
);
57 $("#lbl_datacenter_count").text(data
.length
);
58 // update lateness counter
59 LAST_UPDATE_TIMESTAMP_DATACENTER
= Date
.now();
63 function update_table_container(data
)
67 $("#table_container").empty();
69 $("#table_container").append('<tr class="tbl-head"><td>Datacenter</td><td>Container</td><td>Image</td><td>docker0</td><td>Status</td></tr>');
71 $.each(data
, function(i
, item
) {
73 row_str
+= '<tr class="tbl-row clickable_row" id="container_row_' + i
+'">';
74 row_str
+= '<td>' + item
[1].datacenter
+ '</td>';
75 row_str
+= '<td>' + item
[0] + '</td>';
76 row_str
+= '<td>' + item
[1].image
+ '</td>';
77 row_str
+= '<td><code>' + item
[1].docker_network
+ '<code></td>';
78 if(item
[1].state
.Status
== "running")
79 row_str
+= '<td><span class="label label-success">running</span></td>';
81 row_str
+= '<td><span class="label label-danger">stopped</span></td>';
83 $("#table_container").append(row_str
);
85 $("#lbl_container_count").text(data
.length
);
86 // update lateness counter
87 LAST_UPDATE_TIMESTAMP_CONTAINER
= Date
.now();
91 function fetch_datacenter()
93 // do HTTP request and trigger gui update on success
94 var request_url
= API_HOST
+ "/restapi/datacenter";
95 console
.debug("fetching from: " + request_url
);
96 $.getJSON(request_url
, update_table_datacenter
);
100 function fetch_container()
102 // do HTTP request and trigger gui update on success
103 var request_url
= API_HOST
+ "/restapi/compute";
104 console
.debug("fetching from: " + request_url
);
105 $.getJSON(request_url
, update_table_container
);
109 function fetch_d3graph()
111 // do HTTP request and trigger gui update on success
112 var request_url
= API_HOST
+ "/restapi/network/d3jsgraph";
113 console
.debug("fetching from: " + request_url
);
114 //$.getJSON(request_url, update_graph);
117 function fetch_loop()
119 // only fetch if we are connected
127 // loop while connected
129 setTimeout(fetch_loop
, DATA_UPDATE_INTERVAL
);
135 console
.info("connect()");
137 API_HOST
= "http://" + $("#text_api_host").val();
138 console
.debug("API address: " + API_HOST
);
140 LAST_UPDATE_TIMESTAMP_DATACENTER
= Date
.now();
141 LAST_UPDATE_TIMESTAMP_CONTAINER
= Date
.now();
143 // restart lateness counter
144 update_lateness_loop();
145 // restart data fetch loop
148 $("#btn_disconnect").removeClass("disabled");
149 $("#btn_connect").addClass("disabled");
152 function disconnect()
154 console
.info("disconnect()");
157 $("#btn_connect").removeClass("disabled");
158 $("#btn_disconnect").addClass("disabled");
162 $(document
).ready(function(){
163 console
.info("document ready");
164 // setup global connection error handling
167 "error": errorAjaxConnection
171 $("#btn_connect").click(connect);
172 $("#btn_disconnect").click(disconnect);
174 setTimeout(fetch_datacenter
, 1000);//fetch_datacenter();
175 setTimeout(fetch_container
, 2000);//fetch_container();
178 // additional refresh on window focus
179 $(window
).focus(function () {