<link href="css/bootstrap.min.css" rel="stylesheet"/>\r
<link href="css/VMMain.css" rel="stylesheet"/>\r
<link href="css/bootstrap-table.min.css" rel="stylesheet"/>\r
+\r
<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>\r
- <script type="text/javascript" src="../common/thirdparty/jquery.i18n/jquery.i18n.properties-1.0.9.js"></script>\r
+ <script type="text/javascript" src="../common/thirdparty/jquery.i18n/jquery.i18n.properties-1.0.9.js"></script>\r
<script type="text/javascript" src="js/bootstrap.min.js"></script>\r
<script type="text/javascript" src="js/rest.js"></script>\r
- <script type="text/javascript" src="js/gsolcm.js"></script>\r
+ <script type="text/javascript" src="js/gsolcm.js"></script>\r
<script type="text/javascript" src="js/bootstrap-table.min.js"></script>\r
<script>\r
$(document).ready(function () {\r
- new lcmHandler();\r
+ new lcmHandler();\r
$('[data-toggle="tooltip"]').tooltip();\r
+\r
var params = new URLSearchParams(window.location.search.slice(1));\r
+\r
var jsonData = JSON.parse((params.get("json")));\r
if (jsonData != null) {\r
$("body").empty();\r
if(sdnControllerObj != undefined){\r
paramValue = sdnControllerObj.name;\r
}\r
- } \r
+ } \r
else{\r
- var nameObj = {name:key,showName:key};\r
- name = showName(nameObj);\r
- } \r
- $("body").append('<div class="mT15 form-group row" style="margin-top:35px;margin-left:25%"><div class="col-sm-6" align="right"><label class="control-label"><span style="font-size:16px;">'+ name + ':</span></label></div><div class="col-sm-6"><input type="text" name="" maxlength="256" style="margin-left:10px;width:250px;" data-toggle="tooltip" data-placement="top" title="'+ paramValue + '" value="'+ paramValue + '" readonly disabled/></div></div>');\r
+ var nameObj = {name:key,showName:key};\r
+ name = showName(nameObj);\r
+ } \r
+ $("body").append('<div class="mT15 form-group row" style="margin-top:35px;margin-left:15%"><div class="col-sm-5" align="left"><label class="control-label"><span style="font-size:16px;">'+ name + '</span></label></div><div class="col-sm-1" align="left"><span style="font-size:16px;">:</span></div><div class="col-sm-6"><input type="text" name="" maxlength="256" style="margin-left:10px;width:250px;padding-left: 5px" data-toggle="tooltip" data-placement="top" title="'+ paramValue + '" value="'+ paramValue + '" readonly disabled/></div></div>');\r
}\r
}\r
\r
\r
<style>\r
html, body {\r
- width: 800px;\r
+ width: 99%;/*800px;*/\r
}\r
</style>\r
</head>\r
<!DOCTYPE html>\r
<html>\r
<head>\r
- <link href="css/bootstrap.min.css" rel="stylesheet" />\r
- \r
- <link href="css/bootstrap-table.min.css" rel="stylesheet" />\r
-\r
- <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>\r
- <script type="text/javascript" src="js/bootstrap.min.js"></script>\r
- <script type="text/javascript" src="js/rest.js"></script>\r
- <script type="text/javascript" src="js/bootstrap-table.min.js"></script>\r
+ <link href="css/bootstrap.min.css" rel="stylesheet" />\r
+\r
+ <link href="css/bootstrap-table.min.css" rel="stylesheet" />\r
+\r
+ <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>\r
+ <script type="text/javascript" src="js/bootstrap.min.js"></script>\r
+ <script type="text/javascript" src="js/rest.js"></script>\r
+ <script type="text/javascript" src="js/bootstrap-table.min.js"></script>\r
<script>\r
$(document).ready(function () {\r
var serviceId = getQueryStringValue("serviceId");\r
var params = new URLSearchParams(window.location.search.slice(1));\r
return params.get(key);\r
}\r
+ function acordClick_sdno() {\r
+ $("#topoContObj").show();\r
+ $("#nfvotopoContObj").hide();\r
+ }\r
+ function acordClick_nfvo() {\r
+ $("#nfvotopoContObj").show();\r
+ $("#topoContObj").hide();\r
+ }\r
+\r
</script>\r
- <meta charset="utf-8">\r
- <title>JS Bin</title>\r
- <style>\r
- \r
-.panel-group .panel-heading + .panel-collapse > .panel-body {\r
- border: 1px solid #ddd;\r
-}\r
-.panel-group,\r
-.panel-group .panel,\r
-.panel-group .panel-heading,\r
-.panel-group .panel-heading a,\r
-.panel-group .panel-title,\r
-.panel-group .panel-title a,\r
-.panel-group .panel-body,\r
-.panel-group .panel-group .panel-heading + .panel-collapse > .panel-body {\r
- border-radius: 2px;\r
- border: 0;\r
-}\r
-.panel-group .panel-heading {\r
- padding: 0;\r
-}\r
-.panel-group .panel-heading a {\r
- display: block;\r
- background: #428bca;\r
- color: #ffffff;\r
- padding: 15px;\r
- text-decoration: none;\r
- position: relative;\r
-}\r
-\r
-.panel-group .panel-heading a:hover {\r
- border: 1px solid #4AC9FF;\r
- \r
-}\r
-\r
- \r
-.panel-group .panel-heading a.collapsed {\r
- background: #eeeeee;\r
- color: inherit;\r
-}\r
-.panel-group .panel-heading a:after {\r
- content: '-';\r
- position: absolute;\r
- right: 20px;\r
- top:5px;\r
- font-size:30px;\r
-}\r
-.panel-group .panel-heading a.collapsed:after {\r
- content: '+';\r
-}\r
-.panel-group .panel-collapse {\r
- margin-top: 5px !important;\r
-}\r
-.panel-group .panel-body {\r
- background: #ffffff;\r
- padding: 15px;\r
-}\r
-.panel-group .panel {\r
- background-color: transparent;\r
-}\r
-.panel-group .panel-body p:last-child,\r
-.panel-group .panel-body ul:last-child,\r
-.panel-group .panel-body ol:last-child {\r
- margin-bottom: 0;\r
-}\r
-\r
- </style>\r
+ <meta charset="utf-8">\r
+ <title>JS Bin</title>\r
+ <style>\r
+ body {\r
+ overflow: hidden;\r
+ margin: 15px;\r
+ }\r
+ .panel-heading:hover {\r
+ border: 1px solid #4ac9ff;\r
+ color: #4ac9ff;\r
+ }\r
+\r
+ li:hover {\r
+ cursor: pointer;\r
+ color: #4ac9ff;\r
+ }\r
+ #accordion .glyphicon {\r
+ margin-right: 10px;\r
+ }\r
+\r
+ .panel-collapse > .list-group .list-group-item:first-child {\r
+ border-top-right-radius: 0;\r
+ border-top-left-radius: 0;\r
+ }\r
+\r
+ .panel-collapse > .list-group .list-group-item {\r
+ border-width: 1px 0;\r
+ }\r
+\r
+ .panel-collapse > .list-group {\r
+ margin-bottom: 0;\r
+ }\r
+\r
+ .panel-collapse .list-group-item {\r
+ border-radius: 0;\r
+ }\r
+\r
+ .panel-collapse .list-group .list-group {\r
+ margin: 0;\r
+ margin-top: 10px;\r
+ }\r
+\r
+ .panel-collapse .list-group-item li.list-group-item {\r
+ margin: 0 -15px;\r
+ border-top: 1px solid #ddd !important;\r
+ border-bottom: 0;\r
+ padding-left: 30px;\r
+ }\r
+\r
+ .panel-collapse .list-group-item li.list-group-item:last-child {\r
+ padding-bottom: 0;\r
+ }\r
+\r
+ .panel-collapse div.list-group div.list-group {\r
+ margin: 0;\r
+ }\r
+\r
+ .panel-collapse div.list-group .list-group a.list-group-item {\r
+ border-top: 1px solid #ddd !important;\r
+ border-bottom: 0;\r
+ padding-left: 30px;\r
+ }\r
+\r
+ .panel-collapse .list-group-item li.list-group-item {\r
+ border-top: 1px solid #DDD !important;\r
+ }\r
+\r
+ .selected {\r
+ /*background-color: #ddd;*/\r
+ color: #4ac9ff;\r
+ }\r
+ .panel-title>a {\r
+ display: inline-block;\r
+ width: 100%;\r
+ }\r
+\r
+ </style>\r
</head>\r
<body>\r
- \r
-<div class="container" style="margin-top:10px;">\r
\r
- <div class="panel-group" id="accordion">\r
- \r
+ <div class="row">\r
+ <div class="col-sm-3" style="width: 18%; padding-right: 0;">\r
+ <div class="panel-group" id="accordion">\r
+ <div class="panel panel-default">\r
+ <div class="panel-heading">\r
+ <h4 class="panel-title">\r
+ <a id="sdno" style="text-decoration:none;" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" onClick="acordClick_sdno();">\r
+ SDNO\r
+ </a>\r
+ </h4>\r
+ </div>\r
+ </div>\r
+ </div>\r
<div class="panel panel-default">\r
- <div class="panel-heading">\r
- <h4 class="panel-title">\r
- <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">\r
- SDNO\r
- </a>\r
- </h4>\r
- </div><!--/.panel-heading -->\r
- <div id="collapseOne" class="panel-collapse collapse in">\r
- <div class="panel-body">\r
- <!--iframe src="chartTopo.html" name="" style="width:100%" allowTransparency="true" scrolling="no" frameborder="0">\r
- </iframe>-->\r
- <object id="topoContObj" data="chartTopo.html" width="100%" height="300" type="text/html">\r
-\r
- </object>\r
- </div><!--/.panel-body -->\r
- </div><!--/.panel-collapse -->\r
- </div><!-- /.panel -->\r
-\r
- \r
- <div class="panel panel-default">\r
- <div class="panel-heading">\r
- <h4 class="panel-title">\r
- <a class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseThree">\r
- NFVO\r
- </a>\r
- </h4>\r
- </div><!--/.panel-heading -->\r
- <div id="collapseThree" class="panel-collapse collapse">\r
- <div class="panel-body">\r
- <object id="nfvotopoContObj" data="lcm_detail_nfvo_topology.html" width="100%" height="300" type="text/html">\r
-\r
- </object>\r
- </div><!--/.panel-body -->\r
- </div><!--/.panel-collapse -->\r
- </div><!-- /.panel -->\r
- </div><!-- /.panel-group -->\r
-\r
-</div><!-- /.container --> \r
- \r
- \r
+ <div class="panel-heading">\r
+ <h4 class="panel-title">\r
+ <a id="nfvo" style="text-decoration:none;" class="collapsed" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" onClick="acordClick_nfvo();">\r
+ NFVO\r
+ </a>\r
+ </h4>\r
+ </div>\r
+ </div>\r
+ </div>\r
+ <div class="col-sm-3" style="width: 82%; padding-right: 0;">\r
+ <div class="panel-body" style="padding: 0">\r
+ <object id="topoContObj" data="chartTopo.html" width="100%" height="300" type="text/html">\r
+\r
+ </object>\r
+ </div>\r
+ <div class="panel-body" style="padding: 0">\r
+ <object id="nfvotopoContObj" data="lcm_detail_nfvo_topology.html" width="100%" height="300" type="text/html">\r
+\r
+ </object>\r
+ </div>\r
+ </div>\r
+ </div>\r
+\r
\r
</body>\r
</html>
\ No newline at end of file
</style>\r
<script type="text/javascript">\r
$(document).ready(function() {\r
- //var jsondata = loadUnderlayData();\r
- \r
- var params = new URLSearchParams(window.location.search.slice(1));\r
- debugger;\r
- var jsonData = JSON.parse((params.get("jsondata")));\r
- var tblData= [];\r
- jsonData.accessPointList.forEach(function(accessPoint){\r
- tblData.push({\r
- tname:accessPoint.name,\r
- pname:'',\r
- vlan:accessPoint.typeSpecList[0].ethernetTpSpec.dot1qVlanList,\r
- site:'',\r
- ip:accessPoint.typeSpecList[0].ipTpSpec.masterIp \r
- });\r
- })\r
- $('#sai').bootstrapTable({\r
+ var jsondata = loadUnderlayData();\r
+ $('#tbl_overlay').bootstrapTable({\r
//Assigning data to table\r
- data: tblData\r
+ data: jsondata\r
});\r
$('#underlayTpDataTable').bootstrapTable({\r
//Assigning data to table\r
var jsonData = [];\r
var object = {};\r
\r
- if("SSAR" === serviceType || "SDNO" === serviceType) \r
+ if("SSAR" === serviceType)\r
{\r
- object.nodeType = "sdno"\r
+ object.nodeType = "sdn"\r
jsonData[0] = object;\r
}\r
else if("NSAR" == serviceType || "NFAR" == serviceType || "NFVO" == serviceType)\r
{\r
- object.nodeType = "nfvo";\r
+ object.nodeType = "nfv";\r
jsonData[0] = object;\r
}\r
else{\r
\r
\r
\r
- //TODO check for the \r
+ //TODO check for the type and update the tab\r
console.log("jsonData length: " + jsonData.length);\r
- for (i = 0; i < jsonData.length; i++) {\r
- console.log("jsonData Name: " + jsonData[i].nodeType);\r
+ /* for (i = 0; i < jsonData.length; i++) {\r
+ // console.log("jsonData Name: " + jsonData[i].nodeType);\r
if (jsonData[i].nodeType.indexOf('sdn') != -1) {\r
//$("#sdnoLink").text(jsonData[i].name.toUpperCase());\r
console.log("Adding Accordian to SDNO");\r
else {\r
\r
}\r
- }\r
+ } */\r
\r
$("#overlayContObj").attr('data', 'overlayvpn.html?serviceId='+serviceId);\r
$("#underlayContObj").attr('data', 'underlayvpn.html?serviceId='+serviceId);\r
content += '<li onClick="fnLoadTblData(this, \''+type+'\');" id="linkgso" class="list-group-item"><span class="glyphicon glyphicon-pencil text-primary"></span><span>OPEN-O</span></li>';\r
}\r
else if(type == "nfvo"){\r
- // content += '<li onClick="fnLoadTblData(this, \''+type+'\');" id="linknfvo" class="list-group-item"><span class="glyphicon glyphicon-pencil text-primary"></span><span>ZTE</span></li>';\r
+ //content += '<li onClick="fnLoadTblData(this, \''+type+'\');" id="linknfvo" class="list-group-item"><span class="glyphicon glyphicon-pencil text-primary"></span><span>ZTE</span></li>';\r
}\r
content += '</ul></div></div>';\r
return content;\r
<script type="text/javascript" src="js/jquery-ui-1.12.1.min.js"> </script>\r
<link href="css/jquery-ui-1.12.1.min.css" rel="stylesheet" />\r
\r
- <script type="text/javascript" src="js/highcharts.js"></script>\r
- <script type="text/javascript" src="js/exporting.js"></script>\r
+\r
+ <script src="js/topo/sigma/sigma.min.js"></script>\r
+ <script src="js/topo/sigma/sigma.renderers.edgeLabels.min.js"></script>\r
+\r
+\r
<style>\r
body {\r
overflow: hidden;\r
new lcmHandler();\r
\r
$('.modal-dialog').draggable();\r
- $("#detailCont").show();\r
+ // $("#detailCont").show();\r
var jsondata = loadGetServiceData();\r
\r
$.each(jsondata,function(k,v){\r
$(this).addClass('current').siblings().removeClass('current');\r
});\r
$("#topoCont").hide();\r
- $("#inpCont").hide();\r
+ $("#inpCont").show();\r
$("#topoContMod").hide();\r
- $("#detailContMod").show();\r
- $("#inpContMod").hide();\r
+ $("#detailContMod").hide();\r
+ $("#inpContMod").show();\r
\r
$('#sai').bootstrapTable({}) .on('click-row.bs.table', function (e, row, $element) {\r
-\r
var newURL = "accorTables.html?serviceId="+row.serviceId + "&serviceType="+row.serviceType;\r
// var newURL = "accorTables.html?serviceId="+row.serviceId ;\r
console.log("URL: "+newURL);\r
document.getElementById("tabContainer").style.display = "none";\r
document.getElementById("detailConObj").setAttribute('data', newURL);\r
- document.getElementById("detailContMod").setAttribute('data', newURL);\r
+ document.getElementById("detailContDlg").setAttribute('data', newURL);\r
document.getElementById("tabContainer").style.display = "block";\r
\r
//loadIframe("topoFrame", "chartTopo.html?serviceId="+row.serviceId);\r
document.getElementById("topoContObj").setAttribute('data', 'TopoAccor.html?serviceId='+row.serviceId);\r
+ document.getElementById("topoContDlg").setAttribute('data', 'TopoAccor.html?serviceId='+row.serviceId);\r
document.getElementById('inputcontent').setAttribute('data', 'InputData.html?json='+ JSON.stringify(row));\r
document.getElementById('inputcontentDlg').setAttribute('data', 'InputData.html?json='+ JSON.stringify(row));\r
});\r
\r
<div class="detail" style="margin:10px;border-radius:5px;">\r
<div class="detail-top" style="margin-top:10px;border-radius:5px;">\r
- <ul class="nav nav-tabs nav-justified vmapp-margin">\r
+ <span><h2 style="margin-left: 1%">Detailed Info</h2></span>\r
+ \r
+\r
+ \r
+ \r
+ <!-- <ul class="nav nav-tabs nav-justified vmapp-margin">\r
<li class="active basic">\r
<a href="#" onClick="showDetContMod();" id="" data-toggle="tab">\r
<span>Detail Info</span>\r
<span>Input Data</span>\r
</a>\r
</li>\r
- </ul>\r
+ </ul> -->\r
\r
<div id="detailContMod">\r
- <object data="accorTables.html" width="100%" height="300" type="text/html">\r
+ <object id="detailContDlg" data="accorTables.html" width="100%" height="300" type="text/html">\r
\r
</object>\r
</div>\r
<div id="topoContMod" style="display:none;">\r
- <object data="chartTopo.html" width="100%" height="300" type="text/html">\r
+ <object id="topoContDlg" data="TopoAccor.html" width="100%" height="300" type="text/html">\r
\r
</object>\r
<!--<iframe id="topoFrame" src="chartTopo.html" name="" style="width:100%; height:400px;" allowTransparency="true" scrolling="no" frameborder="0">\r
\r
<div id="tabContainer" class="detail" style="border-radius:5px;display: none">\r
<div class="detail-top" style="margin-top:2px;border-radius:5px;">\r
- <ul class="nav nav-tabs nav-justified vmapp-margin">\r
+\r
+ <span><h2 style="margin-left: 1%">Detailed Info</h2></span>\r
+\r
+ <div id="inpCont" style="display:none;">\r
+ <object id="inputcontent" src="InputData.html" width="100%" height="300" type="text/html">\r
+ </object>\r
+ </div>\r
+ <!-- <ul class="nav nav-tabs nav-justified vmapp-margin">\r
\r
<li class="active basic">\r
<a href="#" onClick="showDetCont();" id="detHov" data-toggle="tab">\r
</a>\r
</li>\r
\r
- </ul>\r
+ </ul> -->\r
</div>\r
\r
<div style="border-radius:5px;">\r
--- /dev/null
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac1_ip=Left AC
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac1_peer_ip=Left CE IP
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac1_port=Left Port
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac1_route=Left Route
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac1_svlan=Left VLAN
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac2_ip=Right AC
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac2_peer_ip=Right CE IP
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac2_port=Right Port
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac2_route=Right Route
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.ac2_svlan=Right VLAN
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.description=Description
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.name=Service Name
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.pe1_ip=Left PE IP
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.pe2_ip=Right PE IP
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.serviceType=Service Type
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.technology=Technology
+tosca.nodes.sdn.ext.NS.ns_underlayervpn.topology=Topology
+tosca.nodes.sdn.ext.NS.enterprise2DC.dcFWIP=Firewall IP
+tosca.nodes.sdn.ext.NS.enterprise2DC.dcGWIP=Gateway IP
+tosca.nodes.sdn.ext.NS.enterprise2DC.dcLBIP=Load Balancer IP
+tosca.nodes.sdn.ext.NS.enterprise2DC.description=Description
+tosca.nodes.sdn.ext.NS.enterprise2DC.id=ID
+tosca.nodes.sdn.ext.NS.enterprise2DC.name=Service Name
+tosca.nodes.sdn.ext.NS.enterprise2DC.siteAccessPortVlan=ThinCPE VLAN
+tosca.nodes.sdn.ext.NS.enterprise2DC.siteCidr=Enterprise cidr
+tosca.nodes.sdn.ext.NS.enterprise2DC.siteThinCpeIP=ThinCPE IP
+tosca.nodes.sdn.ext.NS.enterprise2DC.siteVNI=ThinCPE VxLAN ID
+tosca.nodes.sdn.ext.NS.enterprise2DC.vCPE_MgrIp=vCPE IP
+tosca.nodes.sdn.ext.NS.enterprise2DC.vpcName=VPC Name
+tosca.nodes.sdn.ext.NS.enterprise2DC.vpcSubnetCidr=VPC cidr
+tosca.nodes.sdn.ext.NS.enterprise2DC.vpcSubnetName=VPC Subnet Name
+tosca.nodes.sdn.ext.NS.enterprise2DC.vpcVNI=VPC VxLAN ID
+tosca.nodes.nfv.NS.VBRAS_NS.externalDataNetworkName=External Data Network Name
+tosca.nodes.nfv.NS.VBRAS_NS.externalManageNetworkName=External Management Network Name
+tosca.nodes.nfv.NS.VCPE_NS.sfc_data_network=SFC Data Network Name
+tosca.nodes.nfv.NS.VCPE_NS.externalManageNetworkName=External Management Network Name
+tosca.nodes.nfv.NS.VCPE_NS.NatIpRange=Nat Ip Range
+tosca.nodes.nfv.NS.VCPE_NS.m6000_mng_ip=M6000 Mng IP
+tosca.nodes.nfv.NS.VCPE_NS.externalPluginManageNetworkName=External Plugin Management Network Name
+tosca.nodes.nfv.NS.VCPE_NS.externalDataNetworkName=External Data Network Name
+tosca.nodes.nfv.NS.POP_NS.sfc_data_network=SFC Data Network Name
+tosca.nodes.nfv.NS.POP_NS.externalManageNetworkName=External Management Network Name
+tosca.nodes.nfv.NS.POP_NS.NatIpRange=Nat Ip Range
+tosca.nodes.nfv.NS.POP_NS.m6000_mng_ip=M6000 Mng IP
+tosca.nodes.nfv.NS.POP_NS.externalPluginManageNetworkName=External Plugin Management Network Name
+tosca.nodes.nfv.NS.POP_NS.externalCompanyFtpDataNetworkName=External Company Ftp Data Network Name
+tosca.nodes.nfv.NS.POP_NS.externalDataNetworkName=External Data Network Name
+ac1_ip=Left AC
+ac1_peer_ip=Left CE IP
+ac1_port=Left Port
+ac1_route=Left Route
+ac1_svlan=Left VLAN
+ac2_ip=Right AC
+ac2_peer_ip=Right CE IP
+ac2_port=Right Port
+ac2_route=Right Route
+ac2_svlan=Right VLAN
+description=Description
+name=Service Name
+pe1_ip=Left PE IP
+pe2_ip=Right PE IP
+serviceType=Service Type
+technology=Technology
+topology=Topology
+dcFWIP=Firewall IP
+dcGWIP=Gateway IP
+dcLBIP=Load Balancer IP
+description=Description
+id=ID
+name=Service Name
+siteAccessPortVlan=ThinCPE VLAN
+siteCidr=Enterprise cidr
+siteThinCpeIP=ThinCPE IP
+siteVNI=ThinCPE VxLAN ID
+vCPE_MgrIp=vCPE IP
+vpcName=VPC Name
+vpcSubnetCidr=VPC cidr
+vpcSubnetName=VPC Subnet Name
+vpcVNI=VPC VxLAN ID
+externalDataNetworkName=External Data Network Name
+externalManageNetworkName=External Management Network Name
+sfc_data_network=SFC Data Network Name
+externalManageNetworkName=External Management Network Name
+NatIpRange=Nat Ip Range
+m6000_mng_ip=M6000 Mng IP
+externalPluginManageNetworkName=External Plugin Management Network Name
+externalDataNetworkName=External Data Network Name
+sfc_data_network=SFC Data Network Name
+externalManageNetworkName=External Management Network Name
+NatIpRange=Nat Ip Range
+m6000_mng_ip=M6000 Mng IP
+externalPluginManageNetworkName=External Plugin Management Network Name
+externalCompanyFtpDataNetworkName=External Company Ftp Data Network Name
+externalDataNetworkName=External Data Network Name
\ No newline at end of file
});\r
});\r
\r
-})
\ No newline at end of file
+})\r
).then(
function(template) {
if(template.serviceType === 'GSO') {
- return fetchGsoTemplateInputParameters(templateId);
+ return fetchGsoTemplateInputParameters(templateId, template);
} else if(template.serviceType === 'NFVO') {
- return fetchNfvoTemplateInputParameters(templateId);
+ return fetchNfvoTemplateInputParameters(templateId, template);
} else if(template.serviceType === 'SDNO') {
- return fetchSdnoTemplateInputParameters(templateId);
+ return fetchSdnoTemplateInputParameters(templateId, template);
}
}
).then(
template.name = response.templateName;
template.gsarId = response.csarId;
template.id = response.id;
+ template.nodeType = '';
return fetchCsar(template.gsarId);
}
).then(
});
}
-function fetchGsoTemplateInputParameters(templateId) {
+function fetchGsoTemplateInputParameters(templateId, template) {
var defer = $.Deferred();
$.when(
fetchTemplateParameterDefinitions(templateId),
function (templateParameterResponse, nestingTempatesParas, vimInfoResponse, sdnControllersResponse) {
var inputs = templateParameterResponse[0].inputs.map(function(input) {
input.showName = input.name;
+ if(template.nodeType === null || template.nodeType === undefined || template.nodeType.length === 0) {
+ input.i18nKey = input.name;
+ } else {
+ input.i18nKey = template.nodeType + '.' +input.name;
+ }
return input;
});
var inputParas = concat(inputs, nestingTempatesParas);
var inputs = serviceTemplate.inputs.map(function(input) {
input.showName = input.name;
input.name = nodeTemplate.type + '.' + input.name;
+ input.i18nKey = nodeTemplate.type + '.' + input.name;
return input;
});
$.when(
type: 'location',
description: nodeTemplate.name + ' Location',
required: 'true',
- showName: nodeTemplate.name + ' Location'
+ showName: nodeTemplate.name + ' Location',
+ i18nKey: nodeTemplate.name + ' Location'
});
inputs.push({
name: nodeTemplate.type + '.sdncontroller',
type: 'sdncontroller',
description: nodeTemplate.name + ' SDN Controller',
required: 'true',
- showName: nodeTemplate.name + ' SDN Controller'
+ showName: nodeTemplate.name + ' SDN Controller',
+ i18nKey: nodeTemplate.name + ' SDN Controller'
});
}
nodeAggregatation.notify(inputs);
return {changed: false, parameters: inputParameters, vimInfos: vims, sdnControllers: controllers};
}
-function fetchNfvoTemplateInputParameters(templateId) {
+function fetchNfvoTemplateInputParameters(templateId, template) {
var defer = $.Deferred();
$.when(
fetchTemplateParameterDefinitions(templateId),
var inputParas = templateParameterResponse[0].inputs;
inputParas = inputParas.map(function(input) {
input.showName = input.name;
+ input.i18nKey = template.nodeType + '.' + input.name;
return input;
});
inputParas.push({
type: 'location',
description: 'Location',
required: 'true',
- showName: 'Location'
+ showName: 'Location',
+ i18nKey: 'Location'
});
inputParas.push({
name: 'sdncontroller',
type: 'sdncontroller',
description: 'SDN Controller',
required: 'true',
- showName: 'SDN Controller'
+ showName: 'SDN Controller',
+ i18nKey: 'SDN Controller'
});
templateParameters = translateToTemplateParameters(inputParas, vims, sdnControllers);
defer.resolve(templateParameters);
return defer;
}
-function fetchSdnoTemplateInputParameters(templateId) {
+function fetchSdnoTemplateInputParameters(templateId, template) {
var defer = $.Deferred();
$.when(
fetchTemplateParameterDefinitions(templateId)
function (templateParameterResponse) {
var inputs = templateParameterResponse.inputs.map(function(input) {
input.showName = input.name;
+ input.i18nKey = template.nodeType + '.' + input.name;
return input;
})
templateParameters = translateToTemplateParameters(inputs, [], []);
serviceInstance.serviceId = response.serviceId;
var gsoServiceUri = '/openoapi/gso/v1/services/' + response.serviceId;
var timerDefer = $.Deferred();
- var timeout = 600000;
+ var timeout = 3600000;
var fun = function() {
if(timeout === 0) {
timerDefer.resolve({
var jobId = response.serviceId;
var jobStatusUri = lcmUri + '/jobs/' + jobId;
var timerDefer = $.Deferred();
- var timeout = 600000;
+ var timeout = 3600000;
var fun = function() {
if(timeout === 0) {
timerDefer.resolve({
} else if (serviceType === 'NFVO') {
var nfvoLcmUri = '/openoapi/nslcm/v1';
deleteNonGsoServiceInstance(gatewayService, nfvoLcmUri, instanceId, remove, failFun);
- } else if (serviceType === 'SDNO' || serviceType === 'SSAR') {
+ } else if (serviceType === 'SDNO') {
var sdnoLcmUri = '/openoapi/sdnonslcm/v1';
deleteNonGsoServiceInstance(gatewayService, sdnoLcmUri, instanceId, remove, failFun);
}
function(response) {
var gsoServiceUri = '/openoapi/gso/v1/services/toposequence/' + instanceId;
var timerDefer = $.Deferred();
- var timeout = 600000;
+ var timeout = 3600000;
var fun = function() {
if(timeout === 0) {
timerDefer.resolve({
var jobId = response.jobId;
var jobStatusUri = lcmUri + '/jobs/' + jobId;
var timerDefer = $.Deferred();
- var timeout = 600000;
+ var timeout = 3600000;
var fun = function() {
if(timeout === 0) {
timerDefer.resolve({
--- /dev/null
+(function(){var c;c=jQuery;c.bootstrapGrowl=function(f,a){var b,e,d;a=c.extend({},c.bootstrapGrowl.default_options,a);b=c("<div>");b.attr("class","bootstrap-growl alert");a.type&&b.addClass("alert-"+a.type);a.allow_dismiss&&(b.addClass("alert-dismissible"),b.append('<button class="close" data-dismiss="alert" type="button"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>'));b.append(f);a.top_offset&&(a.offset={from:"top",amount:a.top_offset});d=a.offset.amount;c(".bootstrap-growl").each(function(){return d= Math.max(d,parseInt(c(this).css(a.offset.from))+c(this).outerHeight()+a.stackup_spacing)});e={position:"body"===a.ele?"fixed":"absolute",margin:0,"z-index":"9999",display:"none"};e[a.offset.from]=d+"px";b.css(e);"auto"!==a.width&&b.css("width",a.width+"px");c(a.ele).append(b);switch(a.align){case "center":b.css({left:"50%","margin-left":"-"+b.outerWidth()/2+"px"});break;case "left":b.css("left","20px");break;default:b.css("right","20px")}b.fadeIn();0<a.delay&&b.delay(a.delay).fadeOut(function(){return c(this).alert("close")}); return b};c.bootstrapGrowl.default_options={ele:"body",type:"info",offset:{from:"top",amount:20},align:"right",width:250,delay:4E3,allow_dismiss:!0,stackup_spacing:10}}).call(this);
}
},
$restUrl: {
- queryNodeInstanceUrl: "/openoapi/nslcm/v1/ns/"
+ queryNodeInstanceUrl: "/openoapi/nslcm/v1.0/ns/"
},
$init: function () {
vm.$initInstanceData();
],
"aaData": tableData
});
- },
+ };
//nodes list table
nodesList :{
var instanceId = params[0].substring(params[0].indexOf('=') + 1);
vm.instanceId = instanceId;
- vm.$restUrl.queryNodeInstanceUrl = vm.$restUrl.queryNodeInstanceUrl + instanceId;
+ vm.$restUrl.queryNodeInstanceUrl = commonUtil.format(vm.$restUrl.queryNodeInstanceUrl, instanceId);
vm.$init();
}
};
console.log("URL = " + JSON.stringify(url));\r
});\r
\r
-function loadUnderlayData(serviceId) {\r
- var requestUrl = "/openoapi/sdnol3vpn/v1/l3vpns/" + serviceId;\r
- var returnObj;\r
+function loadUnderlayData() {\r
+ var requestUrl = "/openoapi/sdnol3vpn/v1/l3vpns";\r
$\r
.ajax({\r
type: "GET",\r
url: requestUrl,\r
- async: false,\r
contentType: "application/json",\r
success: function (jsonobj) {\r
- returnObj = jsonobj;\r
+ alert("loading underlay data");\r
+ //TODO: Update the table\r
},\r
error: function (xhr, ajaxOptions, thrownError) {\r
//alert("Error on getting underlay data : " + xhr.responseText);\r
}\r
});\r
- return returnObj;\r
}\r
function deleteUnderlayData(objectId) {\r
var requestUrl = "/openoapi/sdnol3vpn/v1/l3vpns/" + objectId;\r
}\r
});\r
}\r
-function loadOverlayData(serviceId) {\r
- var requestUrl = "/openoapi/sdnooverlay/v1/site2dc-vpn/" + serviceId;\r
- var returnObj;\r
+function loadOverlayData() {\r
+ var requestUrl = "/openoapi/sdnooverlayvpn/v1/site2dc-vpn";\r
$\r
.ajax({\r
type: "GET",\r
url: requestUrl,\r
- async: false,\r
contentType: "application/json",\r
success: function (jsonobj) {\r
- returnObj = jsonobj;\r
+ alert("loading Overlay data...");\r
+ //TODO: Update the table\r
},\r
error: function (xhr, ajaxOptions, thrownError) {\r
//alert("Error on getting Overlayvpn data : " + xhr.responseText);\r
}\r
});\r
- return returnObj;\r
}\r
function refressTpDataTable(overlayTable, TpTable) {\r
alert("refesssing Tp data table");\r
});\r
});\r
\r
-})
\ No newline at end of file
+})\r
<script type="text/javascript">\r
$(document).ready(function () {\r
var jsondata = [];\r
- var params = new URLSearchParams(window.location.search.slice(1));\r
- var serviceId = params.get("serviceId");\r
- jsondata = loadOverlayData(serviceId);\r
- var tabData = [];\r
- \r
- var tableRow = {};\r
- tableRow.desc = jsondata.description;\r
- tableRow.name= jsondata.name;\r
- tableRow.thinCpe= jsondata.site.cidr;//TODO\r
- tableRow.port = "";\r
- //tableRow.dcName=jsondata.vpc.name;\r
- tableRow.vpc = jsondata.vpc.name;\r
- tableRow.vpcCidr= jsondata.vpc.site.cidr;\r
- tabData[0]=tableRow;\r
-\r
+ jsondata = loadOverlayData();\r
\r
$('#sai').bootstrapTable({\r
//Assigning data to table\r
- data: tabData\r
+ data: jsondata\r
+ });\r
+ $('.table tbody tr').click(function () {\r
+ $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');\r
});\r
- $('.table tbody tr').click(function () {\r
- $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');\r
- });\r
\r
- $('#sai').on('sort.bs.table', function () {\r
- \r
+ $('#sai').on('sort.bs.table', function () {\r
\r
- }).on('click-row.bs.table', function () {\r
- \r
- \r
- $('.table tbody tr').click(function() {\r
- \r
- $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');\r
- });\r
- \r
- });\r
- });\r
\r
- function operateFormatter(value, row, index) {\r
- return [\r
- '<img class="siteDeleteImg" src="images/delete.png" href="javascript:void(0)" style="cursor: pointer" name="title" title="Delete" />'\r
- ].join('');\r
- }\r
- window.operateEvents = {\r
- 'click .siteDeleteImg': function(e, value, row, index) {\r
- // TO DO ajex call for delete\r
- console.log(value, row, index);\r
- }\r
- };\r
- </script>\r
+ }).on('click-row.bs.table', function () {\r
+\r
+\r
+ $('.table tbody tr').click(function() {\r
+\r
+ $(this).addClass('openoTable_row_selected').siblings().removeClass('openoTable_row_selected');\r
+ });\r
+\r
+ });\r
+\r
+ var serviceId = getQueryStringValue("serviceId");\r
+ console.log("overlayvpn - serviceId : " + serviceId);\r
+ });\r
+\r
+ function getQueryStringValue (key) {\r
+ var params = new URLSearchParams(window.location.search.slice(1));\r
+ return params.get(key);\r
+ }\r
+\r
+ function operateFormatter(value, row, index) {\r
+ return [\r
+ '<img class="siteDeleteImg" src="images/delete.png" href="javascript:void(0)" style="cursor: pointer" name="title" title="Delete" />'\r
+ ].join('');\r
+ }\r
+ window.operateEvents = {\r
+ 'click .siteDeleteImg': function(e, value, row, index) {\r
+ // TO DO ajex call for delete\r
+ console.log(value, row, index);\r
+ }\r
+ };\r
+ </script>\r
<style>\r
.dropdown-menu {\r
min-width: 10px;\r
<tr>\r
<th data-field="name" data-sortable="true" data-filter-control="input">Name</th>\r
<th data-field="desc" data-sortable="true" data-filter-control="input">Description</th>\r
- <th data-field="thinCpe" data-sortable="true" data-filter-control="input">Site CIDR</th>\r
+ <th data-field="thinCpe" data-sortable="true" data-filter-control="input">Thin CPE</th>\r
<th data-field="port" data-sortable="true" data-filter-control="input">Port:Vlan ID</th>\r
- <!-- <th data-field="dcName" data-sortable="true" data-filter-control="input">DC Name</th> -->\r
- <th data-field="vpc" data-sortable="true" data-filter-control="input">VPC Name</th>\r
+ <th data-field="dcName" data-sortable="true" data-filter-control="input">DC Name</th>\r
+ <th data-field="vpc" data-sortable="true" data-filter-control="input">VPC</th>\r
<th data-field="vpcCidr" data-sortable="true" data-filter-control="input">VPC CIDR</th>\r
<th data-field="action" data-sortable="">Action</th>\r
</tr>\r
</div>\r
</div>\r
\r
-</div>\r
+\r
</body>\r
</html>
\ No newline at end of file
<script type="text/javascript">\r
$(document).ready(function () {\r
\r
- var params = new URLSearchParams(window.location.search.slice(1));\r
- var serviceId = params.get("serviceId");\r
- var jsondata = loadUnderlayData(serviceId);\r
- var tabData = [];\r
- var tableRow = {};\r
- tableRow.name = jsondata.name;\r
- tableRow.desc= jsondata.description;\r
- tableRow.state= jsondata.operStatus;//TODO\r
- tabData[0] = tableRow;\r
- $('#sai').bootstrapTable({\r
+\r
+ var jsondata = loadUnderlayData();\r
+ $('#tbl_overlay').bootstrapTable({\r
//Assigning data to table\r
- data: tabData\r
+ data: jsondata\r
});\r
$('#underlayTpDataTable').bootstrapTable({\r
//Assigning data to table\r
});\r
\r
});\r
+\r
+ var serviceId = getQueryStringValue("serviceId");\r
console.log("underlayvpn - serviceId : " + serviceId);\r
- $("#underlay_tp").attr('data', 'UnderLay_TP.html?jsondata='+JSON.stringify(jsondata));\r
+\r
});\r
\r
function getQueryStringValue (key) {\r
</div>\r
\r
<div id="tpDiv">\r
- <object id="underlay_tp" data="UnderLay_TP.html" width="100%" height="450" type="text/html"></object>\r
- <!--<iframe src="UnderLay_TP.html" style="width:100%;height:450px;" name="targetframe" allowTransparency="true" scrolling="no" frameborder="0">\r
- </iframe>-->\r
+ <iframe src="UnderLay_TP.html" style="width:100%;height:450px;" name="targetframe" allowTransparency="true" scrolling="no" frameborder="0">\r
+ </iframe>\r
</div>\r
<div id="filterTpLogicalType_select_popupcontainer" class="openo openo-select-popup-container openo-hide"\r
style="width: 155px; max-height: 130px; left: 628px; top: 104px; z-index: 1761;">\r
Code Review / vnfsdk / refrepo.git / commitdiff