nemo-ui/src/main/resources/nemo/js/intentTopo.js

   1 var IntentInfos='';\r
   2 \r
   3 function getIntentInfos(){\r
   4           var userData=null;\r
   5        jQuery.ajax({\r
   6                         url: "/restconf/config/nemo-intent:users/",\r
   7                         type: "GET",\r
   8                         async: false,\r
   9                         dataType: "json",\r
  10                         success: function(data) {\r
  11                                 console.log(data);\r
  12                                 IntentInfos=data;\r
  13                                 userData=data;\r
  14                         },\r
  15                         error: function(data) {\r
  16                                 console.log(data);\r
  17                                 console.log('Get IntentInfo Error!');\r
  18                                 // alert('Get IntentInfo Error!');\r
  19                         }\r
  20                 });\r
  21        return userData;\r
  22      \r
  23         }\r
  24 \r
  25  function getIntentDatas(){\r
  26         var Datas=getIntentInfos();\r
  27         if(!Datas){\r
  28         Datas=userinfo;\r
  29         }\r
  30         IntentInfos=Datas;\r
  31         //return virtualDatas;\r
  32  }\r
  33 \r
  34 getIntentInfos();\r
  35 // getIntentDatas();\r
  36  function getIntentInfoById(user_id,Data){\r
  37                 //console.log(1);\r
  38         if(!Data) Data=IntentInfos;\r
  39         if(!Data) return;\r
  40         if(typeof(Data)=='string'){\r
  41     var user_json = JSON.parse(Data);\r
  42     }\r
  43     else\r
  44     {\r
  45     var user_json = Data;\r
  46     }\r
  47 \r
  48      console.log(user_json);\r
  49     var user_info = user_json['users']['user'];\r
  50         for(var item in user_info){\r
  51                 if(user_id==user_info[item]['user-id']){\r
  52                         return user_info[item];\r
  53                 }\r
  54         }\r
  55  }\r
  56 \r
  57  function getIntentInfoByName(user_name,Data){\r
  58      console.log(Data);\r
  59         if(typeof(Data)=='string'){\r
  60     var user_json = JSON.parse(Data);\r
  61     }\r
  62     else\r
  63     {\r
  64     var user_json = Data;\r
  65     }\r
  66     // console.log(user_json);\r
  67     var user_info = user_json['users']['user'];\r
  68         for(var item in user_info){\r
  69                 if(user_name==user_info[item]['user-name']){\r
  70                         return user_info[item];\r
  71                 }\r
  72         }\r
  73  }\r
  74 \r
  75 \r
  76 \r
  77         function lead_policy(src_group, dest_group, flow_count_temp, color, id, chain_name, src_name, dest_name) {\r
  78                 var cir_r = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("r"));\r
  79 \r
  80                 //get circle cx cy\r
  81                 src_cx = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("cx"));\r
  82                 src_cy = parseInt(jQuery("#" + src_group + " circle:eq(0)").attr("cy"));\r
  83                 dest_cx = parseInt(jQuery("#" + dest_group + " circle:eq(0)").attr("cx"));\r
  84                 dest_cy = parseInt(jQuery("#" + dest_group + " circle:eq(0)").attr("cy"));\r
  85                 console.log(src_cx + "  " + src_cy + "  " + dest_cx + "   " + dest_cy);\r
  86 \r
  87                 //calculate deg\r
  88                 var tri_h = dest_cx - src_cx;\r
  89                 var tri_l = src_cy - dest_cy;\r
  90                 var tri_s = Math.sqrt(tri_l * tri_l + tri_h * tri_h);\r
  91                 var deg = Math.asin(tri_l / tri_s);\r
  92                 console.log(tri_h + "  " + tri_l + "  " + tri_s);\r
  93                 //alert(deg);\r
  94                 console.log(deg);\r
  95 \r
  96 \r
  97                 //calculate offset\r
  98                 var offset = ((20 + (15 * parseInt(flow_count_temp))) / 180) * Math.PI;\r
  99                 console.log("temp: " + flow_count_temp + " offset:  " + offset);\r
 100 \r
 101                 //calculate path possition\r
 102                 var path_src_x, path_src_y, path_dest_x, path_dest_y, mid_x, mid_y, b_x, b_y;\r
 103                 if (tri_h >= 0) {\r
 104                         mid_x = src_cx + tri_h / 2;\r
 105                         mid_y = src_cy - tri_l / 2;\r
 106                         path_src_x = src_cx + cir_r * (Math.cos(offset + deg));\r
 107                         path_src_y = src_cy - cir_r * (Math.sin(offset + deg));\r
 108                         path_dest_x = dest_cx - (cir_r + 14) * (Math.cos(offset - deg));\r
 109                         path_dest_y = dest_cy - (cir_r + 14) * (Math.sin(offset - deg));\r
 110                         if (tri_l >= 0) {\r
 111                                 b_x = mid_x - (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.sin(deg));;\r
 112                                 b_y = mid_y - (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.cos(deg));\r
 113                         } else {\r
 114                                 b_x = mid_x + (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.sin(deg));\r
 115                                 b_y = mid_y - (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.cos(deg));\r
 116                         }\r
 117 \r
 118                 } else {\r
 119                         mid_x = src_cx + tri_h / 2;\r
 120                         mid_y = src_cy - tri_l / 2;\r
 121                         path_src_x = src_cx - cir_r * (Math.cos(offset - deg));\r
 122                         path_src_y = src_cy + cir_r * (Math.sin(offset - deg));\r
 123                         path_dest_x = dest_cx + (cir_r + 14) * (Math.cos(-offset - deg));\r
 124                         path_dest_y = dest_cy - (cir_r + 14) * (Math.sin(-offset - deg));\r
 125                         if (tri_l >= 0) {\r
 126                                 b_x = mid_x - (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.sin(deg));\r
 127                                 b_y = mid_y + (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.cos(deg));\r
 128                         } else {\r
 129                                 b_x = mid_x + (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.sin(deg));\r
 130                                 b_y = mid_y + (80 + 30 * parseInt(flow_count_temp)) * Math.abs(Math.cos(deg));\r
 131                         }\r
 132 \r
 133                 }\r
 134                 //path title\r
 135                 var path_title = document.createElementNS('http://www.w3.org/2000/svg', 'path');\r
 136 \r
 137 \r
 138 \r
 139                 //create path\r
 140                 var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');\r
 141                 var path_main = jQuery(path).attr({\r
 142                         id: id,\r
 143                         node_start: src_name,\r
 144                         node_end: dest_name,\r
 145                         type: "flow",\r
 146                         sx: path_src_x,\r
 147                         sy: path_src_y,\r
 148                         mx: b_x,\r
 149                         my: b_y,\r
 150                         ex: path_dest_x,\r
 151                         ey: path_dest_y,\r
 152                         count: flow_count_temp,\r
 153                         via: chain_name,\r
 154                         d: 'M' + path_src_x + " " + path_src_y + ' Q' + b_x + ' ' + b_y + ' ' + path_dest_x + ' ' + path_dest_y,\r
 155                         'stroke': color,\r
 156                         'stroke-width': 3,\r
 157                         fill: "none",\r
 158                         'stroke-dasharray': "6,6",\r
 159                         'marker-end': "url(#idArrow2)",\r
 160                         'marker-mid': "url(#idtext2)"\r
 161                 });\r
 162                 jQuery('#service_svg2').prepend(path_main);\r
 163 \r
 164         }\r
 165 \r
 166         function get_path_color() {\r
 167                 while (1) {\r
 168                         var num1 = Math.floor(Math.random() * 256);\r
 169                         if (num1 > 220)\r
 170                                 continue;\r
 171                         return num1.toString();\r
 172                 }\r
 173         }\r
 174 \r
 175         function flow_get_end_name(src_ip, dest_ip) {\r
 176                 // console.log(src_ip);\r
 177                 // console.log(dest_ip);\r
 178                 var host_name = ['', ''];\r
 179                 if (typeof(phy_host_ip[src_ip]) != "undefined")\r
 180                         host_name[0] = phy_host_ip[src_ip];\r
 181                 else {\r
 182                         for (var find_ip_cursor = 0; find_ip_cursor < jQuery("#service_svg2 g").length; find_ip_cursor++) {\r
 183                                 if (jQuery("#service_svg2 g:eq(" + find_ip_cursor + ")").attr("ip-prefix") == src_ip) {\r
 184                                         host_name[0] = jQuery("#service_svg2 g:eq(" + find_ip_cursor + ")").attr("id");\r
 185                                 }\r
 186 \r
 187                         }\r
 188                 }\r
 189                 if (typeof(phy_host_ip[dest_ip]) != "undefined")\r
 190                         host_name[1] = phy_host_ip[dest_ip];\r
 191                 else {\r
 192                         for (var find_ip_cursor = 0; find_ip_cursor < jQuery("#service_svg2 g").length; find_ip_cursor++) {\r
 193                                 if (jQuery("#service_svg2 g:eq(" + find_ip_cursor + ")").attr("ip-prefix") == dest_ip) {\r
 194                                         host_name[1] = jQuery("#service_svg2 g:eq(" + find_ip_cursor + ")").attr("id");\r
 195                                 }\r
 196 \r
 197                         }\r
 198                 }\r
 199                 console.log(host_name[0] + " " + host_name[1]);\r
 200                 return host_name;\r
 201 \r
 202 \r
 203         }\r
 204 \r
 205         function flow_get_group(src_ip, dest_ip) {\r
 206                 var src_host_name = flow_get_end_name(src_ip, dest_ip)[0];\r
 207                 var dest_host_name = flow_get_end_name(src_ip, dest_ip)[1];\r
 208                 console.log(src_host_name);\r
 209                 console.log(dest_host_name);\r
 210                 var group_node = ['', ''];\r
 211                 for (var i = 0; i < jQuery("#service_svg2 g").length; i++) {\r
 212                         host_list = jQuery("#service_svg2 g:eq(" + i + ")").attr("sub").split(",");\r
 213                         console.log(host_list);\r
 214                         if (host_list[0] == '') {\r
 215                                 continue;\r
 216                         }\r
 217                         for (var j = 0; j < host_list.length; j++) {\r
 218                                 if (host_list[j] == src_host_name) {\r
 219                                         group_node[0] = jQuery("#service_svg2 g:eq(" + i + ")").attr("id");\r
 220                                 }\r
 221                                 if (host_list[j] == dest_host_name) {\r
 222                                         group_node[1] = jQuery("#service_svg2 g:eq(" + i + ")").attr("id");\r
 223                                 }\r
 224                         }\r
 225                         if (group_node[0] != '' && group_node[1] != '')\r
 226                                 break;\r
 227                 }\r
 228                 console.log("node: " + group_node[0] + "  " + group_node[1]);\r
 229                 return group_node;\r
 230         }\r
 231 \r
 232         function draw_flow_data(src_ip, dest_ip, flow_name) {\r
 233                 var src_group = flow_get_group(src_ip, dest_ip)[0];\r
 234                 var dest_group = flow_get_group(src_ip, dest_ip)[1];\r
 235                 console.log(src_group);\r
 236                 console.log(dest_group);\r
 237                 //get flow count\r
 238                 var flow_count_temp = 0;\r
 239                 while (1) {\r
 240                         var end_flag = 0;\r
 241                         for (var find_count = 0; find_count < jQuery("#service_svg2 path").length; find_count++) {\r
 242                                 if (jQuery("#service_svg2 path:eq(" + find_count + ")").attr("type") != "flow")\r
 243                                         continue;\r
 244                                 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
 245                                         if (flow_count_temp == jQuery("#service_svg2 path:eq(" + find_count + ")").attr("count")) {\r
 246                                                 end_flag = 1;\r
 247                                                 flow_count_temp++;\r
 248                                                 break;\r
 249                                         }\r
 250 \r
 251                                 }\r
 252                         }\r
 253                         if (end_flag != 1)\r
 254                                 break;\r
 255                 }\r
 256 \r
 257 \r
 258 \r
 259                 //get Radio\r
 260                 var cir_r = parseInt(jQuery("[id='" + src_group + "'] circle:eq(0)").attr("r"));\r
 261 \r
 262 \r
 263                 //get circle cx cy\r
 264                 src_cx = parseInt(jQuery("[id='" + src_group + "'] circle:eq(0)").attr("cx"));\r
 265                 src_cy = parseInt(jQuery("[id='" + src_group + "'] circle:eq(0)").attr("cy"));\r
 266                 dest_cx = parseInt(jQuery("[id='" + dest_group + "'] circle:eq(0)").attr("cx"));\r
 267                 dest_cy = parseInt(jQuery("[id='" + dest_group + "'] circle:eq(0)").attr("cy"));\r
 268                 console.log(src_cx + "  " + src_cy + "  " + dest_cx + "   " + dest_cy);\r
 269 \r
 270                 //calculate deg\r
 271                 var tri_h = dest_cx - src_cx;\r
 272                 var tri_l = src_cy - dest_cy;\r
 273                 var tri_s = Math.sqrt(tri_l * tri_l + tri_h * tri_h);\r
 274                 var deg = Math.asin(tri_l / tri_s);\r
 275                 console.log(tri_h + "  " + tri_l + "  " + tri_s);\r
 276                 //alert(deg);\r
 277                 console.log(deg);\r
 278 \r
 279 \r
 280                 //calculate offset\r
 281                 var offset = ((20 + (15 * flow_count_temp)) / 180) * Math.PI;\r
 282                 console.log("offset:  " + offset);\r
 283 \r
 284                 //calculate path possition\r
 285                 var path_src_x, path_src_y, path_dest_x, path_dest_y, mid_x, mid_y, b_x, b_y;\r
 286                 if (tri_h >= 0) {\r
 287                         mid_x = src_cx + tri_h / 2;\r
 288                         mid_y = src_cy - tri_l / 2;\r
 289                         path_src_x = src_cx + cir_r * (Math.cos(offset + deg));\r
 290                         path_src_y = src_cy - cir_r * (Math.sin(offset + deg));\r
 291                         path_dest_x = dest_cx - (cir_r + 14) * (Math.cos(offset - deg));\r
 292                         path_dest_y = dest_cy - (cir_r + 14) * (Math.sin(offset - deg));\r
 293                         if (tri_l >= 0) {\r
 294                                 b_x = mid_x - (80 + 30 * flow_count_temp) * Math.abs(Math.sin(deg));;\r
 295                                 b_y = mid_y - (80 + 30 * flow_count_temp) * Math.abs(Math.cos(deg));\r
 296                         } else {\r
 297                                 b_x = mid_x + (80 + 30 * flow_count_temp) * Math.abs(Math.sin(deg));\r
 298                                 b_y = mid_y - (80 + 30 * flow_count_temp) * Math.abs(Math.cos(deg));\r
 299                         }\r
 300 \r
 301                 } else {\r
 302                         mid_x = src_cx + tri_h / 2;\r
 303                         mid_y = src_cy - tri_l / 2;\r
 304                         path_src_x = src_cx - cir_r * (Math.cos(offset - deg));\r
 305                         path_src_y = src_cy + cir_r * (Math.sin(offset - deg));\r
 306                         path_dest_x = dest_cx + (cir_r + 14) * (Math.cos(-offset - deg));\r
 307                         path_dest_y = dest_cy - (cir_r + 14) * (Math.sin(-offset - deg));\r
 308                         if (tri_l >= 0) {\r
 309                                 b_x = mid_x - (80 + 30 * flow_count_temp) * Math.abs(Math.sin(deg));\r
 310                                 b_y = mid_y + (80 + 30 * flow_count_temp) * Math.abs(Math.cos(deg));\r
 311                         } else {\r
 312                                 b_x = mid_x + (80 + 30 * flow_count_temp) * Math.abs(Math.sin(deg));\r
 313                                 b_y = mid_y + (80 + 30 * flow_count_temp) * Math.abs(Math.cos(deg));\r
 314                         }\r
 315 \r
 316                 }\r
 317                 //path title\r
 318                 var path_title = document.createElementNS('http://www.w3.org/2000/svg', 'path');\r
 319 \r
 320 \r
 321 \r
 322                 //create path\r
 323                 var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');\r
 324                 var path_main = jQuery(path).attr({\r
 325                         id: flow_name,\r
 326                         node_start: src_group,\r
 327                         node_end: dest_group,\r
 328                         type: "flow",\r
 329                         sx: path_src_x,\r
 330                         sy: path_src_y,\r
 331                         mx: b_x,\r
 332                         my: b_y,\r
 333                         ex: path_dest_x,\r
 334                         ey: path_dest_y,\r
 335                         via: "none",\r
 336                         count: flow_count_temp,\r
 337                         d: 'M' + path_src_x + " " + path_src_y + ' Q' + b_x + ' ' + b_y + ' ' + path_dest_x + ' ' + path_dest_y,\r
 338                         'stroke': "rgb(" + get_path_color() + "," + get_path_color() + "," + get_path_color() + ")",\r
 339                         'stroke-width': 3,\r
 340                         fill: "none",\r
 341                         'stroke-dasharray': "6,6",\r
 342                         'marker-end': "url(#idArrow2)",\r
 343                         'marker-mid': "url(#idtext2)"\r
 344                 });\r
 345                 if (ne_flag == 0)\r
 346                         jQuery(path).attr("stroke", "rgb(" + get_path_color() + "," + get_path_color() + "," + get_path_color() + ")");\r
 347                 else if (ne_flag == 1)\r
 348                         jQuery(path).attr("stroke", old_color);\r
 349                 jQuery('#service_svg2').prepend(path_main);\r
 350 \r
 351 \r
 352         }\r
 353 \r
 354         function draw_connection_data(conn_name, node_name_1, node_name_2, bandwidth) {\r
 355                 // console.log(conn_name);\r
 356                 // console.log(node_name_1);\r
 357                 // console.log(node_name_2);\r
 358                 // console.log(bandwidth);\r
 359                 if (conn_name != null && typeof(conn_name) != "undefined")\r
 360                         jQuery("#" + conn_name).remove();\r
 361                 try {\r
 362                         var node_cx_1 = jQuery("[id='" + node_name_1 + "_group']").attr("cx");\r
 363                         var node_cy_1 = jQuery("[id='" + node_name_1 + "_group']").attr("cy");\r
 364                         var node_cx_2 = jQuery("[id='" + node_name_2 + "_group']").attr("cx");\r
 365                         var node_cy_2 = jQuery("[id='" + node_name_2 + "_group']").attr("cy");\r
 366                         // console.log(node_cx_1);\r
 367                         // console.log(node_cy_1);\r
 368                         // console.log(node_cx_2);\r
 369                         // console.log(node_cy_2);\r
 370                         //var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');\r
 371                         var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');\r
 372                         var path_main = jQuery(path).attr({\r
 373                                 id: conn_name,\r
 374                                 node_start: node_name_1,\r
 375                                 node_end: node_name_2,\r
 376                                 type: "connection",\r
 377                                 d: 'M' + node_cx_1 + " " + node_cy_1 + ' L' + node_cx_2 + ' ' + node_cy_2,\r
 378                                 'stroke': "black",\r
 379                                 'stroke-width': parseInt(bandwidth),\r
 380                                 fill: "black"\r
 381                         });\r
 382                         jQuery('#service_svg2').prepend(path_main);\r
 383                 } catch (err) {\r
 384                         alert(err);\r
 385                 }\r
 386         }\r
 387 \r
 388         function redraw_node_possition_data() {\r
 389                 node_count = jQuery("#service_svg2 g").length;\r
 390                 if (node_count == 1) {\r
 391                         var x = 550;\r
 392                         var y = 450;\r
 393                         dis_x = x - jQuery("#service_svg2 g:eq(0) circle:eq(0)").attr("cx");\r
 394                         dis_y = y - jQuery("#service_svg2 g:eq(0) circle:eq(0)").attr("cy");\r
 395                         jQuery("#service_svg2 g:eq(0) circle:eq(0)").attr("cx", x);\r
 396                         jQuery("#service_svg2 g:eq(0) circle:eq(0)").attr("cy", y);\r
 397                         for (var j = 0; j < jQuery("#service_svg2 g:eq(0) rect").length; j++) {\r
 398                                 var last_x = parseInt(jQuery("#service_svg2 g:eq(0) rect:eq(" + j + ")").attr("x"));\r
 399                                 var last_y = parseInt(jQuery("#service_svg2 g:eq(0) rect:eq(" + j + ")").attr("y"));\r
 400                                 jQuery("#service_svg2 g:eq(0) rect:eq(" + j + ")").attr("x", last_x + dis_x);\r
 401                                 jQuery("#service_svg2 g:eq(0) rect:eq(" + j + ")").attr("y", last_y + dis_y);\r
 402                         }\r
 403                         for (var j = 0; j < jQuery("#service_svg2 g:eq(0) text").length; j++) {\r
 404                                 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
 405                                 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
 406                         }\r
 407 \r
 408                         return;\r
 409 \r
 410                 }\r
 411                 var res = calculatePos(node_count);\r
 412                 var r = 300;\r
 413                 for (var i = 0; i < node_count; i++) {\r
 414                         var deg = res[i];\r
 415                         var x = 550 + Math.cos(deg) * r;\r
 416                         var y = 450 - Math.sin(deg) * r;\r
 417                         dis_x = x - parseInt(jQuery("#service_svg2 g:eq(" + i + ") circle:eq(0)").attr("cx"));\r
 418                         dis_y = y - parseInt(jQuery("#service_svg2 g:eq(" + i + ") circle:eq(0)").attr("cy"));\r
 419                         jQuery("#service_svg2 g:eq(" + i + ") circle:eq(0)").attr("cx", x);\r
 420                         jQuery("#service_svg2 g:eq(" + i + ") circle:eq(0)").attr("cy", y);\r
 421                         for (var j = 0; j < jQuery("#service_svg2 g:eq(" + i + ") rect").length; j++) {\r
 422                                 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
 423                                 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
 424                         }\r
 425                         for (var j = 0; j < jQuery("#service_svg2 g:eq(" + i + ") text").length; j++) {\r
 426                                 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
 427                                 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
 428                         }\r
 429 \r
 430                 }\r
 431 \r
 432         }\r
 433 \r
 434         function draw_group_data(node_name, node_number, node_list, node_type, ip) {\r
 435                 // alert("type:"+node_type);\r
 436                 var circle_x = 550;\r
 437                 var circle_y = 450;\r
 438                 if (node_number == 0) {\r
 439                         var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');\r
 440                         var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\r
 441                         var inCircle1_main = jQuery(circle_main).attr({\r
 442                                 id: node_name + "_group",\r
 443                                 cx: circle_x,\r
 444                                 cy: circle_y,\r
 445                                 r: 90,\r
 446                                 'stroke': "black",\r
 447                                 'stroke-width': 3,\r
 448                                 fill: "white"\r
 449                         });\r
 450                         var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 451                         var text1_main = jQuery(text1).attr({\r
 452                                 id: node_name + "_title1",\r
 453                                 x: circle_x,\r
 454                                 y: circle_y - 8,\r
 455                                 fill: "black",\r
 456                                 'text-anchor': 'middle',\r
 457                                 "stroke": "black",\r
 458                                 "stroke-width": 0.8\r
 459 \r
 460                         });\r
 461                         jQuery(text1).text(node_name);\r
 462                         var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 463                         var text2_main = jQuery(text2).attr({\r
 464                                 id: node_name + "_title2",\r
 465                                 x: circle_x,\r
 466                                 y: circle_y + 0 - 100,\r
 467                                 fill: "                       ",\r
 468                                 'text-anchor': 'middle'\r
 469                         });\r
 470                         jQuery(text2).text(node_type);\r
 471                         var g_main = jQuery(g).append(inCircle1_main);\r
 472                         jQuery(g).append(text1_main);\r
 473                         jQuery(g).append(text2_main);\r
 474                         jQuery(g).attr("id", node_name);\r
 475                         jQuery(g).attr("type", node_type);\r
 476                         if (node_type != "ext-group")\r
 477                                 jQuery(g).attr("sub", "");\r
 478                         else {\r
 479                                 jQuery(g).attr("sub", node_name);\r
 480                                 jQuery(g).attr("ip-prefix", ip);\r
 481                                 //ext_ip[jQuery("#ext-group_ip-prefix").val().trim()] = jQuery("#node_name").val().trim();\r
 482 \r
 483                         }\r
 484                         if (node_type.indexOf("chain") > -1)\r
 485                                 jQuery(g).attr("flow", 0);\r
 486                         console.log(g_main);\r
 487                         jQuery('#service_svg2').append(g_main);\r
 488                         console.log(jQuery('#service_svg2').html())\r
 489                 } else if (node_number == 1) {\r
 490                         var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');\r
 491                         var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\r
 492                         var inCircle1_main = jQuery(circle_main).attr({\r
 493                                 id: node_name + "_group",\r
 494                                 cx: circle_x,\r
 495                                 cy: circle_y,\r
 496                                 r: 90,\r
 497                                 'stroke': "black",\r
 498                                 'stroke-width': 3,\r
 499                                 fill: "white"\r
 500                         });\r
 501                         var host1 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 502                         var host1_main = jQuery(host1).attr({\r
 503                                 id: node_list[0],\r
 504                                 x: circle_x - 57,\r
 505                                 y: circle_y - 25,\r
 506                                 width: 114,\r
 507                                 height: 50,\r
 508                                 'stroke': "black",\r
 509                                 'stroke-width': 1,\r
 510                                 fill: "white"\r
 511                         });\r
 512                         var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 513                         var text1_main = jQuery(text1).attr({\r
 514                                 id: node_name + "_title1",\r
 515                                 x: circle_x,\r
 516                                 y: circle_y - 48,\r
 517                                 fill: "black",\r
 518                                 'text-anchor': 'middle',\r
 519                                 "stroke": "black",\r
 520                                 "stroke-width": 0.8\r
 521                         });\r
 522                         jQuery(text1).text(node_name);\r
 523                         var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 524                         var text2_main = jQuery(text2).attr({\r
 525                                 id: node_name + "_title2",\r
 526                                 x: circle_x,\r
 527                                 y: (circle_y - 0 - 100),\r
 528                                 fill: "black",\r
 529                                 'text-anchor': 'middle'\r
 530                         });\r
 531                         jQuery(text2).text(node_type);\r
 532                         var text3 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 533                         var text3_main = jQuery(text3).attr({\r
 534                                 id: node_list[0] + '_text',\r
 535                                 x: circle_x,\r
 536                                 y: circle_y + 5,\r
 537                                 fill: "black",\r
 538                                 'text-anchor': 'middle'\r
 539                         });\r
 540                         jQuery(text3).text(node_list[0]);\r
 541                         var g_main = jQuery(g).append(inCircle1_main);\r
 542                         jQuery(g).append(host1_main);\r
 543                         jQuery(g).append(text1_main);\r
 544                         jQuery(g).append(text2_main);\r
 545                         jQuery(g).append(text3_main);\r
 546                         jQuery(g).attr("id", node_name);\r
 547                         jQuery(g).attr("type", node_type);\r
 548                         jQuery(g).attr("sub", node_name,node_list[0]);\r
 549                         if (node_type.indexOf("chain") > -1)\r
 550                                 jQuery(g).attr("flow", 0);\r
 551                         if(ip) jQuery(g).attr("ip-prefix", ip);\r
 552                         jQuery('#service_svg2').append(g_main);\r
 553                 } else if (node_number == 2) {\r
 554                         var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');\r
 555                         var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\r
 556                         var inCircle1_main = jQuery(circle_main).attr({\r
 557                                 id: node_name + "_group",\r
 558                                 cx: circle_x,\r
 559                                 cy: circle_y,\r
 560                                 r: 90,\r
 561                                 'stroke': "black",\r
 562                                 'stroke-width': 3,\r
 563                                 fill: "white"\r
 564                         });\r
 565                         var host1 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 566                         var host1_main = jQuery(host1).attr({\r
 567                                 id: node_list[0],\r
 568                                 x: circle_x - 55,\r
 569                                 y: circle_y - 25,\r
 570                                 width: 110,\r
 571                                 height: 34,\r
 572                                 'stroke': "black",\r
 573                                 'stroke-width': 1,\r
 574                                 fill: "white"\r
 575                         });\r
 576                         var host2 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 577                         var host2_main = jQuery(host2).attr({\r
 578                                 id: node_list[1],\r
 579                                 x: circle_x - 55,\r
 580                                 y: circle_y + 18,\r
 581                                 width: 110,\r
 582                                 height: 34,\r
 583                                 'stroke': "black",\r
 584                                 'stroke-width': 1,\r
 585                                 fill: "white"\r
 586                         });\r
 587                         var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 588                         var text1_main = jQuery(text1).attr({\r
 589                                 id: node_name + "_title1",\r
 590                                 x: circle_x,\r
 591                                 y: circle_y - 48,\r
 592                                 fill: "black",\r
 593                                 'text-anchor': 'middle',\r
 594                                 "stroke": "black",\r
 595                                 "stroke-width": 0.8\r
 596                         });\r
 597                         jQuery(text1).text(node_name);\r
 598                         var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 599                         var text2_main = jQuery(text2).attr({\r
 600                                 id: node_name + "_title2",\r
 601                                 x: circle_x,\r
 602                                 y: circle_y - 0 - 100,\r
 603                                 fill: "black",\r
 604                                 'text-anchor': 'middle'\r
 605                         });\r
 606                         jQuery(text2).text(node_type);\r
 607                         var text3 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 608                         var text3_main = jQuery(text3).attr({\r
 609                                 id: node_list[0] + "_text",\r
 610                                 x: circle_x,\r
 611                                 y: circle_y - 5,\r
 612                                 fill: "black",\r
 613                                 'text-anchor': 'middle'\r
 614                         });\r
 615                         jQuery(text3).text(node_list[0]);\r
 616                         var text4 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 617                         var text4_main = jQuery(text4).attr({\r
 618                                 id: node_list[1] + "_text",\r
 619                                 x: circle_x,\r
 620                                 y: circle_y + 40,\r
 621                                 fill: "black",\r
 622                                 'text-anchor': 'middle'\r
 623                         });\r
 624                         jQuery(text4).text(node_list[1]);\r
 625                         var g_main = jQuery(g).append(inCircle1_main);\r
 626                         jQuery(g).append(host1_main);\r
 627                         jQuery(g).append(host2_main);\r
 628                         jQuery(g).append(text1_main);\r
 629                         jQuery(g).append(text2_main);\r
 630                         jQuery(g).append(text3_main);\r
 631                         jQuery(g).append(text4_main);\r
 632                         jQuery(g).attr("id", node_name);\r
 633                         jQuery(g).attr("type", node_type);\r
 634                         jQuery(g).attr("sub", node_name,node_list[0] + "," + node_list[1]);\r
 635                         if (node_type.indexOf("chain") > -1)\r
 636                                 jQuery(g).attr("flow", 0);\r
 637                     if(ip) jQuery(g).attr("ip-prefix", ip);\r
 638                         jQuery('#service_svg2').append(g);\r
 639 \r
 640                 } else if (node_number == 3) {\r
 641                         var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');\r
 642                         var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\r
 643                         var inCircle1_main = jQuery(circle_main).attr({\r
 644                                 id: node_name + "_group",\r
 645                                 cx: circle_x,\r
 646                                 cy: circle_y,\r
 647                                 r: 90,\r
 648                                 'stroke': "black",\r
 649                                 'stroke-width': 3,\r
 650                                 fill: "white"\r
 651                         });\r
 652                         var host1 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 653                         var host1_main = jQuery(host1).attr({\r
 654                                 id: node_list[0],\r
 655                                 x: circle_x - 55,\r
 656                                 y: circle_y - 31,\r
 657                                 width: 110,\r
 658                                 height: 25,\r
 659                                 'stroke': "black",\r
 660                                 'stroke-width': 1,\r
 661                                 fill: "white"\r
 662                         });\r
 663                         var host2 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 664                         var host2_main = jQuery(host2).attr({\r
 665                                 id: node_list[1],\r
 666                                 x: circle_x - 55,\r
 667                                 y: circle_y - 3,\r
 668                                 width: 110,\r
 669                                 height: 25,\r
 670                                 'stroke': "black",\r
 671                                 'stroke-width': 1,\r
 672                                 fill: "white"\r
 673                         });\r
 674                         var host3 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 675                         var host3_main = jQuery(host3).attr({\r
 676                                 id: node_list[2],\r
 677                                 x: circle_x - 55,\r
 678                                 y: circle_y + 27,\r
 679                                 width: 110,\r
 680                                 height: 25,\r
 681                                 'stroke': "black",\r
 682                                 'stroke-width': 1,\r
 683                                 fill: "white"\r
 684                         });\r
 685                         var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 686                         var text1_main = jQuery(text1).attr({\r
 687                                 id: node_name + "_title1",\r
 688                                 x: circle_x,\r
 689                                 y: circle_y - 51,\r
 690                                 fill: "black",\r
 691                                 'text-anchor': 'middle',\r
 692                                 "stroke": "black",\r
 693                                 "stroke-width": 0.8\r
 694                         });\r
 695                         jQuery(text1).text(node_name);\r
 696                         var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 697                         var text2_main = jQuery(text2).attr({\r
 698                                 id: node_name + "_title2",\r
 699                                 x: circle_x,\r
 700                                 y: circle_y - 0 - 100,\r
 701                                 fill: "black",\r
 702                                 'text-anchor': 'middle'\r
 703                         });\r
 704                         jQuery(text2).text(node_type);\r
 705                         var text3 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 706                         var text3_main = jQuery(text3).attr({\r
 707                                 id: node_list[0] + '_text',\r
 708                                 x: circle_x,\r
 709                                 y: circle_y - 13,\r
 710                                 fill: "black",\r
 711                                 'text-anchor': 'middle'\r
 712                         });\r
 713                         jQuery(text3).text(node_list[0]);\r
 714                         var text4 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 715                         var text4_main = jQuery(text4).attr({\r
 716                                 id: node_list[1] + '_text',\r
 717                                 x: circle_x,\r
 718                                 y: circle_y + 15,\r
 719                                 fill: "black",\r
 720                                 'text-anchor': 'middle'\r
 721                         });\r
 722                         jQuery(text4).text(node_list[1]);\r
 723                         var text5 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 724                         var text5_main = jQuery(text5).attr({\r
 725                                 id: node_list[2] + '_text',\r
 726                                 x: circle_x,\r
 727                                 y: circle_y + 45,\r
 728                                 fill: "black",\r
 729                                 'text-anchor': 'middle'\r
 730                         });\r
 731                         jQuery(text5).text(node_list[2]);\r
 732                         var g_main = jQuery(g).append(inCircle1_main);\r
 733                         jQuery(g).append(host1_main);\r
 734                         jQuery(g).append(host2_main);\r
 735                         jQuery(g).append(host3_main);\r
 736                         jQuery(g).append(text1_main);\r
 737                         jQuery(g).append(text2_main);\r
 738                         jQuery(g).append(text3_main);\r
 739                         jQuery(g).append(text4_main);\r
 740                         jQuery(g).append(text5_main);\r
 741                         jQuery(g).attr("id", node_name);\r
 742                         jQuery(g).attr("type", node_type);\r
 743                         jQuery(g).attr("sub", node_name,node_list[0] + "," + node_list[1] + "," + node_list[2]);\r
 744                         if (node_type.indexOf("chain") > -1)\r
 745                                 jQuery(g).attr("flow", 0);\r
 746                         jQuery('#service_svg2').append(g);\r
 747                 }\r
 748                 else if(node_number >=4){\r
 749                         var g = document.createElementNS('http://www.w3.org/2000/svg', 'g');\r
 750                         var circle_main = document.createElementNS('http://www.w3.org/2000/svg', 'circle');\r
 751                         var inCircle1_main = jQuery(circle_main).attr({\r
 752                                 id: node_name + "_group",\r
 753                                 cx: circle_x,\r
 754                                 cy: circle_y,\r
 755                                 r: 90,\r
 756                                 'stroke': "black",\r
 757                                 'stroke-width': 3,\r
 758                                 fill: "white"\r
 759                         });\r
 760                         var host1 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 761                         var host1_main = jQuery(host1).attr({\r
 762                                 id: node_list[0],\r
 763                                 x: circle_x - 55,\r
 764                                 y: circle_y - 31,\r
 765                                 width: 110,\r
 766                                 height: 25,\r
 767                                 'stroke': "black",\r
 768                                 'stroke-width': 1,\r
 769                                 fill: "white"\r
 770                         });\r
 771                         var host2 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 772                         var host2_main = jQuery(host2).attr({\r
 773                                 id: node_list[1],\r
 774                                 x: circle_x - 55,\r
 775                                 y: circle_y - 3,\r
 776                                 width: 110,\r
 777                                 height: 25,\r
 778                                 'stroke': "black",\r
 779                                 'stroke-width': 1,\r
 780                                 fill: "white"\r
 781                         });\r
 782                         var host3 = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\r
 783                         var host3_main = jQuery(host3).attr({\r
 784                                 id: node_list[2],\r
 785                                 x: circle_x - 55,\r
 786                                 y: circle_y + 27,\r
 787                                 width: 110,\r
 788                                 height: 25,\r
 789                                 'stroke': "black",\r
 790                                 'stroke-width': 1,\r
 791                                 fill: "white"\r
 792                         });\r
 793                         var text1 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 794                         var text1_main = jQuery(text1).attr({\r
 795                                 id: node_name + "_title1",\r
 796                                 x: circle_x,\r
 797                                 y: circle_y - 51,\r
 798                                 fill: "black",\r
 799                                 'text-anchor': 'middle',\r
 800                                 "stroke": "black",\r
 801                                 "stroke-width": 0.8\r
 802                         });\r
 803                         jQuery(text1).text(node_name);\r
 804                         var text2 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 805                         var text2_main = jQuery(text2).attr({\r
 806                                 id: node_name + "_title2",\r
 807                                 x: circle_x,\r
 808                                 y: circle_y - 0 - 100,\r
 809                                 fill: "black",\r
 810                                 'text-anchor': 'middle'\r
 811                         });\r
 812                         jQuery(text2).text(node_type);\r
 813                         var text3 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 814                         var text3_main = jQuery(text3).attr({\r
 815                                 id: node_list[0] + '_text',\r
 816                                 x: circle_x,\r
 817                                 y: circle_y - 13,\r
 818                                 fill: "black",\r
 819                                 'text-anchor': 'middle'\r
 820                         });\r
 821                         jQuery(text3).text(node_list[0]);\r
 822                         var text4 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 823                         var text4_main = jQuery(text4).attr({\r
 824                                 id: node_list[1] + '_text',\r
 825                                 x: circle_x,\r
 826                                 y: circle_y + 15,\r
 827                                 fill: "black",\r
 828                                 'text-anchor': 'middle'\r
 829                         });\r
 830                         jQuery(text4).text(node_list[1]);\r
 831                         var text5 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 832                         var text5_main = jQuery(text5).attr({\r
 833                                 id: node_list[2] + '_text',\r
 834                                 x: circle_x,\r
 835                                 y: circle_y + 45,\r
 836                                 fill: "black",\r
 837                                 'text-anchor': 'middle'\r
 838                         });\r
 839                         jQuery(text5).text(node_list[2]);\r
 840                         var text6 = document.createElementNS('http://www.w3.org/2000/svg', 'text');\r
 841                         var text6_main = jQuery(text6).attr({\r
 842                                 id: node_list[2] + '_text',\r
 843                                 x: circle_x,\r
 844                                 y: circle_y + 43+25,\r
 845                                 fill: "black",\r
 846                                 'text-anchor': 'middle'\r
 847                         });\r
 848                         jQuery(text6).text("........");\r
 849                         var g_main = jQuery(g).append(inCircle1_main);\r
 850                         jQuery(g).append(host1_main);\r
 851                         jQuery(g).append(host2_main);\r
 852                         jQuery(g).append(host3_main);\r
 853                         jQuery(g).append(text1_main);\r
 854                         jQuery(g).append(text2_main);\r
 855                         jQuery(g).append(text3_main);\r
 856                         jQuery(g).append(text4_main);\r
 857                         jQuery(g).append(text5_main);\r
 858                         jQuery(g).append(text6_main);\r
 859                         jQuery(g).attr("id", node_name);\r
 860                         jQuery(g).attr("type", node_type);\r
 861                         jQuery(g).attr("sub", node_name,node_list[0] + "," + node_list[1] + "," + node_list[2]);\r
 862                         if (node_type.indexOf("chain") > -1)\r
 863                                 jQuery(g).attr("flow", 0);\r
 864                         jQuery('#service_svg2').append(g);\r
 865                 }\r
 866         }\r
 867 \r
 868         function analyjson_topo(user_data) {\r
 869             //jQuery("#service_svg2").show();\r
 870                 //jQuery("#service_svg").hide();\r
 871                 //jQuery("#graph").hide();\r
 872                 //jQuery("#service_svg").empty();\r
 873                 // var username = jQuery("#getUserName").val();\r
 874                 //alert(username);\r
 875                 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
 876                     <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
 877                 jQuery("#service_svg2").html(html_init);\r
 878                 //var topo_data;\r
 879                 //  jQuery.ajax({\r
 880                 //      url: "/restconf/config/nemo-intent:users/",\r
 881                 //      type: "GET",\r
 882                 //      async: false,\r
 883                 //      dataType: "json",\r
 884                 //      success: function(data) {\r
 885                 //              console.log(data);\r
 886                 //              topo_data = data;\r
 887                 //      },\r
 888                 //      error: function(data) {\r
 889                 //              console.log(data);\r
 890                 //      }\r
 891                 // });\r
 892 \r
 893                 //var name_data_list = topo_data["users"]["user"];\r
 894 \r
 895                 //var user_json_data, user_data;\r
 896                 // for (var i in name_data_list) {\r
 897                 //      if (name_data_list[i]["user-name"] == username) {\r
 898                 //              user_data = name_data_list[i];\r
 899                 //              user_json_data = name_data_list[i]["objects"];\r
 900                 //              break;\r
 901                 //      }\r
 902                 // }\r
 903 \r
 904                 var user_json_data = user_data['objects'];\r
 905                 if (user_json_data == null)\r
 906                         return;\r
 907 \r
 908                 //host\r
 909                 var host_list = [];\r
 910                 for (var host_cursor in user_json_data["node"]) {\r
 911                         if (user_json_data["node"][host_cursor]["node-type"] != "host")\r
 912                                 continue;\r
 913                         host_list[user_json_data["node"][host_cursor]["node-id"]] = user_json_data["node"][host_cursor]["node-name"];\r
 914 \r
 915                 }\r
 916 \r
 917                 //vas\r
 918                 var vas_list = [];\r
 919                 for (var vas_cursor in user_json_data["node"]) {\r
 920                         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
 921                                 continue;\r
 922 \r
 923                         vas_list[user_json_data["node"][vas_cursor]["node-id"]] = user_json_data["node"][vas_cursor]["node-name"];\r
 924 \r
 925                 }\r
 926         \r
 927 \r
 928                 //group\r
 929                 var node_list = [];\r
 930 \r
 931                 //l2/l3-group\r
 932                 for (var lgroup_cursor in user_json_data["node"]) {\r
 933                         if (user_json_data["node"][lgroup_cursor]["node-type"] != "l2-group" && user_json_data["node"][lgroup_cursor]["node-type"] != "l3-group")\r
 934                                 continue;\r
 935                         var sub_count = 0;\r
 936                         var sub_list = [];\r
 937                         for (var sub_cursor in user_json_data["node"][lgroup_cursor]["sub-node"]) {\r
 938                                 sub_list[sub_count] = host_list[user_json_data["node"][lgroup_cursor]["sub-node"][sub_cursor]["node-id"]];\r
 939                                 sub_count++;\r
 940                         }\r
 941                         var ip='';\r
 942                         var myProperty=user_json_data["node"][lgroup_cursor]['property'];\r
 943                         if(myProperty){\r
 944                         for(var item in myProperty){\r
 945                                 if(myProperty[item]['property-name']=='ip-prefix'){\r
 946                                         ip=myProperty[item]['property-values']['string-value'][0]['value'];\r
 947                                 }\r
 948                         }\r
 949                 }\r
 950                         draw_group_data(user_json_data["node"][lgroup_cursor]["node-name"], sub_list.length, sub_list, user_json_data["node"][lgroup_cursor]["node-type"], ip);\r
 951                         redraw_node_possition_data();\r
 952                         node_list[user_json_data["node"][lgroup_cursor]["node-id"]] = user_json_data["node"][lgroup_cursor]["node-name"];\r
 953                 }\r
 954                 //chain_group\r
 955                 for (var cgroup_cursor in user_json_data["node"]) {\r
 956 \r
 957                         if (user_json_data["node"][cgroup_cursor]["node-type"] != "chain-group")\r
 958                                 continue;\r
 959                         //alert("chain");\r
 960                         var sub_count = 0;\r
 961                         var sub_list = [];\r
 962                         for (var sub_cursor in user_json_data["node"][cgroup_cursor]["sub-node"]) {\r
 963                                 //alert(user_json_data["node"][cgroup_cursor]["sub-node"][sub_cursor]["node-id"]);\r
 964                                 sub_list[sub_count] = vas_list[user_json_data["node"][cgroup_cursor]["sub-node"][sub_cursor]["node-id"]];\r
 965                                 sub_count++;\r
 966                         }\r
 967                         //alert();\r
 968                         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
 969                         redraw_node_possition_data();\r
 970                         node_list[user_json_data["node"][cgroup_cursor]["node-id"]] = user_json_data["node"][cgroup_cursor]["node-name"];\r
 971                 }\r
 972                 //ext-group\r
 973                 for (var egroup_cursor in user_json_data["node"]) {\r
 974                         if (user_json_data["node"][egroup_cursor]["node-type"] != "ext-group")\r
 975                                 continue;\r
 976                         // alert("ext");\r
 977                         var ip;\r
 978                         for (var ip_cursor in user_json_data["node"][egroup_cursor]["property"]) {\r
 979                                 if (user_json_data["node"][egroup_cursor]["property"][ip_cursor]["property-name"] == "ip-prefix") {\r
 980                                         ip = user_json_data["node"][egroup_cursor]["property"][ip_cursor]["property-values"]["string-value"][0]["value"];\r
 981                                 }\r
 982                         }\r
 983                         draw_group_data(user_json_data["node"][egroup_cursor]["node-name"], 0, '', user_json_data["node"][egroup_cursor]["node-type"], ip);\r
 984                         redraw_node_possition_data();\r
 985                         node_list[user_json_data["node"][egroup_cursor]["node-id"]] = user_json_data["node"][egroup_cursor]["node-name"];\r
 986                 }\r
 987           // console.log(node_list);\r
 988                 //connection\r
 989                 for (var conn_cursor in user_json_data["connection"]) {\r
 990                         var start_name = node_list[user_json_data["connection"][conn_cursor]["end-node"][0]["node-id"]];\r
 991                         var end_name = node_list[user_json_data["connection"][conn_cursor]["end-node"][1]["node-id"]];\r
 992                         var bandwidth;\r
 993                         if (user_json_data["connection"][conn_cursor]["property"] != null)\r
 994                                 bandwidth = user_json_data["connection"][conn_cursor]["property"][0]["property-values"]["int-value"][0]["value"];\r
 995                         else\r
 996                                 bandwidth = 100;\r
 997                         draw_connection_data(user_json_data["connection"][conn_cursor]["connection-name"], start_name, end_name, bandwidth / 100);\r
 998                 }\r
 999 \r
1000                 //flow\r
1001                 if (user_json_data["flow"] != null) {\r
1002                         var flow_list = [];\r
1003                         for (var flow_cursor in user_json_data["flow"]) {\r
1004                                 var src_ip, dst_ip;\r
1005                                 for (var match_cursor in user_json_data["flow"][flow_cursor]["match-item"]) {\r
1006                                         if (user_json_data["flow"][flow_cursor]["match-item"][match_cursor]["match-item-name"] == "dst-ip") {\r
1007                                                 dst_ip = user_json_data["flow"][flow_cursor]["match-item"][match_cursor]["match-item-value"]["string-value"];\r
1008                                         }\r
1009                                         if (user_json_data["flow"][flow_cursor]["match-item"][match_cursor]["match-item-name"] == "src-ip") {\r
1010                                                 src_ip = user_json_data["flow"][flow_cursor]["match-item"][match_cursor]["match-item-value"]["string-value"];\r
1011                                         }\r
1012                                 }\r
1013                                 draw_flow_data(src_ip, dst_ip, user_json_data["flow"][flow_cursor]["flow-name"]);\r
1014                                 flow_list[user_json_data["flow"][flow_cursor]["flow-id"]] = user_json_data["flow"][flow_cursor]["flow-name"]\r
1015                         }\r
1016 \r
1017                 }\r
1018                 //operation\r
1019                 if (user_data["operations"] != null) {\r
1020                         for (var operation_cursor in user_data["operations"]["operation"]) {\r
1021                                 var myTarget=user_data["operations"]["operation"][operation_cursor]["action"][0]['action-name'];\r
1022                                 if(myTarget!='go-through') continue;\r
1023                                 var flow_name = flow_list[user_data["operations"]["operation"][operation_cursor]["target-object"]];\r
1024                                 var chain_name = node_list[user_data["operations"]["operation"][operation_cursor]["action"][0]["parameter-values"]["string-value"][0]["value"]];\r
1025                                 var node_start = jQuery("[id='" + flow_name+"']").attr("node_start");\r
1026                                 var node_end = jQuery("[id='" + flow_name+"']").attr("node_end");\r
1027                                 var c1_flag = 0;\r
1028                                 var c2_flag = 0;\r
1029                                 for (var i = 0; i < jQuery("#service_svg2 path").length; i++) {\r
1030                                         if (jQuery("#service_svg2 path:eq(" + i + ")").attr("type") == "connection") {\r
1031                                                 var node_name_old_1 = jQuery("#service_svg2 path:eq(" + i + ")").attr("node_start");\r
1032                                                 var node_name_old_2 = jQuery("#service_svg2 path:eq(" + i + ")").attr("node_end");\r
1033                                                 console.log("old:" + node_name_old_1 + "  " + node_name_old_2);\r
1034                                                 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
1035                                                         c1_flag = 1;\r
1036                                                 }\r
1037                                         }\r
1038                                 }\r
1039                                 for (var i = 0; i < jQuery("#service_svg2 path").length; i++) {\r
1040                                         if (jQuery("#service_svg2 path:eq(" + i + ")").attr("type") == "connection") {\r
1041                                                 var node_name_old_1 = jQuery("#service_svg2 path:eq(" + i + ")").attr("node_start");\r
1042                                                 var node_name_old_2 = jQuery("#service_svg2 path:eq(" + i + ")").attr("node_end");\r
1043                                                 console.log("old:" + node_name_old_1 + "  " + node_name_old_2);\r
1044                                                 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
1045                                                         c2_flag = 1;\r
1046                                                 }\r
1047                                         }\r
1048                                 }\r
1049                                 if (c2_flag == 0 || c2_flag == 0) {\r
1050                                         alert("No connection!");\r
1051                                         return;\r
1052                                 }\r
1053                                 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
1054                                 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
1055                                 jQuery("#" + flow_name).remove();\r
1056                         }\r
1057 \r
1058                 }\r
1059         }\r
1060 \r
1061         //parse nemo language\r
1062         function parseNemoLan(userinfo) {\r
1063                 console.log(userinfo);\r
1064                 var userJsonString = JSON.stringify(userinfo);\r
1065                 var userJson = JSON.parse(userJsonString);\r
1066                 // console.log(userJson);\r
1067                 var user_data = userinfo;\r
1068                 //set host nodes connection and flow array  array[id]-->name\r
1069                 var host = [];\r
1070                 var nodes = [];\r
1071                 var connection = [];\r
1072                 var flow = [];\r
1073                 for (var i in user_data) {\r
1074                         // console.log(i);\r
1075                         if (i == 'objects') {\r
1076                                 for (var j in user_data['objects']) {\r
1077                                         // console.log(j);\r
1078                                         if (j == 'node') {\r
1079                                                 for (var k in user_data[i][j]) {\r
1080                                                         nodes[user_data[i][j][k]["node-id"]] = user_data[i][j][k]["node-name"];\r
1081                                                 }\r
1082                                         } else if (j == 'connection') {\r
1083                                                 for (var k in user_data[i][j]) {\r
1084                                                         connection[user_data[i][j][k]["connection-id"]] = user_data[i][j][k]["connection-name"];\r
1085                                                 }\r
1086                                         } else if (j == 'flow') {\r
1087                                                 for (var k in user_data[i][j]) {\r
1088                                                         flow[user_data[i][j][k]["flow-id"]] = user_data[i][j][k]["flow-name"];\r
1089                                                 }\r
1090                                         }\r
1091                                 }\r
1092                         } else if (i == 'operations') {\r
1093 \r
1094                         }\r
1095                 }\r
1096                 console.log(nodes);\r
1097                 console.log(connection);\r
1098                 console.log(flow);\r
1099                 //parse and show nemo language（node connection flow operation）\r
1100                 for (var i in user_data["objects"]) {\r
1101                         if (i == "node") {\r
1102                                 var nodeNemo = [];\r
1103                                 var node = user_data["objects"]['node'];\r
1104                                 for (var j in node) {\r
1105                                         var nemo_str='';\r
1106                                         if(node[j]['node-type']=='host'){\r
1107                                                  nemo_str += "Import Node  " + node[j]['node-name'] + " Type " + node[j]['node-type'];\r
1108                                         }else{\r
1109                                                  nemo_str += "Create Node  " + node[j]['node-name'] + " Type " + node[j]['node-type'];\r
1110                                         }                                       \r
1111                                         var sub_node = node[j]['sub-node'];\r
1112                                         if (sub_node && sub_node.length > 0) {\r
1113                                                 nemo_str += ' Contain ';\r
1114                                                 for (var k in sub_node) {\r
1115                                                         nemo_str += nodes[sub_node[k]['node-id']] + ',';\r
1116                                                 }\r
1117                                                 nemo_str = nemo_str.substring(0, nemo_str.length - 1);\r
1118                                         }\r
1119                                         var property = node[j]['property'];\r
1120                                         if (property && property.length > 0) {\r
1121                                                 nemo_str += ' Property ';\r
1122                                                 for (var k in property) {\r
1123                                                         nemo_str += property[k]['property-name'] + ':"' + property[k]['property-values']['string-value'][0]['value'] + '",';\r
1124                                                 }\r
1125                                                 nemo_str = nemo_str.substring(0, nemo_str.length - 1);\r
1126                                         }\r
1127                                         nodeNemo.push(nemo_str);\r
1128                                 }\r
1129                                 for (var item in nodeNemo) {\r
1130                                         // alert(jQuery("#nemo_str_show").html);\r
1131                                         jQuery("#nemo_str_show").append('<p>'+nodeNemo[item]+'&nbsp;&nbsp;'+'</p>');\r
1132                                 }\r
1133                                 console.log(nodeNemo);\r
1134                         } \r
1135 \r
1136                         else if (i == "connection") {\r
1137                                 var connectionNemo = [];\r
1138                                 var conn = user_data["objects"]['connection'];\r
1139                                 for (var j in conn) {\r
1140                                         var nemo_str = "Create Connection " + conn[j]['connection-name'] + ' Type ' + conn[j]['connection-type'];\r
1141                                         nemo_str += " Endnodes " + nodes[conn[j]['end-node'][0]['node-id']] + ',' + nodes[conn[j]['end-node'][1]['node-id']];\r
1142                                     var property = conn[j]['property'];\r
1143                                     if(property&&property.length>0){\r
1144                                         nemo_str+=" Property";\r
1145                                     for(var k in property){\r
1146                                         nemo_str+=' '+property[k]['property-name']+':"';\r
1147                                         var property_value=property[k]['property-values'];\r
1148                                         console.log(property_value);\r
1149                                         for(var v in property_value){//int-value or string-value\r
1150                                                 nemo_str+=property_value[v][0]['value'];\r
1151                                         }\r
1152                                         nemo_str+='",';\r
1153                                     }\r
1154                                         nemo_str = nemo_str.substring(0,nemo_str.length-1);\r
1155                                 }\r
1156 \r
1157                                         connectionNemo.push(nemo_str);\r
1158                                 }\r
1159                                 for (var item in connectionNemo) {\r
1160                                         // alert(jQuery("#nemo_str_show").html);\r
1161                                         jQuery("#nemo_str_show").append('<p>'+connectionNemo[item]+'&nbsp;&nbsp;'+'</p>');\r
1162                                 }\r
1163                                 console.log(connectionNemo);\r
1164                         } \r
1165 \r
1166                         else if (i = 'flow') {\r
1167                                 var flowNemo = [];\r
1168                                 var fl = user_data["objects"]['flow'];\r
1169                                 for (var j in fl) {\r
1170                                         var nemo_str = 'Create Flow ' + fl[j]['flow-name'];\r
1171                                         var match = fl[j]["match-item"];\r
1172                                         if (match && match.length > 0) {\r
1173                                                 nemo_str += " Match ";\r
1174                                                 for (var k in match) {\r
1175                                                         if(match[k]["match-item-value"]['string-value'])\r
1176                                                         nemo_str += match[k]['match-item-name'] + ':"' + match[k]["match-item-value"]['string-value'] + '",';\r
1177                                                     else if(match[k]["match-item-value"]['int-value'])\r
1178                                                         nemo_str += match[k]['match-item-name'] + ':' + match[k]["match-item-value"]['int-value'] + ',';\r
1179                                                 }\r
1180                                                 nemo_str = nemo_str.substring(0, nemo_str.length - 1);\r
1181                                         }\r
1182                                         flowNemo.push(nemo_str);\r
1183                                 }\r
1184 \r
1185                                 for (var item in flowNemo) {\r
1186                                         // alert(jQuery("#nemo_str_show").html);\r
1187                                         jQuery("#nemo_str_show").append('<p>'+flowNemo[item]+'&nbsp;&nbsp;'+'</p>');\r
1188                                 }\r
1189                                 console.log(flowNemo);\r
1190                         }\r
1191                 }\r
1192 \r
1193 \r
1194                 for (var i in user_data["operations"]) {\r
1195                         var opNemo = [];\r
1196                         var operation = user_data["operations"]['operation'];\r
1197                         for (var j in operation) {\r
1198                                 var nemo_str = 'Create Operation ' + operation[j]["operation-name"];\r
1199                                 // console.log(flow[operation[j]['target-object']]);\r
1200                                 nemo_str += ' Target ' + flow[operation[j]['target-object']];\r
1201                                 var action = operation[j]['action'];\r
1202                                 if (action && action.length > 0) {\r
1203                                         nemo_str += " Action "\r
1204                                         for (var k in action) {\r
1205                                                 if(action[k]['action-name']=='go-through')\r
1206                                                 nemo_str += action[k]['action-name'] + ":" + nodes[action[k]['parameter-values']["string-value"][0]['value']] + ',';\r
1207                                            if(action[k]['action-name']=='deny')\r
1208                                                 nemo_str+= action[k]['action-name']+',';\r
1209                                         }\r
1210                                         nemo_str = nemo_str.substring(0, nemo_str.length - 1);\r
1211                                 }\r
1212                                 opNemo.push(nemo_str);\r
1213                         }\r
1214                                 for (var item in opNemo) {\r
1215                                         // alert(jQuery("#nemo_str_show").html);\r
1216                                         jQuery("#nemo_str_show").append('<p>'+opNemo[item]+'&nbsp;&nbsp;'+'</p>');\r
1217                                 }\r
1218                         console.log(opNemo);\r
1219                 }\r
1220         }\r