3 function getIntentInfos(){
\r
6 url: "/restconf/config/nemo-intent:users/",
\r
10 success: function(data) {
\r
15 error: function(data) {
\r
17 alert('Get IntentInfo Error!');
\r
24 function getIntentDatas(){
\r
25 var Datas=getIntentInfos();
\r
30 //return virtualDatas;
\r
35 function getIntentInfoById(user_id,Data){
\r
37 if(!Data) Data=IntentInfos;
\r
39 if(typeof(Data)=='string'){
\r
40 var user_json = JSON.parse(Data);
\r
44 var user_json = Data;
\r
47 console.log(user_json);
\r
48 var user_info = user_json['users']['user'];
\r
49 for(var item in user_info){
\r
50 if(user_id==user_info[item]['user-id']){
\r
51 return user_info[item];
\r
56 function getIntentInfoByName(user_name,Data){
\r
58 if(typeof(Data)=='string'){
\r
59 var user_json = JSON.parse(Data);
\r
63 var user_json = Data;
\r
65 // console.log(user_json);
\r
66 var user_info = user_json['users']['user'];
\r
67 for(var item in user_info){
\r
68 if(user_name==user_info[item]['user-name']){
\r
69 return user_info[item];
\r
76 function lead_policy(src_group, dest_group, flow_count_temp, color, id, chain_name, src_name, dest_name) {
\r
77 var cir_r = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("r"));
\r
80 src_cx = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("cx"));
\r
81 src_cy = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("cy"));
\r
82 dest_cx = parseInt(jQuery("#" + dest_group + " circle:eq(0)").attr("cx"));
\r
83 dest_cy = parseInt(jQuery("#" + dest_group + " circle:eq(0)").attr("cy"));
\r
84 console.log(src_cx + " " + src_cy + " " + dest_cx + " " + dest_cy);
\r
87 var tri_h = dest_cx - src_cx;
\r
88 var tri_l = src_cy - dest_cy;
\r
89 var tri_s = Math.sqrt(tri_l * tri_l + tri_h * tri_h);
\r
90 var deg = Math.asin(tri_l / tri_s);
\r
91 console.log(tri_h + " " + tri_l + " " + tri_s);
\r
97 var offset = ((20 + (15 * parseInt(flow_count_temp))) / 180) * Math.PI;
\r
98 console.log("temp: " + flow_count_temp + " offset: " + offset);
\r
100 //calculate path possition
\r
101 var path_src_x, path_src_y, path_dest_x, path_dest_y, mid_x, mid_y, b_x, b_y;
\r
103 mid_x = src_cx + tri_h / 2;
\r
104 mid_y = src_cy - tri_l / 2;
\r
105 path_src_x = src_cx + cir_r * (Math.cos(offset + deg));
\r
106 path_src_y = src_cy - cir_r * (Math.sin(offset + deg));
\r
107 path_dest_x = dest_cx - (cir_r + 14) * (Math.cos(offset - deg));
\r
108 path_dest_y = dest_cy - (cir_r + 14) * (Math.sin(offset - deg));
\r
110 b_x = mid_x - (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.sin(deg));;
\r
111 b_y = mid_y - (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.cos(deg));
\r
113 b_x = mid_x + (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.sin(deg));
\r
114 b_y = mid_y - (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.cos(deg));
\r
118 mid_x = src_cx + tri_h / 2;
\r
119 mid_y = src_cy - tri_l / 2;
\r
120 path_src_x = src_cx - cir_r * (Math.cos(offset - deg));
\r
121 path_src_y = src_cy + cir_r * (Math.sin(offset - deg));
\r
122 path_dest_x = dest_cx + (cir_r + 14) * (Math.cos(-offset - deg));
\r
123 path_dest_y = dest_cy - (cir_r + 14) * (Math.sin(-offset - deg));
\r
125 b_x = mid_x - (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.sin(deg));
\r
126 b_y = mid_y + (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.cos(deg));
\r
128 b_x = mid_x + (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.sin(deg));
\r
129 b_y = mid_y + (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.cos(deg));
\r
134 var path_title = document.createElementNS('http://www.w3.org/2000/svg', 'path');
\r
139 var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
\r
140 var path_main = jQuery(path).attr({
\r
142 node_start: src_name,
\r
143 node_end: dest_name,
\r
151 count: flow_count_temp,
\r
153 d: 'M' + path_src_x + " " + path_src_y + ' Q' + b_x + ' ' + b_y + ' ' + path_dest_x + ' ' + path_dest_y,
\r
157 'stroke-dasharray': "6,6",
\r
158 'marker-end': "url(#idArrow2)",
\r
159 'marker-mid': "url(#idtext2)"
\r
161 jQuery('#service_svg2').prepend(path_main);
\r
165 function get_path_color() {
\r
167 var num1 = Math.floor(Math.random() * 256);
\r
170 return num1.toString();
\r
174 function flow_get_end_name(src_ip, dest_ip) {
\r
175 var host_name = ['', ''];
\r
176 if (typeof(phy_host_ip[src_ip]) != "undefined")
\r
177 host_name[0] = phy_host_ip[src_ip];
\r
179 for (var find_ip_cursor = 0; find_ip_cursor < jQuery("#service_svg2 g").length; find_ip_cursor++) {
\r
180 if (jQuery("#service_svg2 g:eq(" + find_ip_cursor + ")").attr("ip-prefix") == src_ip) {
\r
181 host_name[0] = jQuery("#service_svg2 g:eq(" + find_ip_cursor + ")").attr("id");
\r
186 if (typeof(phy_host_ip[dest_ip]) != "undefined")
\r
187 host_name[1] = phy_host_ip[dest_ip];
\r
189 for (var find_ip_cursor = 0; find_ip_cursor < jQuery("#service_svg2 g").length; find_ip_cursor++) {
\r
190 if (jQuery("#service_svg2 g:eq(" + find_ip_cursor + ")").attr("ip-prefix") == dest_ip) {
\r
191 host_name[1] = jQuery("#service_svg2 g:eq(" + find_ip_cursor + ")").attr("id");
\r
196 console.log(host_name[0] + " " + host_name[1]);
\r
202 function flow_get_group(src_ip, dest_ip) {
\r
203 var src_host_name = flow_get_end_name(src_ip, dest_ip)[0];
\r
204 var dest_host_name = flow_get_end_name(src_ip, dest_ip)[1];
\r
205 var group_node = ['', ''];
\r
206 for (var i = 0; i < jQuery("#service_svg2 g").length; i++) {
\r
207 host_list = jQuery("#service_svg2 g:eq(" + i + ")").attr("sub").split(",");
\r
208 console.log(host_list);
\r
209 if (host_list[0] == '') {
\r
212 for (var j = 0; j < host_list.length; j++) {
\r
213 if (host_list[j] == src_host_name) {
\r
214 group_node[0] = jQuery("#service_svg2 g:eq(" + i + ")").attr("id");
\r
216 if (host_list[j] == dest_host_name) {
\r
217 group_node[1] = jQuery("#service_svg2 g:eq(" + i + ")").attr("id");
\r
220 if (group_node[0] != '' && group_node[1] != '')
\r
223 console.log("node: " + group_node[0] + " " + group_node[1]);
\r
227 function draw_flow_data(src_ip, dest_ip, flow_name) {
\r
228 var src_group = flow_get_group(src_ip, dest_ip)[0];
\r
229 var dest_group = flow_get_group(src_ip, dest_ip)[1];
\r
231 var flow_count_temp = 0;
\r
234 for (var find_count = 0; find_count < jQuery("#service_svg2 path").length; find_count++) {
\r
235 if (jQuery("#service_svg2 path:eq(" + find_count + ")").attr("type") != "flow")
\r
237 if (jQuery("#service_svg2 path:eq(" + find_count + ")").attr("node_start") == src_group && jQuery("#service_svg2 path:eq(" + find_count + ")").attr("node_end") == dest_group) {
\r
238 if (flow_count_temp == jQuery("#service_svg2 path:eq(" + find_count + ")").attr("count")) {
\r
253 var cir_r = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("r"));
\r
257 src_cx = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("cx"));
\r
258 src_cy = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("cy"));
\r
259 dest_cx = parseInt(jQuery("#" + dest_group + " circle:eq(0)").attr("cx"));
\r
260 dest_cy = parseInt(jQuery("#" + dest_group + " circle:eq(0)").attr("cy"));
\r
261 console.log(src_cx + " " + src_cy + " " + dest_cx + " " + dest_cy);
\r
264 var tri_h = dest_cx - src_cx;
\r
265 var tri_l = src_cy - dest_cy;
\r
266 var tri_s = Math.sqrt(tri_l * tri_l + tri_h * tri_h);
\r
267 var deg = Math.asin(tri_l / tri_s);
\r
268 console.log(tri_h + " " + tri_l + " " + tri_s);
\r
274 var offset = ((20 + (15 * flow_count_temp)) / 180) * Math.PI;
\r
275 console.log("offset: " + offset);
\r
277 //calculate path possition
\r
278 var path_src_x, path_src_y, path_dest_x, path_dest_y, mid_x, mid_y, b_x, b_y;
\r
280 mid_x = src_cx + tri_h / 2;
\r
281 mid_y = src_cy - tri_l / 2;
\r
282 path_src_x = src_cx + cir_r * (Math.cos(offset + deg));
\r
283 path_src_y = src_cy - cir_r * (Math.sin(offset + deg));
\r
284 path_dest_x = dest_cx - (cir_r + 14) * (Math.cos(offset - deg));
\r
285 path_dest_y = dest_cy - (cir_r + 14) * (Math.sin(offset - deg));
\r
287 b_x = mid_x - (80 + 30 * flow_count_temp) * Math.abs(Math.sin(deg));;
\r
288 b_y = mid_y - (80 + 30 * flow_count_temp) * Math.abs(Math.cos(deg));
\r
290 b_x = mid_x + (80 + 30 * flow_count_temp) * Math.abs(Math.sin(deg));
\r
291 b_y = mid_y - (80 + 30 * flow_count_temp) * Math.abs(Math.cos(deg));
\r
295 mid_x = src_cx + tri_h / 2;
\r
296 mid_y = src_cy - tri_l / 2;
\r
297 path_src_x = src_cx - cir_r * (Math.cos(offset - deg));
\r
298 path_src_y = src_cy + cir_r * (Math.sin(offset - deg));
\r
299 path_dest_x = dest_cx + (cir_r + 14) * (Math.cos(-offset - deg));
\r
300 path_dest_y = dest_cy - (cir_r + 14) * (Math.sin(-offset - deg));
\r
302 b_x = mid_x - (80 + 30 * flow_count_temp) * Math.abs(Math.sin(deg));
\r
303 b_y = mid_y + (80 + 30 * flow_count_temp) * Math.abs(Math.cos(deg));
\r
305 b_x = mid_x + (80 + 30 * flow_count_temp) * Math.abs(Math.sin(deg));
\r
306 b_y = mid_y + (80 + 30 * flow_count_temp) * Math.abs(Math.cos(deg));
\r
311 var path_title = document.createElementNS('http://www.w3.org/2000/svg', 'path');
\r
316 var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
\r
317 var path_main = jQuery(path).attr({
\r
319 node_start: src_group,
\r
320 node_end: dest_group,
\r
329 count: flow_count_temp,
\r
330 d: 'M' + path_src_x + " " + path_src_y + ' Q' + b_x + ' ' + b_y + ' ' + path_dest_x + ' ' + path_dest_y,
\r
331 'stroke': "rgb(" + get_path_color() + "," + get_path_color() + "," + get_path_color() + ")",
\r
334 'stroke-dasharray': "6,6",
\r
335 'marker-end': "url(#idArrow2)",
\r
336 'marker-mid': "url(#idtext2)"
\r
339 jQuery(path).attr("stroke", "rgb(" + get_path_color() + "," + get_path_color() + "," + get_path_color() + ")");
\r
340 else if (ne_flag == 1)
\r
341 jQuery(path).attr("stroke", old_color);
\r
342 jQuery('#service_svg2').prepend(path_main);
\r
347 function draw_connection_data(conn_name, node_name_1, node_name_2, bandwidth) {
\r
348 if (conn_name != null && typeof(conn_name) != "undefined")
\r
349 jQuery("#" + conn_name).remove();
\r
351 var node_cx_1 = jQuery("#" + node_name_1 + "_group").attr("cx");
\r
352 var node_cy_1 = jQuery("#" + node_name_1 + "_group").attr("cy");
\r
353 var node_cx_2 = jQuery("#" + node_name_2 + "_group").attr("cx");
\r
354 var node_cy_2 = jQuery("#" + node_name_2 + "_group").attr("cy");
\r
355 //var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
\r
356 var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
\r
357 var path_main = jQuery(path).attr({
\r
359 node_start: node_name_1,
\r
360 node_end: node_name_2,
\r
361 type: "connection",
\r
362 d: 'M' + node_cx_1 + " " + node_cy_1 + ' L' + node_cx_2 + ' ' + node_cy_2,
\r
364 'stroke-width': parseInt(bandwidth),
\r
367 jQuery('#service_svg2').prepend(path_main);
\r
373 function redraw_node_possition_data() {
\r
374 node_count = jQuery("#service_svg2 g").length;
\r
375 if (node_count == 1) {
\r
378 dis_x = x - jQuery("#service_svg2 g:eq(0) circle:eq(0)").attr("cx");
\r
379 dis_y = y - jQuery("#service_svg2 g:eq(0) circle:eq(0)").attr("cy");
\r
380 jQuery("#service_svg2 g:eq(0) circle:eq(0)").attr("cx", x);
\r
381 jQuery("#service_svg2 g:eq(0) circle:eq(0)").attr("cy", y);
\r
382 for (var j = 0; j < jQuery("#service_svg2 g:eq(0) rect").length; j++) {
\r
383 var last_x = parseInt(jQuery("#service_svg2 g:eq(0) rect:eq(" + j + ")").attr("x"));
\r
384 var last_y = parseInt(jQuery("#service_svg2 g:eq(0) rect:eq(" + j + ")").attr("y"));
\r
385 jQuery("#service_svg2 g:eq(0) rect:eq(" + j + ")").attr("x", last_x + dis_x);
\r
386 jQuery("#service_svg2 g:eq(0) rect:eq(" + j + ")").attr("y", last_y + dis_y);
\r
388 for (var j = 0; j < jQuery("#service_svg2 g:eq(0) text").length; j++) {
\r
389 jQuery("#service_svg2 g:eq(0) text:eq(" + j + ")").attr("x", parseInt(jQuery("#service_svg2 g:eq(0) text:eq(" + j + ")").attr("x")) + dis_x);
\r
390 jQuery("#service_svg2 g:eq(0) text:eq(" + j + ")").attr("y", parseInt(jQuery("#service_svg2 g:eq(0) text:eq(" + j + ")").attr("y")) + dis_y);
\r
396 var res = calculatePos(node_count);
\r
398 for (var i = 0; i < node_count; i++) {
\r
400 var x = 550 + Math.cos(deg) * r;
\r
401 var y = 450 - Math.sin(deg) * r;
\r
402 dis_x = x - parseInt(jQuery("#service_svg2 g:eq(" + i + ") circle:eq(0)").attr("cx"));
\r
403 dis_y = y - parseInt(jQuery("#service_svg2 g:eq(" + i + ") circle:eq(0)").attr("cy"));
\r
404 jQuery("#service_svg2 g:eq(" + i + ") circle:eq(0)").attr("cx", x);
\r
405 jQuery("#service_svg2 g:eq(" + i + ") circle:eq(0)").attr("cy", y);
\r
406 for (var j = 0; j < jQuery("#service_svg2 g:eq(" + i + ") rect").length; j++) {
\r
407 jQuery("#service_svg2 g:eq(" + i + ") rect:eq(" + j + ")").attr("x", parseInt(jQuery("#service_svg2 g:eq(" + i + ") rect:eq(" + j + ")").attr("x")) + dis_x);
\r
408 jQuery("#service_svg2 g:eq(" + i + ") rect:eq(" + j + ")").attr("y", parseInt(jQuery("#service_svg2 g:eq(" + i + ") rect:eq(" + j + ")").attr("y")) + dis_y);
\r
410 for (var j = 0; j < jQuery("#service_svg2 g:eq(" + i + ") text").length; j++) {
\r
411 jQuery("#service_svg2 g:eq(" + i + ") text:eq(" + j + ")").attr("x", parseInt(jQuery("#service_svg2 g:eq(" + i + ") text:eq(" + j + ")").attr("x")) + dis_x);
\r
412 jQuery("#service_svg2 g:eq(" + i + ") text:eq(" + j + ")").attr("y", parseInt(jQuery("#service_svg2 g:eq(" + i + ") text:eq(" + j + ")").attr("y")) + dis_y);
\r
419 function draw_group_data(node_name, node_number, node_list, node_type, ip) {
\r
420 // alert("type:"+node_type);
\r
421 var circle_x = 550;
\r
422 var circle_y = 450;
\r
423 if (node_number == 0) {
\r
424 var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
\r
425 var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
\r
426 var inCircle1_main = jQuery(circle_main).attr({
\r
427 id: node_name + "_group",
\r
435 var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
436 var text1_main = jQuery(text1).attr({
\r
437 id: node_name + "_title1",
\r
441 'text-anchor': 'middle',
\r
443 "stroke-width": 0.8
\r
446 jQuery(text1).text(node_type);
\r
447 var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
448 var text2_main = jQuery(text2).attr({
\r
449 id: node_name + "_title2",
\r
453 'text-anchor': 'middle'
\r
455 jQuery(text2).text(node_name);
\r
456 var g_main = jQuery(g).append(inCircle1_main);
\r
457 jQuery(g).append(text1_main);
\r
458 jQuery(g).append(text2_main);
\r
459 jQuery(g).attr("id", node_name);
\r
460 jQuery(g).attr("type", node_type);
\r
461 if (node_type != "ext-group")
\r
462 jQuery(g).attr("sub", "");
\r
464 jQuery(g).attr("sub", node_name);
\r
465 jQuery(g).attr("ip-prefix", ip);
\r
466 //ext_ip[jQuery("#ext-group_ip-prefix").val().trim()] = jQuery("#node_name").val().trim();
\r
469 if (node_type.indexOf("chain") > -1)
\r
470 jQuery(g).attr("flow", 0);
\r
471 console.log(g_main);
\r
472 jQuery('#service_svg2').append(g_main);
\r
473 console.log(jQuery('#service_svg2').html())
\r
474 } else if (node_number == 1) {
\r
475 var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
\r
476 var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
\r
477 var inCircle1_main = jQuery(circle_main).attr({
\r
478 id: node_name + "_group",
\r
486 var host1 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
\r
487 var host1_main = jQuery(host1).attr({
\r
497 var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
498 var text1_main = jQuery(text1).attr({
\r
499 id: node_name + "_title1",
\r
503 'text-anchor': 'middle',
\r
505 "stroke-width": 0.8
\r
507 jQuery(text1).text(node_type);
\r
508 var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
509 var text2_main = jQuery(text2).attr({
\r
510 id: node_name + "_title2",
\r
514 'text-anchor': 'middle'
\r
516 jQuery(text2).text(node_name);
\r
517 var text3 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
518 var text3_main = jQuery(text3).attr({
\r
519 id: node_list[0] + '_text',
\r
523 'text-anchor': 'middle'
\r
525 jQuery(text3).text(node_list[0]);
\r
526 var g_main = jQuery(g).append(inCircle1_main);
\r
527 jQuery(g).append(host1_main);
\r
528 jQuery(g).append(text1_main);
\r
529 jQuery(g).append(text2_main);
\r
530 jQuery(g).append(text3_main);
\r
531 jQuery(g).attr("id", node_name);
\r
532 jQuery(g).attr("type", node_type);
\r
533 jQuery(g).attr("sub", node_list[0]);
\r
534 if (node_type.indexOf("chain") > -1)
\r
535 jQuery(g).attr("flow", 0);
\r
536 jQuery('#service_svg2').append(g_main);
\r
537 } else if (node_number == 2) {
\r
538 var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
\r
539 var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
\r
540 var inCircle1_main = jQuery(circle_main).attr({
\r
541 id: node_name + "_group",
\r
549 var host1 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
\r
550 var host1_main = jQuery(host1).attr({
\r
560 var host2 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
\r
561 var host2_main = jQuery(host2).attr({
\r
571 var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
572 var text1_main = jQuery(text1).attr({
\r
573 id: node_name + "_title1",
\r
577 'text-anchor': 'middle',
\r
579 "stroke-width": 0.8
\r
581 jQuery(text1).text(node_type);
\r
582 var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
583 var text2_main = jQuery(text2).attr({
\r
584 id: node_name + "_title2",
\r
588 'text-anchor': 'middle'
\r
590 jQuery(text2).text(node_name);
\r
591 var text3 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
592 var text3_main = jQuery(text3).attr({
\r
593 id: node_list[0] + "_text",
\r
597 'text-anchor': 'middle'
\r
599 jQuery(text3).text(node_list[0]);
\r
600 var text4 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
601 var text4_main = jQuery(text4).attr({
\r
602 id: node_list[1] + "_text",
\r
606 'text-anchor': 'middle'
\r
608 jQuery(text4).text(node_list[1]);
\r
609 var g_main = jQuery(g).append(inCircle1_main);
\r
610 jQuery(g).append(host1_main);
\r
611 jQuery(g).append(host2_main);
\r
612 jQuery(g).append(text1_main);
\r
613 jQuery(g).append(text2_main);
\r
614 jQuery(g).append(text3_main);
\r
615 jQuery(g).append(text4_main);
\r
616 jQuery(g).attr("id", node_name);
\r
617 jQuery(g).attr("type", node_type);
\r
618 jQuery(g).attr("sub", node_list[0] + "," + node_list[1]);
\r
619 if (node_type.indexOf("chain") > -1)
\r
620 jQuery(g).attr("flow", 0);
\r
621 jQuery('#service_svg2').append(g);
\r
623 } else if (node_number == 3) {
\r
624 var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
\r
625 var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
\r
626 var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
\r
627 var inCircle1_main = jQuery(circle_main).attr({
\r
628 id: node_name + "_group",
\r
636 var host1 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
\r
637 var host1_main = jQuery(host1).attr({
\r
647 var host2 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
\r
648 var host2_main = jQuery(host2).attr({
\r
658 var host3 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');
\r
659 var host3_main = jQuery(host3).attr({
\r
669 var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
670 var text1_main = jQuery(text1).attr({
\r
671 id: node_name + "_title1",
\r
675 'text-anchor': 'middle',
\r
677 "stroke-width": 0.8
\r
679 jQuery(text1).text(node_type);
\r
680 var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
681 var text2_main = jQuery(text2).attr({
\r
682 id: node_name + "_title2",
\r
686 'text-anchor': 'middle'
\r
688 jQuery(text2).text(node_name);
\r
689 var text3 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
690 var text3_main = jQuery(text3).attr({
\r
691 id: node_list[0] + '_text',
\r
695 'text-anchor': 'middle'
\r
697 jQuery(text3).text(node_list[0]);
\r
698 var text4 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
699 var text4_main = jQuery(text4).attr({
\r
700 id: node_list[1] + '_text',
\r
704 'text-anchor': 'middle'
\r
706 jQuery(text4).text(node_list[1]);
\r
707 var text5 = document.createElementNS('http://www.w3.org/2000/svg', 'text');
\r
708 var text5_main = jQuery(text5).attr({
\r
709 id: node_list[2] + '_text',
\r
713 'text-anchor': 'middle'
\r
715 jQuery(text5).text(node_list[2]);
\r
716 var g_main = jQuery(g).append(inCircle1_main);
\r
717 jQuery(g).append(host1_main);
\r
718 jQuery(g).append(host2_main);
\r
719 jQuery(g).append(host3_main);
\r
720 jQuery(g).append(text1_main);
\r
721 jQuery(g).append(text2_main);
\r
722 jQuery(g).append(text3_main);
\r
723 jQuery(g).append(text4_main);
\r
724 jQuery(g).append(text5_main);
\r
725 jQuery(g).attr("id", node_name);
\r
726 jQuery(g).attr("type", node_type);
\r
727 jQuery(g).attr("sub", node_list[0] + "," + node_list[1] + "," + node_list[2]);
\r
728 if (node_type.indexOf("chain") > -1)
\r
729 jQuery(g).attr("flow", 0);
\r
730 jQuery('#service_svg2').append(g);
\r
734 function analyjson_topo(user_data) {
\r
735 //jQuery("#service_svg2").show();
\r
736 //jQuery("#service_svg").hide();
\r
737 //jQuery("#graph").hide();
\r
738 //jQuery("#service_svg").empty();
\r
739 // var username = jQuery("#getUserName").val();
\r
741 var html_init = '<defs><marker id="idArrow2" viewBox="0 0 20 20" refX="0" refY="10" markerUnits="strokeWidth" markerWidth="6" markerHeight="15" orient="auto"><path d="M 0 0 L 20 10 L0 20 z"fill="purple"stroke="black"/> </marker>\
\r
742 <marker id="idtext2" viewBox="0 0 120 50" refX="0" refY="0" markerUnits="strokeWidth" markerWidth="20" markerHeight="20" orient="auto"><text style="font-family:sans-serif; font-size:14pt;" x="20" y="20">text</text></marker></defs>';
\r
743 jQuery("#service_svg2").html(html_init);
\r
746 // url: "/restconf/config/nemo-intent:users/",
\r
749 // dataType: "json",
\r
750 // success: function(data) {
\r
751 // console.log(data);
\r
752 // topo_data = data;
\r
754 // error: function(data) {
\r
755 // console.log(data);
\r
759 //var name_data_list = topo_data["users"]["user"];
\r
761 //var user_json_data, user_data;
\r
762 // for (var i in name_data_list) {
\r
763 // if (name_data_list[i]["user-name"] == username) {
\r
764 // user_data = name_data_list[i];
\r
765 // user_json_data = name_data_list[i]["objects"];
\r
770 var user_json_data = user_data['objects'];
\r
771 if (user_json_data == null)
\r
775 var host_list = [];
\r
776 for (var host_cursor in user_json_data["node"]) {
\r
777 if (user_json_data["node"][host_cursor]["node-type"] != "host")
\r
779 host_list[user_json_data["node"][host_cursor]["node-id"]] = user_json_data["node"][host_cursor]["node-name"];
\r
785 for (var vas_cursor in user_json_data["node"]) {
\r
786 if (user_json_data["node"][vas_cursor]["node-type"] != "cache" && user_json_data["node"][vas_cursor]["node-type"] != "fw" && user_json_data["node"][vas_cursor]["node-type"] != "lb")
\r
789 vas_list[user_json_data["node"][vas_cursor]["node-id"]] = user_json_data["node"][vas_cursor]["node-name"];
\r
795 var node_list = [];
\r
798 for (var lgroup_cursor in user_json_data["node"]) {
\r
799 if (user_json_data["node"][lgroup_cursor]["node-type"] != "l2-group" && user_json_data["node"][lgroup_cursor]["node-type"] != "l3-group")
\r
803 for (var sub_cursor in user_json_data["node"][lgroup_cursor]["sub-node"]) {
\r
804 sub_list[sub_count] = host_list[user_json_data["node"][lgroup_cursor]["sub-node"][sub_cursor]["node-id"]];
\r
807 draw_group_data(user_json_data["node"][lgroup_cursor]["node-name"], sub_list.length, sub_list, user_json_data["node"][lgroup_cursor]["node-type"], "");
\r
808 redraw_node_possition_data();
\r
809 node_list[user_json_data["node"][lgroup_cursor]["node-id"]] = user_json_data["node"][lgroup_cursor]["node-name"];
\r
812 for (var cgroup_cursor in user_json_data["node"]) {
\r
814 if (user_json_data["node"][cgroup_cursor]["node-type"] != "chain-group")
\r
819 for (var sub_cursor in user_json_data["node"][cgroup_cursor]["sub-node"]) {
\r
820 //alert(user_json_data["node"][cgroup_cursor]["sub-node"][sub_cursor]["node-id"]);
\r
821 sub_list[sub_count] = vas_list[user_json_data["node"][cgroup_cursor]["sub-node"][sub_cursor]["node-id"]];
\r
825 draw_group_data(user_json_data["node"][cgroup_cursor]["node-name"], sub_list.length, sub_list, user_json_data["node"][cgroup_cursor]["node-type"], "");
\r
826 redraw_node_possition_data();
\r
827 node_list[user_json_data["node"][cgroup_cursor]["node-id"]] = user_json_data["node"][cgroup_cursor]["node-name"];
\r
830 for (var egroup_cursor in user_json_data["node"]) {
\r
831 if (user_json_data["node"][egroup_cursor]["node-type"] != "ext-group")
\r
835 for (var ip_cursor in user_json_data["node"][egroup_cursor]["property"]) {
\r
836 if (user_json_data["node"][egroup_cursor]["property"][ip_cursor]["property-name"] == "ip-prefix") {
\r
837 ip = user_json_data["node"][egroup_cursor]["property"][ip_cursor]["property-values"]["string-value"][0]["value"];
\r
840 draw_group_data(user_json_data["node"][egroup_cursor]["node-name"], 0, '', user_json_data["node"][egroup_cursor]["node-type"], ip);
\r
841 redraw_node_possition_data();
\r
842 node_list[user_json_data["node"][egroup_cursor]["node-id"]] = user_json_data["node"][egroup_cursor]["node-name"];
\r
844 // console.log(node_list);
\r
846 for (var conn_cursor in user_json_data["connection"]) {
\r
847 var start_name = node_list[user_json_data["connection"][conn_cursor]["end-node"][0]["node-id"]];
\r
848 var end_name = node_list[user_json_data["connection"][conn_cursor]["end-node"][1]["node-id"]];
\r
850 if (user_json_data["connection"][conn_cursor]["property"] != null)
\r
851 bandwidth = user_json_data["connection"][conn_cursor]["property"][0]["property-values"]["int-value"][0]["value"];
\r
854 draw_connection_data(user_json_data["connection"][conn_cursor]["connection-name"], start_name, end_name, bandwidth / 100);
\r
858 if (user_json_data["flow"] != null) {
\r
859 var flow_list = [];
\r
860 for (var flow_cursor in user_json_data["flow"]) {
\r
861 var src_ip, dst_ip;
\r
862 for (var match_cursor in user_json_data["flow"][flow_cursor]["match-item"]) {
\r
863 if (user_json_data["flow"][flow_cursor]["match-item"][match_cursor]["match-item-name"] == "dst-ip") {
\r
864 dst_ip = user_json_data["flow"][flow_cursor]["match-item"][match_cursor]["match-item-value"]["string-value"];
\r
866 if (user_json_data["flow"][flow_cursor]["match-item"][match_cursor]["match-item-name"] == "src-ip") {
\r
867 src_ip = user_json_data["flow"][flow_cursor]["match-item"][match_cursor]["match-item-value"]["string-value"];
\r
870 draw_flow_data(src_ip, dst_ip, user_json_data["flow"][flow_cursor]["flow-name"]);
\r
871 flow_list[user_json_data["flow"][flow_cursor]["flow-id"]] = user_json_data["flow"][flow_cursor]["flow-name"]
\r
876 if (user_data["operations"] != null) {
\r
877 for (var operation_cursor in user_data["operations"]["operation"]) {
\r
878 var flow_name = flow_list[user_data["operations"]["operation"][operation_cursor]["target-object"]];
\r
879 var chain_name = node_list[user_data["operations"]["operation"][operation_cursor]["action"][0]["parameter-values"]["string-value"][0]["value"]];
\r
880 var node_start = jQuery("#" + flow_name).attr("node_start");
\r
881 var node_end = jQuery("#" + flow_name).attr("node_end");
\r
884 for (var i = 0; i < jQuery("#service_svg2 path").length; i++) {
\r
885 if (jQuery("#service_svg2 path:eq(" + i + ")").attr("type") == "connection") {
\r
886 var node_name_old_1 = jQuery("#service_svg2 path:eq(" + i + ")").attr("node_start");
\r
887 var node_name_old_2 = jQuery("#service_svg2 path:eq(" + i + ")").attr("node_end");
\r
888 console.log("old:" + node_name_old_1 + " " + node_name_old_2);
\r
889 if (((node_start == node_name_old_1) && (chain_name == node_name_old_2)) || ((node_start == node_name_old_2) && (chain_name == node_name_old_1))) {
\r
894 for (var i = 0; i < jQuery("#service_svg2 path").length; i++) {
\r
895 if (jQuery("#service_svg2 path:eq(" + i + ")").attr("type") == "connection") {
\r
896 var node_name_old_1 = jQuery("#service_svg2 path:eq(" + i + ")").attr("node_start");
\r
897 var node_name_old_2 = jQuery("#service_svg2 path:eq(" + i + ")").attr("node_end");
\r
898 console.log("old:" + node_name_old_1 + " " + node_name_old_2);
\r
899 if (((node_end == node_name_old_1) && (chain_name == node_name_old_2)) || ((node_end == node_name_old_2) && (chain_name == node_name_old_1))) {
\r
904 if (c2_flag == 0 || c2_flag == 0) {
\r
905 alert("No connection!");
\r
908 lead_policy(node_start, chain_name, parseInt(jQuery("#" + flow_name).attr("count")), jQuery("#" + flow_name).attr("stroke"), flow_name + "_1", chain_name, node_start, node_end)
\r
909 lead_policy(chain_name, node_end, parseInt(jQuery("#" + flow_name).attr("count")), jQuery("#" + flow_name).attr("stroke"), flow_name + "_2", chain_name, node_start, node_end)
\r
910 jQuery("#" + flow_name).remove();
\r
919 //parse nemo language
\r
920 function parseNemoLan(userinfo) {
\r
921 console.log(userinfo);
\r
922 var userJsonString = JSON.stringify(userinfo);
\r
923 var userJson = JSON.parse(userJsonString);
\r
924 // console.log(userJson);
\r
925 var user_data = userinfo;
\r
926 //set host nodes connection and flow array array[id]-->name
\r
929 var connection = [];
\r
931 for (var i in user_data) {
\r
933 if (i == 'objects') {
\r
934 for (var j in user_data['objects']) {
\r
937 for (var k in user_data[i][j]) {
\r
938 nodes[user_data[i][j][k]["node-id"]] = user_data[i][j][k]["node-name"];
\r
940 } else if (j == 'connection') {
\r
941 for (var k in user_data[i][j]) {
\r
942 connection[user_data[i][j][k]["connection-id"]] = user_data[i][j][k]["connection-name"];
\r
944 } else if (j == 'flow') {
\r
945 for (var k in user_data[i][j]) {
\r
946 flow[user_data[i][j][k]["flow-id"]] = user_data[i][j][k]["flow-name"];
\r
950 } else if (i == 'operations') {
\r
954 console.log(nodes);
\r
955 console.log(connection);
\r
957 //parse and show nemo language(node connection flow operation)
\r
958 for (var i in user_data["objects"]) {
\r
961 var node = user_data["objects"]['node'];
\r
962 for (var j in node) {
\r
964 if(node[j]['node-type']=='host'){
\r
965 nemo_str += "Import Node " + node[j]['node-name'] + " Type " + node[j]['node-type'];
\r
967 nemo_str += "Create Node " + node[j]['node-name'] + " Type " + node[j]['node-type'];
\r
969 var sub_node = node[j]['sub-node'];
\r
970 if (sub_node && sub_node.length > 0) {
\r
971 nemo_str += ' Contain ';
\r
972 for (var k in sub_node) {
\r
973 nemo_str += nodes[sub_node[k]['node-id']] + ',';
\r
975 nemo_str = nemo_str.substring(0, nemo_str.length - 1);
\r
977 var property = node[j]['property'];
\r
978 if (property && property.length > 0) {
\r
979 nemo_str += ' Property ';
\r
980 for (var k in property) {
\r
981 nemo_str += property[k]['property-name'] + ':"' + property[k]['property-values']['string-value'][0]['value'] + '",';
\r
983 nemo_str = nemo_str.substring(0, nemo_str.length - 1);
\r
985 nodeNemo.push(nemo_str);
\r
987 for (var item in nodeNemo) {
\r
988 // alert(jQuery("#nemo_str_show").html);
\r
989 jQuery("#nemo_str_show").append('<p>'+nodeNemo[item]+' '+'</p>');
\r
991 console.log(nodeNemo);
\r
994 else if (i == "connection") {
\r
995 var connectionNemo = [];
\r
996 var conn = user_data["objects"]['connection'];
\r
997 for (var j in conn) {
\r
998 var nemo_str = "Create Connection " + conn[j]['connection-name'] + ' Type ' + conn[j]['connection-type'];
\r
999 nemo_str += " Endnodes " + nodes[conn[j]['end-node'][0]['node-id']] + ',' + nodes[conn[j]['end-node'][1]['node-id']];
\r
1000 var property = conn[j]['property'];
\r
1001 if(property&&property.length>0){
\r
1002 nemo_str+=" Property";
\r
1003 for(var k in property){
\r
1004 nemo_str+=' '+property[k]['property-name']+':"';
\r
1005 var property_value=property[k]['property-values'];
\r
1006 console.log(property_value);
\r
1007 for(var v in property_value){//int-value or string-value
\r
1008 nemo_str+=property_value[v][0]['value'];
\r
1012 nemo_str = nemo_str.substring(0,nemo_str.length-1);
\r
1015 connectionNemo.push(nemo_str);
\r
1017 for (var item in connectionNemo) {
\r
1018 // alert(jQuery("#nemo_str_show").html);
\r
1019 jQuery("#nemo_str_show").append('<p>'+connectionNemo[item]+' '+'</p>');
\r
1021 console.log(connectionNemo);
\r
1024 else if (i = 'flow') {
\r
1025 var flowNemo = [];
\r
1026 var fl = user_data["objects"]['flow'];
\r
1027 for (var j in fl) {
\r
1028 var nemo_str = 'Create Flow ' + fl[j]['flow-name'];
\r
1029 var match = fl[j]["match-item"];
\r
1030 if (match && match.length > 0) {
\r
1031 nemo_str += " Match ";
\r
1032 for (var k in match) {
\r
1033 nemo_str += match[k]['match-item-name'] + ':"' + match[k]["match-item-value"]['string-value'] + '",';
\r
1035 nemo_str = nemo_str.substring(0, nemo_str.length - 1);
\r
1037 flowNemo.push(nemo_str);
\r
1040 for (var item in flowNemo) {
\r
1041 // alert(jQuery("#nemo_str_show").html);
\r
1042 jQuery("#nemo_str_show").append('<p>'+flowNemo[item]+' '+'</p>');
\r
1044 console.log(flowNemo);
\r
1049 for (var i in user_data["operations"]) {
\r
1051 var operation = user_data["operations"]['operation'];
\r
1052 for (var j in operation) {
\r
1053 var nemo_str = 'Create Operation ' + operation[j]["operation-name"];
\r
1054 // console.log(flow[operation[j]['target-object']]);
\r
1055 nemo_str += ' Target ' + flow[operation[j]['target-object']];
\r
1056 var action = operation[j]['action'];
\r
1057 if (action && action.length > 0) {
\r
1058 nemo_str += " Action "
\r
1059 for (var k in action) {
\r
1060 nemo_str += action[k]['action-name'] + ":" + nodes[action[k]['parameter-values']["string-value"][0]['value']] + ',';
\r
1062 nemo_str = nemo_str.substring(0, nemo_str.length - 1);
\r
1064 opNemo.push(nemo_str);
\r
1066 for (var item in opNemo) {
\r
1067 // alert(jQuery("#nemo_str_show").html);
\r
1068 jQuery("#nemo_str_show").append('<p>'+opNemo[item]+' '+'</p>');
\r
1070 console.log(opNemo);
\r
1074 jQuery(function($){
\r
1075 // var user_data = userinfo['users']['user'][0];
\r
1076 // // console.log(JSON.stringify(user_data));
\r
1077 // analyjson_topo(user_data);
\r
1078 // parseNemoLan(user_data);
\r
1079 // //set keyWords style
\r
1080 // $("#nemo_str_show p").each(function(){
\r
1081 // var $res=$(this);
\r
1082 // keyWords.forEach(function(item,index,array){
\r
1083 // // console.log(item);
\r
1084 // $res.html($res.html().replace(item,"<span class='keyWords'>"+item+"</span>"));
\r
1086 // // console.log($res.html());
\r