diff options
Diffstat (limited to 'portal-lifecyclemgr/src/main/webapp/lifecyclemgr/chartTopo.html')
-rw-r--r-- | portal-lifecyclemgr/src/main/webapp/lifecyclemgr/chartTopo.html | 268 |
1 files changed, 0 insertions, 268 deletions
diff --git a/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/chartTopo.html b/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/chartTopo.html deleted file mode 100644 index e263b97e..00000000 --- a/portal-lifecyclemgr/src/main/webapp/lifecyclemgr/chartTopo.html +++ /dev/null @@ -1,268 +0,0 @@ -
-<!-- /* Copyright 2016-2017, Huawei Technologies Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
- -->
-
-<!DOCTYPE html>
-<html>
-
-<head lang="en">
- <meta charset="UTF-8">
- <title></title>
- <link href="css/bootstrap.min.css" rel="stylesheet" />
- <link href="css/VMMain.css" rel="stylesheet" />
- <link href="css/bootstrap-table.min.css" rel="stylesheet" />
-
- <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
- <script type="text/javascript" src="js/bootstrap.min.js"></script>
- <script type="text/javascript" src="js/rest.js"></script>
- <script type="text/javascript" src="js/bootstrap-table.min.js"></script>
- <script type="text/javascript" src="js/jquery-ui-1.12.1.min.js"> </script>
- <link href="css/jquery-ui-1.12.1.min.css" rel="stylesheet" />
-
-
- <script src="js/topo/sigma/sigma.min.js"></script>
- <script src="js/topo/sigma/sigma.renderers.edgeLabels.min.js"></script>
-
-
- <style>
- body {
- overflow: hidden;
- }
- .panel-heading:hover {
- border: 1px solid #4ac9ff;
- color: #4ac9ff;
- }
- li:hover {
- cursor: pointer;
- color: #4ac9ff;
- }
- body {
- margin: 15px;
- }
- #accordion .glyphicon {
- margin-right: 10px;
- }
- .panel-collapse>.list-group .list-group-item:first-child {
- border-top-right-radius: 0;
- border-top-left-radius: 0;
- }
- .panel-collapse>.list-group .list-group-item {
- border-width: 1px 0;
- }
- .panel-collapse>.list-group {
- margin-bottom: 0;
- }
- .panel-collapse .list-group-item {
- border-radius: 0;
- }
- .panel-collapse .list-group .list-group {
- margin: 0;
- margin-top: 10px;
- }
- .panel-collapse .list-group-item li.list-group-item {
- margin: 0 -15px;
- border-top: 1px solid #ddd !important;
- border-bottom: 0;
- padding-left: 30px;
- }
- .panel-collapse .list-group-item li.list-group-item:last-child {
- padding-bottom: 0;
- }
- .panel-collapse div.list-group div.list-group {
- margin: 0;
- }
- .panel-collapse div.list-group .list-group a.list-group-item {
- border-top: 1px solid #ddd !important;
- border-bottom: 0;
- padding-left: 30px;
- }
- .panel-collapse .list-group-item li.list-group-item {
- border-top: 1px solid #DDD !important;
- }
- </style>
- <script>
-
- $(function () {
- var serviceId = getQueryStringValue("serviceId");
- console.log("TOPO - serviceId : "+ serviceId);
-
-
-
- $('#container').highcharts({
- chart: {
- backgroundColor: 'rgb(250,250,250)',
- events: {
- load: function () {
-
-
- var ren = this.renderer,
- colors = Highcharts.getOptions().colors,
- rightArrow = ['M', 0, 0, 'L', 100, 0, 'L', 95, 5, 'M', 100, 0, 'L', 95, -5],
- leftArrow = ['M', 100, 0, 'L', 0, 0, 'L', 5, 5, 'M', 0, 0, 'L', 5, -5];
-
-
- ren.label('vCpe Name', 10, 82)
- .attr({
- fill: colors[0],
- stroke: 'white',
- 'stroke-width': 2,
- padding: 5,
- r: 5
- })
- .css({
- color: 'white'
- })
- .add()
- .shadow(true);
-
-
- ren.path(rightArrow)
- .attr({
- 'stroke-width': 1,
- stroke: colors[1]
- })
- .translate(95, 95)
- .add();
-
- ren.label('', 50, 75)
- .css({
- fontSize: '10px',
- color: colors[3]
- })
- .add();
-
-
-
- ren.label('Site Name', 210, 82)
- .attr({
- fill: colors[0],
- stroke: 'white',
- 'stroke-width': 2,
- padding: 5,
- r: 5
- })
- .css({
- color: 'white'
- })
- .add()
- .shadow(true);
-
-
- ren.label('DC Name', 420, 82)
- .attr({
- fill: colors[0],
- stroke: 'white',
- 'stroke-width': 2,
- padding: 5,
- r: 5
- })
- .css({
- color: 'white'
- })
- .add()
- .shadow(true);
-
- ren.label('VPC', 620, 82)
- .attr({
- fill: colors[0],
- stroke: 'white',
- 'stroke-width': 2,
- padding: 5,
- r: 5
- })
- .css({
- color: 'white'
- })
- .add()
- .shadow(true);
-
-
-
- ren.path(rightArrow)
- .attr({
- 'stroke-width': 1,
- stroke: colors[1]
- })
- .translate(300, 95)
- .add();
-
- ren.path(rightArrow)
- .attr({
- 'stroke-width': 1,
- stroke: colors[1]
- })
- .translate(500, 95)
- .add();
-
-
- }
- }
- },
- title: {
- text: 'SDNO-TOPO',
- style: {
- color: 'black'
- }
- }
-
- });
- function addAccordionData(paneltype, text){
- var content = '';
- content += '<div id="panel_'+paneltype+'" class="panel panel-default" onclick="acordClick(\''+paneltype+'\');"><div class="panel-heading">';
- content += '<h4 class="panel-title">';
- content += '<a style="text-decoration:none;" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">';
- content += '<span id="sdnoLink">'+text+'</span></a>';
- content += '</h4></div>';
- content += '</div></div>';
- return content;
- }
- function getQueryStringValue (key) {
- var params = new URLSearchParams(window.location.search.slice(1));
- return params.get(key);
- }
- });
- function acordClick(panelType) {
- //TODO: Act according to the panelType. value may be sdno, gso or nfvo
- console.log(panelType + " Clicked");
- }
- </script>
-
- <style>
-hr{
- margin:1px;
-}
-</style>
-</head>
-
-
-<body>
-<div class="">
- <div class="row">
- <div class="col-sm-3" style="width:18%">
- <div class="panel-group" id="accordion">
- </div>
- </div>
- <div class="col-sm-3" id="dashboard" style="width:82%">
- <div id="container" style="width: 750px; height: 250px; margin: 0 auto; display: inline-block;"> </div>
- </div>
- </div>
-</div>
-
-
-
-
-</body>
-</html>
|