<script src="src/app/nemo/module/keyWords.js"></script>\r
<script src="src/app/nemo/module/migrate.js"></script>\r
<!-- SFC -->\r
- <!-- // <script src="src/app/nemo/module/test/servicechain_userJson.js"></script> -->\r
+ <!-- // <script src="src/app/nemo/module/test/servicechain_userJson.js"></script> -->\r
<!-- Bod -->\r
- <!-- // <script src="src/app/nemo/module/test/bod_userJson.js"></script> -->\r
+ <!-- // <script src="src/app/nemo/module/test/bod_userJson.js"></script> -->\r
\r
<script src="src/app/nemo/js/Nemo_Annouce_vis.js"></script>\r
<script src="src/app/nemo/js/phyNetwork.js"></script>\r
}\r
\r
jQuery(document).ready(function ($) {\r
- var userNames=['myuser1','myuser2','myuser3'];\r
+ var userNames=['--default--'];\r
jQuery.ajax({\r
url: "/restconf/config/nemo-intent:users/",\r
type: "GET",\r
\r
\r
$(".tabs ul li[aria-controls='PhyNet']").click(function(){\r
+ createPhysicalTopo();\r
analy_topo(physicalData);\r
- create_physical_topo();\r
+ // create_physical_topo();\r
+ creataPhysicalTables.createPhyicalNodeTable('phyNodeTab',null)\r
+ creataPhysicalTables.createPhyicalLinkTable('phyLinkTab',null)\r
});\r
- \r
+\r
$(".tabs ul li[aria-controls='PhyNet']").click();\r
\r
$(".tabs ul li[aria-controls='intent_info']").click(function(){\r
console.log(userId);\r
\r
// SFC\r
- //userId='af4fc2be-e3f4-4388-a8ef-3aabae872f2b';\r
+ // userId='af4fc2be-e3f4-4388-a8ef-3aabae872f2b';\r
//Bod\r
- //userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b'\r
- //if(userId=='0') userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b';\r
+ // var userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b'\r
+ // if(userId=='0') userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b';\r
+ $('#service_svg2').empty();\r
+ $("#nemo_str_show").empty();\r
console.log(userId);\r
- var user_data = getIntentInfoById(userId);\r
- // console.log(JSON.stringify(user_data));\r
+ if(!IntentInfos) return;\r
+ var user_data = getIntentInfoById(userId,userinfo);\r
+ if(!user_data) return;\r
+\r
analyjson_topo(user_data);\r
parseNemoLan(user_data);\r
//set keyWords style\r
$("#nemo_str_show p").each(function(){\r
var $res=$(this);\r
keyWords.forEach(function(item,index,array){\r
- // console.log(item);\r
$res.html($res.html().replace(item,"<span class='keyWords'>"+item+"</span>"));\r
});\r
});\r
});\r
\r
$(".tabs ul li[aria-controls='VirNet']").click(function(){\r
- // alert('VirNet');\r
// var virtualData=getVirtualJson();\r
var userId=$("#selectUser option:selected").val();\r
-\r
+ jQuery('#vir_graph').empty();\r
+ jQuery("#virNodeTab").find('tr').remove();\r
+ jQuery("#virLinkTab").find('tr').remove();\r
// SFC\r
//userId='af4fc2be-e3f4-4388-a8ef-3aabae872f2b';\r
//Bod\r
//userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b'\r
\r
- //if(userId=='0') userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b';\r
- console.log(userId);\r
+ // if(userId=='0') userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b';\r
// virtualData=virtualJson;\r
+\r
+ if(!IntentInfos||!MappingResults||!VirtualDatas) return;\r
+ if(!getVirtualInfoById(userId)||!getIntentInfoById(userId)||!getMappingResultById(userId)) return;\r
create_virtual_topo(getVirtualInfoById(userId),getIntentInfoById(userId),getMappingResultById(userId));\r
+ creataVirtualTables.createVirtualNodeTable('virNodeTab',getVirtualInfoById(userId));\r
+ creataVirtualTables.createVirtualLinkTable('virLinkTab',getVirtualInfoById(userId));\r
});\r
+ // $(".tabs ul li[aria-controls='Mapping']").click();\r
$(".tabs ul li[aria-controls='Mapping']").click(function(){\r
- // alert('Mapping');\r
+ var userId=$("#selectUser option:selected").val();\r
+ // userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b';\r
+ jQuery("#mapVirNodeTab").find('tr').remove();\r
+ jQuery("#mapVirLinkTab").find('tr').remove();\r
+ if(!physicalData||!PnMappingResults||!VirtualDatas) return;\r
+ var virtualData = getVirtualInfoById(userId);\r
+ if(!virtualData) return;\r
+ if(!getPnMappingResultById(userId)) return;\r
+ // console.log(createMappingTables);\r
+ console.log(virtualData);\r
+ createMappingTables.createVirtualNodeTable('mapVirNodeTab',virtualData);\r
+ // console.log(linkArray);\r
+ createMappingTables.createVirtualLinkTable('mapVirLinkTab',virtualData,getPnMappingResultById(userId),physicalData);\r
+ // getPaths(linkArray,getPnMappingResultById(userId,PnMappingJson),physicalJson);\r
});\r
\r
- // $(".tabs ul li[aria-controls='intent_info']").click();\r
-\r
$('#selectUser input[type=button]').click(function(){\r
// $(".tabs ul li[aria-controls='intent_info']").trigger('click');\r
$('a[href="#intent_info"]').click();\r
//Bod\r
//userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b'\r
\r
- //if(userId=='0') userId='14ce424a-3e50-4a2a-ad5c-b29845158c8b';\r
+ if(!IntentInfos) return;\r
var user_data = getIntentInfoById(userId);\r
- // console.log(JSON.stringify(user_data));\r
+ if(!user_data) return;\r
+ \r
analyjson_topo(user_data);\r
parseNemoLan(user_data);\r
- //set keyWords style\r
+ \r
+ //set keyWords style\r
$("#nemo_str_show p").each(function(){\r
var $res=$(this);\r
keyWords.forEach(function(item,index,array){\r
// console.log(item);\r
$res.html($res.html().replace(item,"<span class='keyWords'>"+item+"</span>"));\r
});\r
- // console.log($res.html());\r
});\r
\r
- // alert(userName);\r
});\r
+\r
+ $('#logout').click(function(){\r
+ setCookie('nemo_userpwd','',-1);\r
+ $("#pageContent").empty();\r
+ $("#pageContent").load('src/app/nemo/register.html');\r
+ });\r
+\r
});\r
</script>\r
</head>\r
<body>\r
<div class="header">\r
- <p>Hello Admin!</p>\r
+ <p>Hello Admin!</p><span id='logout'>Logout</span>\r
<div id='selectUser'>\r
<p>Tenant:</p>\r
<select value="intentUser">\r
</ul>\r
<div id='PhyNet'>\r
<div id="phy_graph"></div>\r
+ <div id='physicalTables'>\r
+ <table class='tableHead'>\r
+ <caption>Physical Node</caption>\r
+ <colgroup>\r
+ <col style="width: 25%;"/>\r
+ <col style="width: 25%;" />\r
+ <col style="width: 25%;"/>\r
+ <col style="width: 25%;" />\r
+ </colgroup>\r
+ <tr>\r
+ <th>Physical Node ID</th><th>Physical Node Type</th>\r
+ <th>Internal Physical Port Number</th><th>External Physical Port Number</th>\r
+ </tr>\r
+ </table>\r
+\r
+ <div class='tableBodyContainer'>\r
+ <table id="phyNodeTab" border='1'>\r
+ <colgroup>\r
+ <col style="width: 25%;"/>\r
+ <col style="width: 25%;" />\r
+ <col style="width: 25%;"/>\r
+ <col style="width: 25%;" />\r
+ </colgroup>\r
+ </table>\r
+ </div>\r
+\r
+ <table class='tableHead'>\r
+ <caption>Physical Link</caption>\r
+ <colgroup>\r
+ <col style="width: 30%;"/>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 10%;" />\r
+ <col style="width: 10%;" />\r
+ <col style="width: 10%;" />\r
+ </colgroup>\r
+ <tr>\r
+ <th>Physical Link ID</th><th>Source Physical Node</th>\r
+ <th>Destination Physical Node</th><th>Metric</th>\r
+ <th>Bandwidth</th><th>Delay</th>\r
+ </tr>\r
+ </table>\r
+ \r
+ <div class='tableBodyContainer'>\r
+ <table id="phyLinkTab" border='1'> \r
+ <colgroup>\r
+ <col style="width: 30%;"/>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 10%;" />\r
+ <col style="width: 10%;" />\r
+ <col style="width: 10%;" />\r
+ </colgroup>\r
+ </table>\r
+ </div>\r
+ \r
+ </div>\r
</div>\r
\r
<div id="intent_info">\r
<div id="intent_topo">\r
- <svg id="service_svg" width="800" height="560" viewBox="100 40 900 780" style='display:none'>\r
- <defs>\r
- <marker id="idArrow" 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
- <marker id="idtext" 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> \r
- </defs>\r
- </svg>\r
-\r
- <svg id="service_svg2" width="800" height="560" viewBox="100 40 900 780">\r
+ \r
+ <svg id="service_svg2" width="800" height="560" viewBox="100 20 900 780">\r
<defs>\r
<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
<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> \r
</div>\r
</div>\r
\r
- <div id="VirNet"><div id="vir_graph"></div></div>\r
- <div id="Mapping"></div>\r
+ <div id="VirNet">\r
+ <div id="vir_graph"></div>\r
+ <div id='virtualTables'>\r
+\r
+ <table class='tableHead' border='1'>\r
+ <caption>Virtual Node</caption>\r
+ <colgroup>\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ </colgroup>\r
+ <tr>\r
+ <th>Virtual Node ID</th><th>Virtual Node Name</th>\r
+ <th>Virtual Node Type</th>\r
+ <th>Internal Virtual Port Number</th><th>External Virtual Port Number</th>\r
+ </tr>\r
+ </table>\r
+\r
+ <div class='tableBodyContainer'>\r
+ <table id="virNodeTab" border='1'>\r
+ <colgroup>\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ </colgroup>\r
+ </table>\r
+ </div>\r
+ \r
+ <table class='tableHead' border='1'>\r
+ <caption>Virtual Link</caption>\r
+ <colgroup>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 10%;" />\r
+ <col style="width: 10%;"/>\r
+ </colgroup>\r
+ <tr>\r
+ <th>Virtual Link ID</th><th>Virtual Link Name</th>\r
+ <th>Source Virtual Node</th>\r
+ <th>Destination Virtual Node</th>\r
+ <!-- <th>Metric</th> -->\r
+ <th>Bandwidth</th> <th>Delay</th>\r
+ </tr>\r
+ </table>\r
+ \r
+\r
+ <div class='tableBodyContainer'>\r
+ <table id="virLinkTab" border='1'>\r
+ <colgroup>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 20%;" />\r
+ <col style="width: 20%;"/>\r
+ <col style="width: 10%;" />\r
+ <col style="width: 10%;"/>\r
+ </colgroup>\r
+ </table>\r
+ </div>\r
+ </div>\r
+ </div>\r
+ <div id="Mapping">\r
+ \r
+ <div id='mappingTable'>\r
+ <table class='tableHead' border='1'>\r
+ <caption>Virtual Node Mapping Table</caption>\r
+ <colgroup>\r
+ <col style="width: 50%;" />\r
+ <col style="width: 50%;"/>\r
+ </colgroup>\r
+ <tr><th>Virtual Node</th><th>Physical Node</th></tr>\r
+ </table>\r
+ \r
+ <div class='tableBodyContainer'>\r
+ <table id="mapVirNodeTab" border='1'>\r
+ <colgroup>\r
+ <col style="width: 50%;" />\r
+ <col style="width: 50%;"/>\r
+ </colgroup>\r
+ </table>\r
+ </div> \r
+\r
+ <table class='tableHead' border='1'>\r
+ <caption>Virtual Link Mapping Table</caption>\r
+ <colgroup>\r
+ <col style="width: 20%;">\r
+ <col style="width: 15%;">\r
+ <col style="width: 15%;">\r
+ <col style="width: 20%;">\r
+ <col style="width: 30%;">\r
+ </colgroup> \r
+ <tr>\r
+ <th>Virtual Link</th><th>Source Virtual Node</th>\r
+ <th>Destination Virtual Node</th><th>Physical Path</th>\r
+ <th>Physical Nodes passed by Path</th>\r
+ </tr>\r
+ </table>\r
+ \r
+ <div class='tableBodyContainer'>\r
+ <table id="mapVirLinkTab" border='1'>\r
+ <colgroup>\r
+ <col style="width: 20%;">\r
+ <col style="width: 15%;">\r
+ <col style="width: 15%;">\r
+ <col style="width: 20%;">\r
+ <col style="width: 30%;">\r
+ </colgroup>\r
+ </table>\r
+ </div>\r
+ </div>\r
+ </div>\r
</div>\r
\r
\r
Code Review / nemo.git / blobdiff