openo-portal/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/js/topo/OverlayTopology.js

   1 /* Copyright 2016, Huawei Technologies Co., Ltd.
   2  *
   3  * Licensed under the Apache License, Version 2.0 (the "License");
   4  * you may not use this file except in compliance with the License.
   5  * You may obtain a copy of the License at
   6  *
   7  *    http://www.apache.org/licenses/LICENSE-2.0
   8  *
   9  * Unless required by applicable law or agreed to in writing, software
  10  * distributed under the License is distributed on an "AS IS" BASIS,
  11  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  12  * See the License for the specific language governing permissions and
  13  * limitations under the License.
  14  */
  15
  16 function extractOverlayVPNId()
  17 {
  18   var parameters = location.search.substring(1).split("&");
  19   var temp = parameters[0].split("=");
  20   var id = unescape(temp[1]);
  21
  22   return id;
  23 }
  24
  25 function Topology(containerId) {
  26
  27         /**
  28          * IMPORTANT: This only works with the canvas renderer. TBD in the future
  29          * will also support the WebGL renderer.
  30          */
  31         sigma.utils.pkg('sigma.canvas.nodes');
  32
  33         this.s = new sigma({
  34                 graph : {
  35                         nodes : [],
  36                         edges : []
  37                 },
  38                 renderer : {
  39                         // IMPORTANT:
  40                         // This works only with the canvas renderer, so the
  41                         // renderer type set as "canvas" is necessary here.
  42                         container : document.getElementById(containerId),
  43                         type : 'canvas'
  44                 },
  45                 settings : {
  46                         minNodeSize : 8,
  47                         maxNodeSize : 64,
  48                         edgeLabelSize : 'proportional'
  49                 }
  50         });
  51         this.addNode = addNode;
  52         this.addEdge = addEdge;
  53 }
  54
  55 function addNode(node) {
  56
  57         this.s.graph.addNode(node);
  58
  59 }
  60
  61 function addEdge(edge) {
  62         this.s.graph.addEdge(edge);
  63 }
  64
  65 function init() {
  66
  67         var node1 = new Node("1", "ThinCPE", 16, "device_icon", 0.1, 0.5);
  68   var node2 = new Node("2", "vCPE", 16, "device_icon", 0.4, 0.5);
  69         var node3 = new Node("3", "GW", 16, "device_icon", 0.8, 0.5);
  70
  71   var node6 = new Node("6", "FW", 8, "sfc_device_icon", 0.85, 0.4);
  72   var node7 = new Node("7", "LB", 8, "sfc_device_icon", 0.9, 0.3);
  73   var node8 = new Node("8", "VPC", 48, "network_icon", 1.05, 0.4);
  74
  75   var node4 = new Node("4", "vFW", 8, "sfc_device_icon", 0.32, 0.35);
  76   var node5 = new Node("5", "vLB", 8, "sfc_device_icon", 0.48, 0.35);
  77
  78         var edge1 = new Edge("e1", "VxLAN", "1", "2", 0.5, "blue");
  79         var edge2 = new Edge("e2", "IPSec", "2", "3", 0.5, "green");
  80
  81
  82   var edge3 = new Edge("e3", "", "2", "4", 0.5, "grey");
  83   var edge4 = new Edge("e4", "", "4", "5", 0.5, "grey");
  84   var edge5 = new Edge("e5", "", "5", "2", 0.5, "grey");
  85
  86   var edge6 = new Edge("e6", "", "3", "6", 0.5, "grey");
  87   var edge7 = new Edge("e7", "", "6", "7", 0.5, "grey");
  88   var edge8 = new Edge("e8", "", "7", "8", 0.5, "grey");
  89
  90         var topology = new Topology("container");
  91
  92         topology.addNode(node1);
  93         topology.addNode(node2);
  94         topology.addNode(node3);
  95   topology.addNode(node4);
  96         topology.addNode(node5);
  97   topology.addNode(node6);
  98   topology.addNode(node7);
  99         topology.addNode(node8);
 100
 101         topology.addEdge(edge1);
 102         topology.addEdge(edge2);
 103   topology.addEdge(edge3);
 104   topology.addEdge(edge4);
 105         topology.addEdge(edge5);
 106
 107   topology.addEdge(edge6);
 108   topology.addEdge(edge7);
 109         topology.addEdge(edge8);
 110
 111
 112         CustomShapes.init(topology.s);
 113         topology.s.refresh();
 114 }
 115
 116 $(document).ready(function() {
 117         init();
 118 });