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