diff options
Diffstat (limited to 'ransim/ransimctrlr/RANSIM-GUI')
19 files changed, 966 insertions, 1282 deletions
diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/AdditionalFeature.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/AdditionalFeature.html index aba0ad6..ec9bc60 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/AdditionalFeature.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/AdditionalFeature.html @@ -21,7 +21,7 @@ <!DOCTYPE html> <html> <head> -<title>Cell Operations History</title> +<title>Netconf server details</title> <style> table, td, th { border: solid 1px #DDD; @@ -45,7 +45,7 @@ table, td, th { </head> <body onload="getOperationLogs()"> <center> - <h3>Cell Operations History</h3> + <h3>Netconf server details</h3> </center> <br> <p id="showData"></p> @@ -54,94 +54,83 @@ table, td, th { </body> <script> - function getOperationLogs() { - var xmlhttp = new XMLHttpRequest(); - xmlhttp.onreadystatechange = function() { - if (this.readyState == 4 && this.status == 200) { - var logs = JSON.parse(this.responseText); - var myJSON = JSON.stringify(logs); - console.log(myJSON); - drawTable(logs); - } - }; - xmlhttp.open("GET","/ransim/api/GetNetconfStatus", - true); - xmlhttp.send(); - } + function getOperationLogs() { + var xmlhttp = new XMLHttpRequest(); + xmlhttp.onreadystatechange = function() { + if (this.readyState == 4 && this.status == 200) { + var logs = JSON.parse(this.responseText); + var myJSON = JSON.stringify(logs); + console.log(myJSON); + drawTable(logs); + } + }; + xmlhttp.open("GET", "/ransim/api/GetNetconfStatus", true); + xmlhttp.send(); + } - function drawTable(myBooks) { - // EXTRACT VALUE FOR HTML HEADER. - var col = []; - for (var i = 0; i < myBooks.length; i++) { - console.log(myBooks[i]); - for (var key in myBooks[i]) { - if (col.indexOf(key) === -1) { - col.push(key); - } - } - } - - console.log(col); + function drawTable(data) { + // EXTRACT VALUE FOR HTML HEADER. + var col = []; + for (var i = 0; i < data.length; i++) { + console.log(data[i]); + for ( var key in data[i]) { + if (col.indexOf(key) === -1) { + col.push(key); + } + } + } - // CREATE DYNAMIC TABLE. - var table = document.createElement("table"); + console.log(col); - // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. + // CREATE DYNAMIC TABLE. + var table = document.createElement("table"); - var tr = table.insertRow(-1); // TABLE ROW. + // CREATE HTML TABLE HEADER ROW USING THE EXTRACTED HEADERS ABOVE. - //for (var i = 0; i < 4; i++) { - for (var i = 0; i < col.length; i++) { - - // if (i == 0) continue; - var th = document.createElement("th"); // TABLE HEADER. - if(i==2) - th.innerHTML = "PORT"; - else - th.innerHTML = col[i].toUpperCase(); - //console.log("th.style " + th.style); - tr.appendChild(th); - } + var tr = table.insertRow(-1); // TABLE ROW. - // ADD JSON DATA TO THE TABLE AS ROWS. - for (var i = 0; i < myBooks.length; i++) { + for (var i = 0; i < col.length; i++) { - tr = table.insertRow(-1); - //manipulate rows - if(i % 2 == 0){ - tr.className = "even"; - }else{ - tr.className = "odd"; - } + var th = document.createElement("th"); // TABLE HEADER. + if (i == 2) + th.innerHTML = "PORT"; + else + th.innerHTML = col[i].toUpperCase(); + tr.appendChild(th); + } - //for (var j = 0; j < 4; j++) { - for (var j = 0; j < col.length; j++) { - - //if (j == 0) continue; - var tabCell = tr.insertCell(-1); - //tabCell.style.setWidth("25%"); - //console.log("tabCell.style " + tabCell.style); - if(j==3) - { - var arr = ""; - for(var k = 0;k<myBooks[i][col[j]].length;k++) - { - console.log("nodeId" + myBooks[i][col[j]][k]["nodeId"]); - arr = arr + " " + myBooks[i][col[j]][k]["nodeId"]; - } - tabCell.innerHTML = arr; - tabCell.className = "WID"; - console.log("arr" + arr); - } - else - tabCell.innerHTML = myBooks[i][col[j]]; - console.log("checking my books , j " + j + " " + myBooks[i][col[j]]); - } - } - // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. - var divContainer = document.getElementById("showData"); - divContainer.innerHTML = ""; - divContainer.appendChild(table); - } + // ADD JSON DATA TO THE TABLE AS ROWS. + for (var i = 0; i < data.length; i++) { + + tr = table.insertRow(-1); + //manipulate rows + if (i % 2 == 0) { + tr.className = "even"; + } else { + tr.className = "odd"; + } + + for (var j = 0; j < col.length; j++) { + + var tabCell = tr.insertCell(-1); + if (j == 3) { + var arr = ""; + for (var k = 0; k < data[i][col[j]].length; k++) { + console.log("nodeId" + data[i][col[j]][k]["nodeId"]); + arr = arr + " " + data[i][col[j]][k]["nodeId"]; + } + tabCell.innerHTML = arr; + tabCell.className = "WID"; + console.log("arr" + arr); + } else + tabCell.innerHTML = data[i][col[j]]; + console.log("checking data , j " + j + " " + data[i][col[j]]); + } + } + // FINALLY ADD THE NEWLY CREATED TABLE WITH JSON DATA TO A CONTAINER. + var divContainer = document.getElementById("showData"); + divContainer.innerHTML = ""; + divContainer.appendChild(table); + } </script> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationStop.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationStop.html index 3284ee2..edbf382 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationStop.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationStop.html @@ -20,46 +20,46 @@ --> <html> - <head> - <title>Simulator Configuration</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body> - <center> - <h2>Simulator Configuration</h2> - <div data-ng-init="onloadFun()" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate> - <table border = "0" align=center> - <tr> - <td> - Do you really want to stop the Simulation and clear the Simulated data? - </td> - </tr> - <tr> - <td align=right> - <button ng-click="stopSimulation()">Yes</button> - <button ng-click = "close()">No</button> - </td> - </tr> - </table> - </form> - </div> - <script> +<head> +<title>Simulator Configuration</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Simulator Configuration</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Do you really want to stop the Simulation and clear the + Simulated data?</td> + </tr> + <tr> + <td align=right> + <button ng-click="stopSimulation()">Yes</button> + <button ng-click="close()">No</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', function($scope, $http) { $scope.stopSimulation = function(){ @@ -85,6 +85,7 @@ window.close(); } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationTrigger.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationTrigger.html index 1193a7c..6fb1299 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationTrigger.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationTrigger.html @@ -20,66 +20,76 @@ --> <html> - <head> - <title>Simulator Configuration</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body><center> - <h2>Simulator Configuration</h2> - <div align="center" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate > - <table border = "0" align=center> - <tr> - <td>Cluster Level::</td> - <td><input name = "clusterLevel" type = "number" ng-model = "configui.clusterLevel" required> - <br><span style = "color:red" ng-show = "configForm.clusterLevel.$dirty && configForm.clusterLevel.$invalid"> - <span ng-show = "configForm.clusterLevel.$error.required">Cluster Level is mandatory.</span> - </span> - </td> - </tr> - <tr> - <td>Grid Size:</td> - <td><input name = "gridSize" type = "number" ng-model = "configui.gridSize" required> - <br><span style = "color:red" ng-show = "configForm.gridSize.$dirty && configForm.gridSize.$invalid"> - <span ng-show = "configForm.gridSize.$error.required">Grid Size is mandatory.</span> - </span> - </td> - </tr> - <tr> - <td>No. of Clusters: </td><td><input name = "numberOfClusters" type = "number" ng-model = "configui.numberOfClusters" required> - <br><span style = "color:red" ng-show = "configForm.numberOfClusters.$dirty && configForm.numberOfClusters.$invalid"> - <span ng-show = "configForm.numberOfClusters.$error.required">No. of Clusters is mandatory.</span> - </span> - </td> - </tr> - <tr> - <td colspan=2 align=right> - <button ng-model = "configure" ng-disabled = "configForm.clusterLevel.$dirty && +<head> +<title>Simulator Configuration</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Simulator Configuration</h2> + <div align="center" ng-app="mainApp" ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Cluster Level::</td> + <td><input name="clusterLevel" type="number" + ng-model="configui.clusterLevel" required> <br> + <span style="color: red" + ng-show="configForm.clusterLevel.$dirty && configForm.clusterLevel.$invalid"> + <span ng-show="configForm.clusterLevel.$error.required">Cluster + Level is mandatory.</span> + </span></td> + </tr> + <tr> + <td>Grid Size:</td> + <td><input name="gridSize" type="number" + ng-model="configui.gridSize" required> <br> + <span style="color: red" + ng-show="configForm.gridSize.$dirty && configForm.gridSize.$invalid"> + <span ng-show="configForm.gridSize.$error.required">Grid + Size is mandatory.</span> + </span></td> + </tr> + <tr> + <td>No. of Clusters:</td> + <td><input name="numberOfClusters" type="number" + ng-model="configui.numberOfClusters" required> <br> + <span style="color: red" + ng-show="configForm.numberOfClusters.$dirty && configForm.numberOfClusters.$invalid"> + <span ng-show="configForm.numberOfClusters.$error.required">No. + of Clusters is mandatory.</span> + </span></td> + </tr> + <tr> + <td colspan=2 align=right> + <button ng-model="configure" + ng-disabled="configForm.clusterLevel.$dirty && configForm.clusterLevel.$invalid || configForm.gridSize.$dirty && configForm.gridSize.$invalid || configForm.numberOfClusters.$dirty && - configForm.configui.numberOfClusters.$invalid" ng-click="triggerSimulatorConfig()">Configure</button> - <button ng-model = "close" ng-click = "close()">Close</button> - </td> - </tr> - </table> - </form> - </div> - <script> + configForm.configui.numberOfClusters.$invalid" + ng-click="triggerSimulatorConfig()">Configure</button> + <button ng-model="close" ng-click="close()">Close</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', function($scope, $http) { $scope.triggerSimulatorConfig = function(){ @@ -104,6 +114,7 @@ window.close(); } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationTriggerFile.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationTriggerFile.html index 6a55bcf..e3872a8 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationTriggerFile.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/SimulationTriggerFile.html @@ -20,47 +20,53 @@ --> <html> - <head> - <title>Simulator Configuration</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body><center> - <h2>Simulator Configuration</h2> - <div align="center" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate > - Using dump file to load simulation data. - <br> - <table border = "0" align=center> - <tr> - <td colspan=2 align=right> - <button ng-model = "configure" ng-click="triggerSimulatorConfig()">Configure</button> - <button ng-model = "close" ng-click = "close()">Close</button> - </td> - </tr> - </table> - </form> - </div> - <script> +<head> +<title>Simulator Configuration</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Simulator Configuration</h2> + <div align="center" data-ng-init="onloadFun()" ng-app="mainApp" ng-controller="configController"> + <form name="configForm" novalidate> + Using dump file to load simulation data. <br><br> + <select ng-required="required" ng-model="dumpfile" ng-options="x for x in files" required="required"> + <option value="" selected="selected" disabled="disabled">select dump file</option> + </select> + <br> + <br> + <table border="0" align=center> + <tr> + <td colspan=2 align=right> + <button ng-model="configure" ng-click="triggerSimulatorConfig()">Configure</button> + <button ng-model="close" ng-click="close()">Close</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', function($scope, $http) { $scope.triggerSimulatorConfig = function(){ - - var res = $http.post('/ransim/api/StartSimulation') + var files = { "dumpfile" :$scope.dumpfile} + var obj= JSON.stringify(files);; + var res = $http.post('/ransim/api/StartSimulation',obj) .then(function successCallback(response){ alert( "Simulation successfully triggered"); window.close(); @@ -69,11 +75,24 @@ window.close(); }); - }; + }; + + $scope.onloadFun=function() { + var xmlhttp = new XMLHttpRequest(); + xmlhttp.onreadystatechange = function() { + if (this.readyState == 4 && this.status == 200) { + var files = JSON.parse(this.responseText); + $scope.files =files; + } + }; + xmlhttp.open("GET", "/ransim/file/dumpfiles", false); + xmlhttp.send(); + }; $scope.close = function(){ window.close(); } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/controlpanel.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/controlpanel.html index a2cfabe..2f34b67 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/controlpanel.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/controlpanel.html @@ -21,19 +21,16 @@ <!DOCTYPE html> <html ng-app="myApp" ng-controller="myCtrl"> - <head> - <script src="angular.min.js"></script> - <style> - .can { - padding-top:40px; - } - </style> - <script> +<head> +<script src="angular.min.js"></script> +<style> +.can { + padding-top: 40px; +} +</style> +<script> var app = angular.module('myApp', []); app.controller('myCtrl', function($scope, $window) { - /*$scope.startSimulator = function() { - $window.open('SimulationTrigger.html', '','menubar=no, locationbar=no, toolbar=no, width=600px, height=250px'); - };*/ $scope.startSimulatorFile = function() { document.getElementById("stopSimulator").disabled = false; document.getElementById("startSimulator").disabled = true; @@ -56,25 +53,6 @@ document.getElementById("stopPm").disabled = false; document.getElementById("startPm").disabled = true; $window.open('startsPm.html', '','menubar=no, locationbar=no, toolbar=no, width=600px, height=400px'); - /* - var status; - var xmlhttp = new XMLHttpRequest(); - xmlhttp.onreadystatechange = function() { - if (this.readyState == 4 && this.status == 200) { - status = JSON.parse(this.responseText); - console.log(status); - console.log("status"); - } - }; - xmlhttp.open("GET", "/ransim/api/GetPmDataStatus", - true); - xmlhttp.send(); - - if(status == true){ - document.getElementById("stopPm").disabled = false; - document.getElementById("startPm").disabled = true; - }*/ - }; $scope.stopPm = function() { document.getElementById("stopPm").disabled = true; @@ -82,36 +60,36 @@ $window.open('stopPm.html', '','menubar=no, locationbar=no, toolbar=no, width=600px, height=250px'); }; - + $scope.uploadFile = function() { + $window.open('uploadFile.html', '','menubar=no, locationbar=no, toolbar=no, width=600px, height=250px'); + } }); </script> - </head> - <body> +</head> +<body> <div id="controlpanel" class="absolute"> - RAN Simulation - <br> + RAN Simulation <br> <!-- button ng-click="startSimulator()">StartHoneycomb</button--> <button id="startSimulator" ng-click="startSimulatorFile()">Start</button> - <button id="stopSimulator" ng-click="stopSimulator()" disabled>Stop</button><br> - <br> - <div id="operupdate" name="operuodate">Click view to check details of the updated cells</div> + <button id="stopSimulator" ng-click="stopSimulator()" disabled>Stop</button> + <br> <br> + <button id="uploadFile" ng-click="uploadFile()">Upload Dump File</button> + <br><br> + <div id="operupdate" name="operuodate">Click view to check + details of the updated cells</div> <button ng-click="showOperationTable()">View</button> - <br> - <br> + <br> <br> <button ng-click="showNetconfServerDetails()">Netconf Details</button> - <br> - <br> + <br> <br> <div>PM data</div> <button id="startPm" ng-click="startPm()">Start</button> <button id="stopPm" ng-click="stopPm()" disabled>Stop</button> - <br> - <br> - + <br> <br> </div> - <p></p> - <canvas id="Canvas2" class="can" width="4000" height="10000"></canvas> - </body> + <p></p> + <canvas id="Canvas2" class="can" width="4000" height="10000"></canvas> +</body> <script> var canvas = document.getElementById('Canvas2'); var ctx = canvas.getContext('2d'); diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/deleteCell.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/deleteCell.html index 1d0406c..7860485 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/deleteCell.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/deleteCell.html @@ -21,91 +21,69 @@ <html> <head> - <title>Delete Cell Configuration</title> - <script src="angular.min.js"></script> - <style> - table, - th, - td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> +<title>Delete Cell Configuration</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> </head> <body> - <center> - <h2>Delete Cell Configuration</h2> - <div data-ng-init="onloadFun()" ng-app="mainApp" ng-controller="configController"> - <form name="configForm" novalidate> - <table border="0" align=center> - <tr> - <td> - <input name="nodeId" type="hidden" ng-model="nodeId" required disabled> Do you really want to delete the Cell {{nodeId}}? - </td> - </tr> - <tr> - <td align=right> - <button ng-disabled="configForm.nodeId.$dirty && - configForm.nodeId.$invalid" ng-click="deleteCell()">Delete</button> - <button ng-click="close()">Cancel</button> - </td> - </tr> - </table> - </form> - </div> - <script> + <center> + <h2>Delete Cell Configuration</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td><input name="nodeId" type="hidden" ng-model="nodeId" + required disabled> Do you really want to delete the Cell + {{nodeId}}?</td> + </tr> + <tr> + <td align=right> + <button + ng-disabled="configForm.nodeId.$dirty && + configForm.nodeId.$invalid" + ng-click="deleteCell()">Delete</button> + <button ng-click="close()">Cancel</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController', ['$scope', '$http', '$location', function($scope, $http, $location) { $scope.deleteCell = function() { - //alert($scope.nodeId); var formVal = { "nodeId": $scope.nodeId } var dataObj = JSON.stringify(formVal); - //alert("Delete DataObj : " + dataObj); var res = $http.post( '/ransim/api/DeleteACell', dataObj ) .then(function successCallback(response) { - //alert("Success message: " + JSON.stringify(response)); alert("Delete Successful"); window.close(); }, function errorCallback(response) { - //alert("Failure message: " + JSON.stringify(response)); alert("Delete Failed"); window.close(); }); - - /*var xmlhttp = new XMLHttpRequest(); - xmlhttp.onreadystatechange = function() { - if (this.readyState == 4 && this.status == 200) { - alert( "Success message: "+JSON.stringify(this.responseText)); - alert("deleted Successfully"); - window.close(); - } else if (this.readyState == 4 && this.status > 200) { - alert( "Failure message: "+JSON.stringify(this.responseText)); - alert("delete Failed"); - window.close(); - } - xmlhttp.open("POST", - "/ransim/api/DeleteACell", true); - xmlhttp.setRequestHeader('Content-Type', 'application/json') - xmlhttp.send(dataObj); - }; - */ - }; $scope.close = function() { window.close(); @@ -117,8 +95,7 @@ absUrl = $location.absUrl(), // extract and parse url elements = absUrl.split("?"); - - // parse quesry string + // parse query string parts["queryString"] = elements[1]; if (elements[1]) { parts["hashString"] = (parts["queryString"].split("#"))[1]; @@ -129,7 +106,6 @@ var __variable = queryStringVariable.split("="); parts.queryvars[__variable[0]] = __variable[1]; }); - //alert("Parts : "+JSON.stringify(parts)); if (parts.queryvars["cid"] !== "undefined") { alert("CID : " + parts.queryvars["cid"]); $scope.nodeId = parts.queryvars["cid"]; @@ -139,7 +115,7 @@ } ]); </script> - <center> + <center> </body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/displayCellDetails.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/displayCellDetails.html index 9c8ab7b..9e52eb2 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/displayCellDetails.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/displayCellDetails.html @@ -20,82 +20,57 @@ --> <html> - <head> - <title>Display Cell Details</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body><center> - <h2>Cell Details</h2> - <div data-ng-init="onloadFun()" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate> - <table border = "0" align=center> - <tr> - <td>Node Id:</td> - <td><input name = "nodeId" type = "string" ng-model = "nodeId" required disabled> - <br><span style = "color:red" ng-show = "configForm.nodeId.$dirty && configForm.nodeId.$invalid"> - <span ng-show = "configForm.nodeId.$error.required">Node Id is mandatory.</span> - </span> - </td> - </tr> - <tr> - <td>Physical Cell Id:</td> - <td><input name = "oldPhysicalCellId" type = "number" ng-model = "oldPhysicalCellId" required disabled> - <br> - </td> - </tr> - <tr> - <td>Pnf Name:</td> - <td><input name = "pnfName" type = "string" ng-model = "pnfName" required disabled> - <br> - </td> - </tr> - <!-- tr> - <td>New Physical Cell Id:</td> - <td><input name = "newPhysicalCellId" type = "number" ng-model = "newPhysicalCellId" required> - <br><span style = "color:red" ng-show = "configForm.newPhysicalCellId.$dirty && configForm.newPhysicalCellId.$invalid"> - <span ng-show = "configForm.newPhysicalCellId.$error.required">New Physical Cell Id is mandatory.</span> - </span> - </td> - </tr --> - <!-- tr> - <td>Neighbors:</td> - <td><textarea name = "existingNbrs" rows="8" cols="31" type = "string" ng-model = "existingNbrs" disabled></textarea> - <br> - </td> - </tr --> - <!-- tr> - <td>New Neighbors:</td> - <td><textarea name = "newNbrs" rows="8" cols="31" type = "string" ng-model = "newNbrs"></textarea> - <br> - </td> - </tr --> - <!-- tr> - <td colspan=2 align=right> - <button ng-disabled = "configForm.newPhysicalCellId.$dirty && - configForm.newPhysicalCellId.$invalid || configForm.nodeId.$dirty && - configForm.nodeId.$invalid" ng-click="modifyCell()">Modify</button> - <button ng-click = "close()">Cancel</button> - </td> - </tr --> - </table> - </form> - </div> - <script> +<head> +<title>Display Cell Details</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Cell Details</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Node Id:</td> + <td><input name="nodeId" type="string" ng-model="nodeId" + required disabled> <br> + <span style="color: red" + ng-show="configForm.nodeId.$dirty && configForm.nodeId.$invalid"> + <span ng-show="configForm.nodeId.$error.required">Node Id + is mandatory.</span> + </span></td> + </tr> + <tr> + <td>Physical Cell Id:</td> + <td><input name="oldPhysicalCellId" type="number" + ng-model="oldPhysicalCellId" required disabled> <br> + </td> + </tr> + <tr> + <td>Pnf Name:</td> + <td><input name="pnfName" type="string" ng-model="pnfName" + required disabled> <br></td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', '$location', function($scope, $http, $location) { $scope.modifyCell = function() { @@ -120,27 +95,22 @@ var __variable = queryStringVariable.split("="); parts.queryvars[__variable[0]] = __variable[1]; }); - //alert("Parts : "+JSON.stringify(parts)); if (parts.queryvars["cid"] !== "undefined") { //alert("CID : "+parts.queryvars["cid"]); $scope.nodeId = parts.queryvars["cid"]; } if (parts.queryvars["pcid"] !== "undefined") { - //alert("PC Id : "+parts.queryvars["pcid"]); $scope.newPhysicalCellId = parseInt(parts.queryvars["pcid"]); $scope.oldPhysicalCellId = parseInt(parts.queryvars["pcid"]); } if (parts.queryvars["pnf"] !== "undefined") { - //alert("CID : "+parts.queryvars["cid"]); $scope.pnfName = parts.queryvars["pnf"]; } - //neighbrList - //neighbrList=Chn204%2CChn203%2CChn403%2CChn302%2CChn304%2CChn202 - } } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/getdump.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/getdump.html index b878d65..86eae42 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/getdump.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/getdump.html @@ -23,49 +23,59 @@ <html> <head> - <script src="angular.min.js"></script> - <style> - .show { - z-index: 1000; - position: absolute; - padding: 2px; - display: block; - margin: 0; - list-style-type: none; - list-style: none; - } - - .hide { - display: none; - } - - .btn-group .button { - background-color: LightGrey; - color: black; - border: 1px solid Black; - text-align: center; - text-decoration: none; - display: inline-block; - font-size: 16px; - cursor: pointer; - width: 100px; - display: block; - } - - .btn-group .button:not (:last-child) { - border-bottom: - - none; - +<script src="angular.min.js"></script> +<style> +.show { + z-index: 1000; + position: absolute; + padding: 2px; + display: block; + margin: 0; + list-style-type: none; + list-style: none; +} + +.hide { + display: none; +} + +.btn-group .button { + background-color: LightGrey; + color: black; + border: 1px solid Black; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + cursor: pointer; + width: 100px; + display: block; +} + +.btn-group + +.button +:not + +( +:last-child + +) +{ +border-bottom +: + +none +; - } - .btn-group .button:hover { - background-color: lightblue; - color: white; - } - </style> - <script> +} +.btn-group .button:hover { + background-color: lightblue; + color: white; +} +</style> +<script> function init() { getCellTopology(); } @@ -75,13 +85,11 @@ "nodeId": nodeId } var dataObj = JSON.stringify(formVal); - //console.log("Delete DataObj : " + dataObj); var xmlhttp = new XMLHttpRequest(); var toBeContinued = true; var nbrsStr = ''; xmlhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { - //console.log("Response DataObj : " + this.responseText); var nbrs = JSON.parse(this.responseText); for( i in nbrs.cellsWithHO ) { var nodeId = nbrs.cellsWithHO[i].nodeId; @@ -89,7 +97,6 @@ nbrsStr += ', '; nbrsStr += '{"nodeId":'+'"'+nodeId+'"'+',"blacklisted":"false"}' ; } - //console.log("Response nbrsStr : " + nbrsStr); toBeContinued = false; } else if (this.readyState == 4 && this.status >= 200) { toBeContinued = false; @@ -144,81 +151,6 @@ var aColors = "#32CD32"; var aColorsLength = 1; var arr = new Array(); - /* for (var x = 0; x < gridSize; x++) { - arr[x] = new Array(); - for (var y = 0; y < gridSize; y++) { - - context.fillStyle = "#D3D3D3"; - - context.beginPath(); - - context.lineWidth = 5; - var a = 1.5 * rad; - var b = 0.86 * rad; - if (x % 2 == 0) { - context.moveTo((x + 1) * a + rad, (2 * y + 1) * b); - var s = 6; - for (var p = 1; p < s; p++) { - context.lineTo(((x + 1) * a) + (rad * Math.cos(p * - 2 * Math.PI / s)), (2 * y + 1) * b + ( - rad * Math.sin(p * 2 * Math.PI / s))); - } - } else { - - context.moveTo((x + 1) * a + rad, (2 * y + 2) * b); - var s = 6; - for (var p = 1; p < s; p++) { - context.lineTo(((x + 1) * a) + (rad * Math.cos(p * - 2 * Math.PI / s)), ((2 * y + 2) * b) + - ( - rad * Math.sin(p * 2 * Math.PI / s))); - } - } - context.strokeStyle = "black"; - context.stroke(); - - context.closePath(); - context.fill(); - arr[x][y] = (x + 1) + ":" + (y + 1); - } - } */ - - /* myCanvas.addEventListener('contextmenu', (e) => { - const pos = { - x: e.clientX, - y: e.clientY - }; - for (var x = 0; x < gridSize; x++) { - for (var y = 0; y < gridSize; y++) { - if (isIntersectDefault(pos, x, y, rad, gaps)) { - var val = arr[x][y]; - document.getElementById("rmenu").className = - "show"; - document.getElementById('rmenu').style.top = - pos.y + "px"; //or whatever - document.getElementById('rmenu').style.left = - pos.x + "px"; // or whatever - - var htmlText1 = '<div class="btn-group">'; - htmlText1 += - '<button class="button" id="createNode">Create</button>'; - htmlText1 += '</div>'; - document.getElementById("rmenu").innerHTML = - htmlText1; - - document.getElementById("createNode").addEventListener( - "click", - function() { - createNode(val); - }); - e.preventDefault(); - return; - } - } - } - e.preventDefault(); - }); */ - console.log('{ "cellList" :['); var index = 0; var pnfNum = 1000; @@ -233,8 +165,6 @@ var row = i/45; var col = i%45; - - //function point2LatLng(row, col, map); //console.log( translate_coordinates(row, row)); @@ -259,8 +189,6 @@ if (typeof topoObj.cellTopology[i].color != 'undefined') { confuColor = topoObj.cellTopology[i].color; } - //alert(nodeId+" "+physicalCellId+" "+col+" "+row+" "+confusion+" "+confuColor+" "); - if (collision) { if (confusion) { context.fillStyle = "#FF0000"; @@ -298,14 +226,12 @@ } context.strokeStyle = "black"; context.stroke(); - //alert(nodeId+" Circle X " + (rad+gaps*col) + " Y: "+ (rad+gaps*row)); context.closePath(); context.fill(); context.font = "12px Comic Sans MS"; context.fillStyle = "white"; context.textAlign = "center"; - //fillMultiLineText(context,"cid:"+nodeId+"\npcid:"+physicalCellId, rad+gaps*col,rad+ gaps*row); if (col % 2 == 0) { context.fillText("" + nodeId + "," + physicalCellId, (col +1) * a, rad + (2 * row + 1) * b); @@ -313,20 +239,12 @@ var xy2ll = translate_xyToLatLng( (col +1) * a, (2 * row +1) * b); var slat=xy2ll.slat; var slon=xy2ll.slon; - //cellStr += ' "latitude" : "' + slat + '", '; - //cellStr += ' "longitude" : "' + slon + '" '; - - //cellStr += ' "screenX" : "' + ((col + 1) * a) + '", '; - //cellStr += ' "screenY" : "' + (rad + (2 * row) * b) + '" '; + } else { context.fillText("" + nodeId + "," + physicalCellId, (col +1) * a, (2 * row + 2) * b); var xy2ll = translate_xyToLatLng( (col +1) * a, (2 * row + 2) * b); var slat=xy2ll.slat; var slon=xy2ll.slon; - //cellStr += ' "latitude" : "' + slat + '", '; - //cellStr += ' "longitude" : "' + slon + '" '; - //cellStr += ' "screenX" : "' + ((col + 1) * a) + '", '; - //cellStr += ' "screenY" : "' + ((2 * row + 2) * b) + '" '; } var neighborStr = getNeighborDumb(nodeId); @@ -375,8 +293,6 @@ gaps)) { var nodeVal = topoObj.cellTopology[i].nodeId; var cellVal = topoObj.cellTopology[i].physicalCellId; - //alert('click on circle: ' + topoObj.cellTopology[i].nodeId); - //alert(pos.x + " "+pos.y); document.getElementById("rmenu").className = "show"; document.getElementById('rmenu').style.top = @@ -439,13 +355,6 @@ var xx,yy,r,ct,st,angle; angle = 0; - - - /* X,Y to Lat/Lon Coordinate Translation */ - //pxpos_mtrs = porg.x; - //pypos_mtrs = porg.y; - //xx = x; - // yy = y; r = Math.sqrt(xx*xx + yy*yy); if(r) @@ -475,9 +384,6 @@ r = Math.sqrt(xx*xx + yy*yy); - /* alert('LL_TO_XY: xx=' + xx + ' yy=' + yy + ' r=' + r); - return false;*/ - if(r) { ct = xx/r; @@ -485,9 +391,6 @@ xx = r * ( (ct * Math.cos(0)) + (st * Math.sin(0)) ); yy = r * ( (st * Math.cos(0)) - (ct * Math.sin(0)) ); } - //pxpos_mtrs = xx + porg.xoffset_mtrs; - //pypos_mtrs = yy + porg.yoffset_mtrs; - var sxy={}; sxy={x:xx, y:yy}; @@ -498,7 +401,6 @@ var point = cellInfo.split(":"); var gridX = point[0]; var gridY = point[1]; - //alert("Cell X : "+gridX+" Y: "+ gridY); window.childWin = window.open('createCell.html?gridX=' + gridX + '&gridY=' + gridY, '', 'menubar=no, locationbar=no, toolbar=no, width=600px, height=250px' @@ -518,7 +420,6 @@ } function deleteNode(cid, pcid) { - //alert("Delete CID "+cid + " PCID " + pcid); window.childWin = window.open('deleteCell.html?cid=' + cid + '&pcid=' + pcid, '', 'menubar=no, locationbar=no, toolbar=no, width=600px, height=250px' @@ -591,8 +492,8 @@ </head> <body onLoad="init();" style="margin: 0px"> - <div class="hide" id="rmenu"></div> - <canvas id="myCanvas" /> + <div class="hide" id="rmenu"></div> + <canvas id="myCanvas" /> </body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/honeycomb.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/honeycomb.html index e40a722..e89fa9f 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/honeycomb.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/honeycomb.html @@ -23,49 +23,45 @@ <html> <head> - <script src="angular.min.js"></script> - <style> - .show { - z-index: 1000; - position: absolute; - padding: 2px; - display: block; - margin: 0; - list-style-type: none; - list-style: none; - } - - .hide { - display: none; - } - - .btn-group .button { - background-color: LightGrey; - color: black; - border: 1px solid Black; - text-align: center; - text-decoration: none; - display: inline-block; - font-size: 16px; - cursor: pointer; - width: 100px; - display: block; - } - - .btn-group .button:not (:last-child) { - border-bottom: - - none; - - - } - - .btn-group .button:hover { - background-color: lightblue; - color: white; - } - </style> - <script> +<script src="angular.min.js"></script> +<style> +.show { + z-index: 1000; + position: absolute; + padding: 2px; + display: block; + margin: 0; + list-style-type: none; + list-style: none; +} + +.hide { + display: none; +} + +.btn-group .button { + background-color: LightGrey; + color: black; + border: 1px solid Black; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + cursor: pointer; + width: 100px; + display: block; +} + +.btn-group .button:not (:last-child ) { + border-bottom: none; +} + +.btn-group .button:hover { + background-color: lightblue; + color: white; +} +</style> +<script> document.body.addEventListener("wheel", e=>{ if(e.ctrlKey) event.preventDefault();//prevent zoom @@ -202,8 +198,6 @@ if (typeof topoObj.cellTopology[i].color != 'undefined') { confuColor = topoObj.cellTopology[i].color; } - //alert(nodeId+" "+physicalCellId+" "+col+" "+row+" "+confusion+" "+confuColor+" "); - if (collision) { if (confusion) { context.fillStyle = "#FF0000"; @@ -240,14 +234,12 @@ } context.strokeStyle = "black"; context.stroke(); - //alert(nodeId+" Circle X " + (rad+gaps*col) + " Y: "+ (rad+gaps*row)); context.closePath(); context.fill(); context.font = "12px Comic Sans MS"; context.fillStyle = "white"; context.textAlign = "center"; - //fillMultiLineText(context,"cid:"+nodeId+"\npcid:"+physicalCellId, rad+gaps*col,rad+ gaps*row); if (col % 2 == 0) { context.fillText("" + nodeId + "," + physicalCellId, (col + @@ -292,8 +284,6 @@ gaps)) { var nodeVal = topoObj.cellTopology[i].nodeId; var cellVal = topoObj.cellTopology[i].physicalCellId; - //alert('click on circle: ' + topoObj.cellTopology[i].nodeId); - //alert(pos.x + " "+pos.y); document.getElementById("rmenu").className = "show"; document.getElementById('rmenu').style.top = @@ -332,7 +322,6 @@ var point = cellInfo.split(":"); var gridX = point[0]; var gridY = point[1]; - //alert("Cell X : "+gridX+" Y: "+ gridY); window.childWin = window.open('createCell.html?gridX=' + gridX + '&gridY=' + gridY, '', 'menubar=no, locationbar=no, toolbar=no, width=600px, height=250px' @@ -342,7 +331,6 @@ } function modifyNode(cid, pcid) { - //alert("Modify CID "+cid + " PCID " + pcid); window.childWin = window.open('modifyCell.html?cid=' + cid + '&pcid=' + pcid, '', 'menubar=no, locationbar=no, toolbar=no, width=600px, height=250px' @@ -352,7 +340,6 @@ } function deleteNode(cid, pcid) { - //alert("Delete CID "+cid + " PCID " + pcid); window.childWin = window.open('deleteCell.html?cid=' + cid + '&pcid=' + pcid, '', 'menubar=no, locationbar=no, toolbar=no, width=600px, height=250px' @@ -425,8 +412,8 @@ </head> <body onLoad="init();" style="margin: 0px"> - <div class="hide" id="rmenu"></div> - <canvas id="myCanvas" /> + <div class="hide" id="rmenu"></div> + <canvas id="myCanvas" /> </body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/modifyCell.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/modifyCell.html index 4862475..c64de04 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/modifyCell.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/modifyCell.html @@ -20,76 +20,73 @@ --> <html> - <head> - <title>Modify Cell Configuration</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body><center> - <h2>Modify Cell Configuration</h2> - <div data-ng-init="onloadFun()" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate> - <table border = "0" align=center> - <tr> - <td>Node Id:</td> - <td><input name = "nodeId" type = "string" ng-model = "nodeId" required disabled> - <br><span style = "color:red" ng-show = "configForm.nodeId.$dirty && configForm.nodeId.$invalid"> - <span ng-show = "configForm.nodeId.$error.required">Node Id is mandatory.</span> - </span> - </td> - </tr> - <tr> - <td>Physical Cell Id:</td> - <td><input name = "oldPhysicalCellId" type = "number" ng-model = "oldPhysicalCellId" required disabled> - <br> - </td> - </tr> - <!-- tr> - <td>New Physical Cell Id:</td> - <td><input name = "newPhysicalCellId" type = "number" ng-model = "newPhysicalCellId" required> - <br><span style = "color:red" ng-show = "configForm.newPhysicalCellId.$dirty && configForm.newPhysicalCellId.$invalid"> - <span ng-show = "configForm.newPhysicalCellId.$error.required">New Physical Cell Id is mandatory.</span> - </span> - </td> - </tr --> - <tr> - <td>Existing Neighbors:</td> - <td><textarea name = "existingNbrs" rows="8" cols="31" type = "string" ng-model = "existingNbrs" disabled></textarea> - <br> - </td> - </tr> - <tr> - <td>New Neighbors:</td> - <td><textarea name = "newNbrs" rows="8" cols="31" type = "string" ng-model = "newNbrs"></textarea> - <br> - </td> - </tr> - <tr> - <td colspan=2 align=right> - <button ng-disabled = "configForm.newPhysicalCellId.$dirty && +<head> +<title>Modify Cell Configuration</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Modify Cell Configuration</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Node Id:</td> + <td><input name="nodeId" type="string" ng-model="nodeId" + required disabled> <br> + <span style="color: red" + ng-show="configForm.nodeId.$dirty && configForm.nodeId.$invalid"> + <span ng-show="configForm.nodeId.$error.required">Node Id + is mandatory.</span> + </span></td> + </tr> + <tr> + <td>Physical Cell Id:</td> + <td><input name="oldPhysicalCellId" type="number" + ng-model="oldPhysicalCellId" required disabled> <br> + </td> + </tr> + <tr> + <td>Existing Neighbors:</td> + <td><textarea name="existingNbrs" rows="8" cols="31" + type="string" ng-model="existingNbrs" disabled></textarea> <br> + </td> + </tr> + <tr> + <td>New Neighbors:</td> + <td><textarea name="newNbrs" rows="8" cols="31" type="string" + ng-model="newNbrs"></textarea> <br></td> + </tr> + <tr> + <td colspan=2 align=right> + <button + ng-disabled="configForm.newPhysicalCellId.$dirty && configForm.newPhysicalCellId.$invalid || configForm.nodeId.$dirty && - configForm.nodeId.$invalid" ng-click="modifyCell()">Modify</button> - <button ng-click = "close()">Cancel</button> - </td> - </tr> - </table> - </form> - </div> - <script> + configForm.nodeId.$invalid" + ng-click="modifyCell()">Modify</button> + <button ng-click="close()">Cancel</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', '$location', function($scope, $http, $location) { $scope.modifyCell = function() { @@ -132,13 +129,10 @@ var __variable = queryStringVariable.split("="); parts.queryvars[__variable[0]] = __variable[1]; }); - //alert("Parts : "+JSON.stringify(parts)); if (parts.queryvars["cid"] !== "undefined") { - //alert("CID : "+parts.queryvars["cid"]); $scope.nodeId = parts.queryvars["cid"]; } if (parts.queryvars["pcid"] !== "undefined") { - //alert("PC Id : "+parts.queryvars["pcid"]); $scope.newPhysicalCellId = parseInt(parts.queryvars["pcid"]); $scope.oldPhysicalCellId = parseInt(parts.queryvars["pcid"]); } @@ -152,6 +146,7 @@ } } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/modifyCellPci.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/modifyCellPci.html index 41b61ca..1e93a99 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/modifyCellPci.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/modifyCellPci.html @@ -20,76 +20,78 @@ --> <html> - <head> - <title>Modify Cell Configuration</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body><center> - <h2>Modify Cell Configuration</h2> - <div data-ng-init="onloadFun()" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate> - <table border = "0" align=center> - <tr> - <td>Node Id:</td> - <td><input name = "nodeId" type = "string" ng-model = "nodeId" required disabled> - <br><span style = "color:red" ng-show = "configForm.nodeId.$dirty && configForm.nodeId.$invalid"> - <span ng-show = "configForm.nodeId.$error.required">Node Id is mandatory.</span> - </span> - </td> - </tr> - <tr> - <td>Physical Cell Id:</td> - <td><input name = "oldPhysicalCellId" type = "number" ng-model = "oldPhysicalCellId" required disabled> - <br> - </td> - </tr> - <tr> - <td>New Physical Cell Id:</td> - <td><input name = "newPhysicalCellId" type = "number" ng-model = "newPhysicalCellId" required> - <br><span style = "color:red" ng-show = "configForm.newPhysicalCellId.$dirty && configForm.newPhysicalCellId.$invalid"> - <span ng-show = "configForm.newPhysicalCellId.$error.required">New Physical Cell Id is mandatory.</span> - </span> - </td> - </tr> - <tr> - <td>Existing Neighbors:</td> - <td><textarea name = "existingNbrs" rows="8" cols="31" type = "string" ng-model = "existingNbrs" disabled></textarea> - <br> - </td> - </tr> - <!-- tr> - <td>New Neighbors:</td> - <td><textarea name = "newNbrs" rows="8" cols="31" type = "string" ng-model = "newNbrs"></textarea> - <br> - </td> - </tr --> - <tr> - <td colspan=2 align=right> - <button ng-disabled = "configForm.newPhysicalCellId.$dirty && +<head> +<title>Modify Cell Configuration</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Modify Cell Configuration</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Node Id:</td> + <td><input name="nodeId" type="string" ng-model="nodeId" + required disabled> <br> + <span style="color: red" + ng-show="configForm.nodeId.$dirty && configForm.nodeId.$invalid"> + <span ng-show="configForm.nodeId.$error.required">Node Id + is mandatory.</span> + </span></td> + </tr> + <tr> + <td>Physical Cell Id:</td> + <td><input name="oldPhysicalCellId" type="number" + ng-model="oldPhysicalCellId" required disabled> <br> + </td> + </tr> + <tr> + <td>New Physical Cell Id:</td> + <td><input name="newPhysicalCellId" type="number" + ng-model="newPhysicalCellId" required> <br> + <span style="color: red" + ng-show="configForm.newPhysicalCellId.$dirty && configForm.newPhysicalCellId.$invalid"> + <span ng-show="configForm.newPhysicalCellId.$error.required">New + Physical Cell Id is mandatory.</span> + </span></td> + </tr> + <tr> + <td>Existing Neighbors:</td> + <td><textarea name="existingNbrs" rows="8" cols="31" + type="string" ng-model="existingNbrs" disabled></textarea> <br> + </td> + </tr> + <tr> + <td colspan=2 align=right> + <button + ng-disabled="configForm.newPhysicalCellId.$dirty && configForm.newPhysicalCellId.$invalid || configForm.nodeId.$dirty && - configForm.nodeId.$invalid" ng-click="modifyCell()">Modify</button> - <button ng-click = "close()">Cancel</button> - </td> - </tr> - </table> - </form> - </div> - <script> + configForm.nodeId.$invalid" + ng-click="modifyCell()">Modify</button> + <button ng-click="close()">Cancel</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', '$location', function($scope, $http, $location) { $scope.modifyCell = function() { @@ -132,13 +134,10 @@ var __variable = queryStringVariable.split("="); parts.queryvars[__variable[0]] = __variable[1]; }); - //alert("Parts : "+JSON.stringify(parts)); if (parts.queryvars["cid"] !== "undefined") { - //alert("CID : "+parts.queryvars["cid"]); $scope.nodeId = parts.queryvars["cid"]; } if (parts.queryvars["pcid"] !== "undefined") { - //alert("PC Id : "+parts.queryvars["pcid"]); $scope.newPhysicalCellId = parseInt(parts.queryvars["pcid"]); $scope.oldPhysicalCellId = parseInt(parts.queryvars["pcid"]); } @@ -152,6 +151,7 @@ } } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/newmodify.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/newmodify.html index 4862475..e2b2fac 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/newmodify.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/newmodify.html @@ -20,76 +20,73 @@ --> <html> - <head> - <title>Modify Cell Configuration</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body><center> - <h2>Modify Cell Configuration</h2> - <div data-ng-init="onloadFun()" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate> - <table border = "0" align=center> - <tr> - <td>Node Id:</td> - <td><input name = "nodeId" type = "string" ng-model = "nodeId" required disabled> - <br><span style = "color:red" ng-show = "configForm.nodeId.$dirty && configForm.nodeId.$invalid"> - <span ng-show = "configForm.nodeId.$error.required">Node Id is mandatory.</span> - </span> - </td> - </tr> - <tr> - <td>Physical Cell Id:</td> - <td><input name = "oldPhysicalCellId" type = "number" ng-model = "oldPhysicalCellId" required disabled> - <br> - </td> - </tr> - <!-- tr> - <td>New Physical Cell Id:</td> - <td><input name = "newPhysicalCellId" type = "number" ng-model = "newPhysicalCellId" required> - <br><span style = "color:red" ng-show = "configForm.newPhysicalCellId.$dirty && configForm.newPhysicalCellId.$invalid"> - <span ng-show = "configForm.newPhysicalCellId.$error.required">New Physical Cell Id is mandatory.</span> - </span> - </td> - </tr --> - <tr> - <td>Existing Neighbors:</td> - <td><textarea name = "existingNbrs" rows="8" cols="31" type = "string" ng-model = "existingNbrs" disabled></textarea> - <br> - </td> - </tr> - <tr> - <td>New Neighbors:</td> - <td><textarea name = "newNbrs" rows="8" cols="31" type = "string" ng-model = "newNbrs"></textarea> - <br> - </td> - </tr> - <tr> - <td colspan=2 align=right> - <button ng-disabled = "configForm.newPhysicalCellId.$dirty && +<head> +<title>Modify Cell Configuration</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Modify Cell Configuration</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Node Id:</td> + <td><input name="nodeId" type="string" ng-model="nodeId" + required disabled> <br> + <span style="color: red" + ng-show="configForm.nodeId.$dirty && configForm.nodeId.$invalid"> + <span ng-show="configForm.nodeId.$error.required">Node Id + is mandatory.</span> + </span></td> + </tr> + <tr> + <td>Physical Cell Id:</td> + <td><input name="oldPhysicalCellId" type="number" + ng-model="oldPhysicalCellId" required disabled> <br> + </td> + </tr> + <tr> + <td>Existing Neighbors:</td> + <td><textarea name="existingNbrs" rows="8" cols="31" + type="string" ng-model="existingNbrs" disabled></textarea> <br> + </td> + </tr> + <tr> + <td>New Neighbors:</td> + <td><textarea name="newNbrs" rows="8" cols="31" type="string" + ng-model="newNbrs"></textarea> <br></td> + </tr> + <tr> + <td colspan=2 align=right> + <button + ng-disabled="configForm.newPhysicalCellId.$dirty && configForm.newPhysicalCellId.$invalid || configForm.nodeId.$dirty && - configForm.nodeId.$invalid" ng-click="modifyCell()">Modify</button> - <button ng-click = "close()">Cancel</button> - </td> - </tr> - </table> - </form> - </div> - <script> + configForm.nodeId.$invalid" + ng-click="modifyCell()">Modify</button> + <button ng-click="close()">Cancel</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', '$location', function($scope, $http, $location) { $scope.modifyCell = function() { @@ -104,11 +101,9 @@ var res = $http.post('/ransim/api/ModifyACell', dataObj) .then(function successCallback(response){ - alert("Modified Successfully"); window.close(); }, function errorCallback(response){ - alert("Modify Failed"); window.close(); }); @@ -132,13 +127,10 @@ var __variable = queryStringVariable.split("="); parts.queryvars[__variable[0]] = __variable[1]; }); - //alert("Parts : "+JSON.stringify(parts)); if (parts.queryvars["cid"] !== "undefined") { - //alert("CID : "+parts.queryvars["cid"]); $scope.nodeId = parts.queryvars["cid"]; } if (parts.queryvars["pcid"] !== "undefined") { - //alert("PC Id : "+parts.queryvars["pcid"]); $scope.newPhysicalCellId = parseInt(parts.queryvars["pcid"]); $scope.oldPhysicalCellId = parseInt(parts.queryvars["pcid"]); } @@ -152,6 +144,7 @@ } } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/operationhistory.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/operationhistory.html index 3b6ed37..8af0f8b 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/operationhistory.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/operationhistory.html @@ -21,29 +21,40 @@ <!DOCTYPE html> <html> <head> - <title>Cell Operations History</title> - <style> - th, td, p, input { - font:14px Verdana; - } - table, th, td - { - border: solid 1px #DDD; - border-collapse: collapse; - padding: 2px 3px; - text-align: center; - } - th { - font-weight:bold; - } - .odd{background-color: white;} - .even{background-color: gray;} - </style> +<title>Cell Operations History</title> +<style> +th, td, p, input { + font: 14px Verdana; +} + +table, th, td { + border: solid 1px #DDD; + border-collapse: collapse; + padding: 2px 3px; + text-align: center; +} + +th { + font-weight: bold; +} + +.odd { + background-color: white; +} + +.even { + background-color: gray; +} +</style> </head> <body onload="getOperationLogs()"> - <center><h3>Cell Operations History</h3></center><br> - <p id="showData"></p> - <input align=right type=button name=close value="Close" onclick="window.close();"> + <center> + <h3>Cell Operations History</h3> + </center> + <br> + <p id="showData"></p> + <input align=right type=button name=close value="Close" + onclick="window.close();"> </body> <script> @@ -62,13 +73,11 @@ xmlhttp.send(); } - function drawTable(myBooks) { + function drawTable(data) { // EXTRACT VALUE FOR HTML HEADER. - // ('Book ID', 'Book Name', 'Category' and 'Price') - //alert("Draw Table"); var col = []; - for (var i = 0; i < myBooks.length; i++) { - for (var key in myBooks[i]) { + for (var i = 0; i < data.length; i++) { + for (var key in data[i]) { if (col.indexOf(key) === -1) { col.push(key); } @@ -92,7 +101,7 @@ } // ADD JSON DATA TO THE TABLE AS ROWS. - for (var i = 0; i < myBooks.length; i++) { + for (var i = 0; i < data.length; i++) { tr = table.insertRow(-1); //manipulate rows @@ -108,10 +117,10 @@ if (j == 0) continue; var tabCell = tr.insertCell(-1); if (j==1) { - var d = new Date(myBooks[i][col[j]] + 19800000); + var d = new Date(data[i][col[j]] + 19800000); tabCell.innerHTML = d; } else { - tabCell.innerHTML = myBooks[i][col[j]]; + tabCell.innerHTML = data[i][col[j]]; } } } diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/ransim.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/ransim.html index ddb3b8b..27abcbe 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/ransim.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/ransim.html @@ -23,56 +23,58 @@ <html> <head> - <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0,target-densitydpi=device-dpi, user-scalable=no" /> - <style> - .show { - z-index: 1000; - position: absolute; - padding: 2px; - display: block; - margin: 0; - list-style-type: none; - list-style: none; - } - - .hide { - display: none; - } - - .btn-group .button { - background-color: LightGrey; - color: black; - border: 1px solid Black; - text-align: center; - text-decoration: none; - display: inline-block; - font-size: 16px; - cursor: pointer; - width: 100px; - display: block; - } - - .btn-group .button:not (:last-child) { - border-bottom: none; - } - - .btn-group .button:hover { - background-color: lightblue; - color: white; - } - .button { - background-color: #4CAF50; /* Green */ - border: none; - color: white; - text-align: center; - text-decoration: none; - display: inline-block; - font-size: 16px; - margin: 4px 2px; - cursor: pointer; - } - </style> - <script> +<meta name="viewport" + content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0,target-densitydpi=device-dpi, user-scalable=no" /> +<style> +.show { + z-index: 1000; + position: absolute; + padding: 2px; + display: block; + margin: 0; + list-style-type: none; + list-style: none; +} + +.hide { + display: none; +} + +.btn-group .button { + background-color: LightGrey; + color: black; + border: 1px solid Black; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + cursor: pointer; + width: 100px; + display: block; +} + +.btn-group .button:not (:last-child ) { + border-bottom: none; +} + +.btn-group .button:hover { + background-color: lightblue; + color: white; +} + +.button { + background-color: #4CAF50; /* Green */ + border: none; + color: white; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + margin: 4px 2px; + cursor: pointer; +} +</style> +<script> var childWindow; var ScreenConfig; @@ -138,11 +140,7 @@ var physicalCellId = topoObj.cellTopology[i].physicalCellId; var serverId = topoObj.cellTopology[i].serverId; var confColor = noProblemColor; - /*if (typeof topoObj.cellTopology[i].color != 'undefined') { - confColor = topoObj.cellTopology[i].color; - console.log("topoObj.cellTopology[i].color:"); - console.log(topoObj.cellTopology[i].color); - }*/ + confColor = topoObj.cellTopology[i].color; console.log("topoObj.cellTopology[i].color:"); console.log(topoObj.cellTopology[i].color); @@ -249,7 +247,6 @@ 'menubar=no, locationbar=no, toolbar=no, width=500px, height=300px' ); - //alert("Cell Id:" + nodeVal + "\nPhysical Cell Id:" + cellVal + "\nPnf Name:" + pnfName); }); document.getElementById("showNeighbours").addEventListener("click", function() { @@ -301,35 +298,6 @@ ScreenConfig, topoObj) { document.getElementById("modified").innerHTML = 'b'; - /* for (i in topoObj.cellTopology) { - var n = topoObj.cellTopology[i].nodeId; - var p = topoObj.cellTopology[i].physicalCellId; - if (typeof topoObj.cellTopology[i].color != 'undefined') { - confColor = topoObj.cellTopology[i].color; - } - var x = (topoObj.cellTopology[i].screenX - topoObj.minScreenX ) * ScreenConfig.xScaleUnit + 20; - var y = (topoObj.cellTopology[i].screenY - topoObj.minScreenY ) * ScreenConfig.yScaleUnit + 20; - - if (topoObj.cellTopology[i].sectorNumber == 1) { - x -= RADIUS; - } else if (topoObj.cellTopology[i].sectorNumber == 2) { - x += RADIUS; - } else if (topoObj.cellTopology[i].sectorNumber == 3) { - y += 1.8 * RADIUS; - } - - ScreenConfig.context.fillStyle = "#BFBFBF"; - ScreenConfig.context.beginPath(); - ScreenConfig.context.arc(x, y, RADIUS, 0, Math.PI * 2, true); - ScreenConfig.context.strokeStyle = "black"; - ScreenConfig.context.stroke(); - ScreenConfig.context.closePath(); - ScreenConfig.context.fill(); - ScreenConfig.context.font = "bold 11px Comic Sans MS"; - ScreenConfig.context.fillStyle = "black"; - ScreenConfig.context.textAlign = "center"; - fillMultiLineText(ScreenConfig.context, p, x, y); - } */ for (i in neighbour.cellsWithHo) { var neighbourNodeId = neighbour.cellsWithHo[i].nodeId; @@ -392,9 +360,6 @@ ScreenConfig.context.lineTo(nbrCellX-headlen*Math.cos(angle+Math.PI/6),nbrCellY-headlen*Math.sin(angle+Math.PI/6)); ScreenConfig.context.stroke(); ScreenConfig.context.closePath(); - - - ScreenConfig.context.fillStyle = confuColor; ScreenConfig.context.beginPath(); ScreenConfig.context.arc(nbrCellX, nbrCellY, RADIUS, 0, Math.PI * 2, true); @@ -495,7 +460,6 @@ "nodeId": cid } var dataObj = JSON.stringify(formVal); - //var dataObj = JSON.stringify(formVal); var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { @@ -529,7 +493,6 @@ "nodeId": cid } var dataObj = JSON.stringify(formVal); - //var dataObj = JSON.stringify(formVal); var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { @@ -541,12 +504,7 @@ else neighbourNodeIds += ',' + neighbour.cellsWithHo[i].nodeId; } - /*for (i in neighbour.cellsWithNoHo) { - if (neighbourNodeIds.length == 0) - neighbourNodeIds += neighbour.cellsWithNoHo[i].nodeId; - else - neighbourNodeIds += ',' + neighbour.cellsWithNoHo[i].nodeId; - }*/ + var neighbrList = escape(neighbourNodeIds); childWindow = window.open('modifyCellPci.html?cid=' + cid + '&pcid=' + pcid + '&neighbrList=' + neighbrList, '', @@ -585,8 +543,6 @@ } function isIntersect(point, currCell, cellX, cellY, ScreenConfig) { - //var cellX = currCell.screenX * ScreenConfig.xScaleUnit; - //var cellY = currCell.screenY * ScreenConfig.yScaleUnit; if (currCell.sectorNumber == 1) { cellX -= ScreenConfig.RADIUS; @@ -616,7 +572,6 @@ } function searchCell(){ - //alert("enter netconf server id"); var serverId = document.getElementById("myText").value;; netconfServerUserInput = serverId; console.log("netconfServerUserInput"); @@ -677,15 +632,16 @@ </head> <body onLoad="init();" style="margin: 0px"> - <div class="hide" id="rmenu"></div> - <div class="hide" id="modified"></div> - <div id="ransim" class="absolute"> - PNF/Cell name: <input type="text" id="myText" size="9" value="ncserver00"> + <div class="hide" id="rmenu"></div> + <div class="hide" id="modified"></div> + <div id="ransim" class="absolute"> + PNF/Cell name: <input type="text" id="myText" size="9" + value="ncserver00"> <button onclick="searchCell()">Search</button> <br> - + </div> - <canvas id="myCanvas" width="500000" height="500000"></canvas> + <canvas id="myCanvas" width="500000" height="500000"></canvas> </body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/ransimgrid.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/ransimgrid.html index bf097fd..f2ca56c 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/ransimgrid.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/ransimgrid.html @@ -51,22 +51,34 @@ } .btn-group + + .button + + :not + + ( :last-child + + ) { border-bottom + + : + + none -; +; } .btn-group .button:hover { background-color: lightblue; @@ -91,59 +103,10 @@ function getCellTopology() { }; xmlhttp.open("GET", "http://ransimsvr:8081/ransim/api/GetTopology", true); xmlhttp.send(); - /* - var topologyJson = { - "gridSize": 10, - "cellTopology": [ - {"nodeId":55, "physicalCellId":"70", "gridX":1, "gridY":1, "confusion":true, "color":"#FF0000" }, - {"nodeId":58, "physicalCellId":"72", "gridX":1, "gridY":4 }, - {"nodeId":57, "physicalCellId":"73", "gridX":1, "gridY":3 }, - {"nodeId":56, "physicalCellId":"71", "gridX":1, "gridY":2 }, - {"nodeId":65, "physicalCellId":"70", "gridX":3, "gridY":2, "confusion":true, "color":"#FF0000" } - ]} - drawTopology(topologyJson); - */ - /* var topologyJson = {"gridSize":10, - "cellTopology":[ - {"nodeId":51,"physicalCellId":20,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":5,"gridY":1,"serverId":"ncserver1003"}, - {"nodeId":52,"physicalCellId":4,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":5,"gridY":2,"serverId":"ncserver1003"}, - {"nodeId":61,"physicalCellId":10,"pciCollisionDetected":true,"pciConfusionDetected":false,"gridX":6,"gridY":1,"serverId":"ncserver1004"}, - {"nodeId":62,"physicalCellId":5,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":6,"gridY":2,"serverId":"ncserver1004"}, - {"nodeId":63,"physicalCellId":6,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":6,"gridY":3,"serverId":"ncserver1004"}, - {"nodeId":68,"physicalCellId":9,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":6,"gridY":8,"serverId":"ncserver1004"}, - {"nodeId":71,"physicalCellId":2,"pciCollisionDetected":true,"pciConfusionDetected":false,"gridX":7,"gridY":1,"serverId":"ncserver1005"}, - {"nodeId":72,"physicalCellId":8,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":7,"gridY":2,"serverId":"ncserver1005"}, - {"nodeId":73,"physicalCellId":1,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":7,"gridY":3,"serverId":"ncserver1005"}, - {"nodeId":76,"physicalCellId":2,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":7,"gridY":6,"serverId":"ncserver1005"}, - {"nodeId":77,"physicalCellId":5,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":7,"gridY":7,"serverId":"ncserver1005"}, - {"nodeId":78,"physicalCellId":3,"pciCollisionDetected":false,"pciConfusionDetected":true,"gridX":7,"gridY":8,"serverId":"ncserver1005"}, - {"nodeId":79,"physicalCellId":4,"pciCollisionDetected":true,"pciConfusionDetected":false,"gridX":7,"gridY":9,"serverId":"ncserver1005"}, - {"nodeId":80,"physicalCellId":15,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":7,"gridY":10,"serverId":"ncserver1005"}, - {"nodeId":81,"physicalCellId":13,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":8,"gridY":1,"serverId":"ncserver1005"}, - {"nodeId":82,"physicalCellId":14,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":8,"gridY":2,"serverId":"ncserver1005"}, - {"nodeId":83,"physicalCellId":3,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":8,"gridY":3,"serverId":"ncserver1005"}, - {"nodeId":86,"physicalCellId":6,"pciCollisionDetected":true,"pciConfusionDetected":true,"gridX":8,"gridY":6,"serverId":"ncserver1006"}, - {"nodeId":87,"physicalCellId":4,"pciCollisionDetected":false,"pciConfusionDetected":true,"gridX":8,"gridY":7,"serverId":"ncserver1006"}, - {"nodeId":88,"physicalCellId":0,"pciCollisionDetected":false,"pciConfusionDetected":true,"gridX":8,"gridY":8,"serverId":"ncserver1006"}, - {"nodeId":89,"physicalCellId":1,"pciCollisionDetected":false,"pciConfusionDetected":true,"gridX":8,"gridY":9,"serverId":"ncserver1006"}, - {"nodeId":90,"physicalCellId":7,"pciCollisionDetected":false,"pciConfusionDetected":true,"gridX":8,"gridY":10,"serverId":"ncserver1006"}, - {"nodeId":91,"physicalCellId":11,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":9,"gridY":1,"serverId":"ncserver1006"}, - {"nodeId":96,"physicalCellId":5,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":9,"gridY":6,"serverId":"ncserver1006"}, - {"nodeId":97,"physicalCellId":1,"pciCollisionDetected":true,"pciConfusionDetected":false,"gridX":9,"gridY":7,"serverId":"ncserver1006"}, - {"nodeId":98,"physicalCellId":2,"pciCollisionDetected":false,"pciConfusionDetected":true,"gridX":9,"gridY":8,"serverId":"ncserver1006"}, - {"nodeId":99,"physicalCellId":3,"pciCollisionDetected":false,"pciConfusionDetected":true,"gridX":9,"gridY":9,"serverId":"ncserver1006"}, - {"nodeId":100,"physicalCellId":4,"pciCollisionDetected":false,"pciConfusionDetected":true,"gridX":9,"gridY":10,"serverId":"ncserver1007"}, - {"nodeId":107,"physicalCellId":8,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":10,"gridY":7,"serverId":"ncserver1007"}, - {"nodeId":108,"physicalCellId":9,"pciCollisionDetected":true,"pciConfusionDetected":true,"gridX":10,"gridY":8,"serverId":"ncserver1007"}, - {"nodeId":109,"physicalCellId":1,"pciCollisionDetected":false,"pciConfusionDetected":false,"gridX":10,"gridY":9,"serverId":"ncserver1007"} - ]} - drawTopology(topologyJson); */ - } function drawTopology(topoObj){ - //alert("topoObj"); var width = window.innerHeight; var height = window.innerHeight;//100; var myCanvas = document.getElementById("myCanvas"); @@ -155,41 +118,18 @@ function drawTopology(topoObj){ context.fillStyle = "#FFFFFF"; context.fillRect(0,0,width,height); - //var gridSize = 15; var gridSize = topoObj.gridSize; var rad=height/(2 * gridSize);//10; var gaps= rad*2; - // alert(rad); var widthCount = parseInt(width/gaps); var heightCount = parseInt(height/gaps); - //var aColors=["#43A9D1","#EFA63B","#EF7625","#5E4130","#EEE","#DDD"]; var aColors="#32CD32"; var aColorsLength = 1; var arr = new Array(); var a=1.5*rad; var b=0.86*rad; - - - /* for(var x=0; x<gridSize;x++) { - arr[x]=new Array(); - for(var y=0; y<gridSize;y++) { - context.fillStyle = "#D3D3D3"; - context.beginPath(); - - context.arc(rad+gaps*x,rad+ gaps*y, rad, 0, Math.PI*2, true); - context.closePath(); - context.fill(); - arr[x][y] = (x+1) + ":" + (y+1); - - context.font = "12px Comic Sans MS"; - context.fillStyle = "white"; - context.textAlign = "center"; - fillMultiLineText(context,"X:"+y+"\nY:"+x, rad+gaps*x,rad+ gaps*y); - - } - } */ - + myCanvas.addEventListener('contextmenu', (e) => { const pos = { x: e.clientX, @@ -237,20 +177,7 @@ function drawTopology(topoObj){ if (typeof topoObj.cellTopology[i].color != 'undefined') { confuColor = topoObj.cellTopology[i].color; } - //alert(nodeId+" "+physicalCellId+" "+col+" "+row+" "+confusion+" "+confuColor+" "); - - /*if (collision) { - if (confusion) { - context.fillStyle = "#FF1493"; - } else { - context.fillStyle = "#FF0000"; - } - - } else if (confusion){ - context.fillStyle = "#CCCC00"; - } else { - context.fillStyle = "#32CD32"; - }*/ + if (confusion) { context.fillStyle = confuColor; } else { @@ -259,24 +186,17 @@ function drawTopology(topoObj){ context.beginPath(); context.arc(rad+gaps*col,rad+gaps*row, rad/2, 0, Math.PI*2, true); - //alert(nodeId+" Circle X " + (rad+gaps*col) + " Y: "+ (rad+gaps*row)); context.strokeStyle = "black"; context.stroke(); context.closePath(); context.fill(); - /* context.beginPath(); - context.moveTo(rad+gaps*col, rad+gaps*row); - context.lineTo(rad+gaps*col,rad+gaps*row - rad/2); - context.strokeStyle = "black"; - context.stroke(); - context.closePath(); */ + context.font = "12px Comic Sans MS"; context.fillStyle = "white"; context.textAlign = "center"; context.fillText(physicalCellId, rad+gaps*col,rad+ gaps*row ); - //fillMultiLineText(context,nodeId, rad+gaps*col,rad+ gaps*row); } myCanvas.addEventListener('contextmenu', (e) => { @@ -293,23 +213,17 @@ function drawTopology(topoObj){ --row; var col = topoObj.cellTopology[i].gridY; --col; - //alert('click on circle: ' + topoObj.cellTopology[i].nodeId); - //alert(pos.x + " "+pos.y); document.getElementById("rmenu").className = "show"; document.getElementById('rmenu').style.top = pos.y+"px"; //or whatever document.getElementById('rmenu').style.left = pos.x+"px"; // or whatever var htmlText1 = '<div class="btn-group">'; htmlText1 += '<button class="button" id="showNeighbours">showNeighbours</button>'; - //htmlText1 += '<button class="button" id="deleteNode">Delete</button>'; htmlText1 += '</div>'; document.getElementById("rmenu").innerHTML = htmlText1; document.getElementById("showNeighbours").addEventListener("click", function(){ alert(topoObj.cellTopology[i].nodeId); - //alert(col); - //alert(i); - //change(topoObj,row,col); var formVal = { "nodeId": nodeVal } @@ -327,9 +241,7 @@ function drawTopology(topoObj){ xmlhttp.setRequestHeader('Content-Type', 'application/json') xmlhttp.send(dataObj); }); - /* document.getElementById("deleteNode").addEventListener("click", function(){ - deleteNode(nodeVal, cellVal); - }); */ + } } e.preventDefault(); @@ -350,9 +262,7 @@ function drawTopology(topoObj){ context.fillStyle = "#FFFFFF"; context.fillRect(0,0,width,height); - //var gridSize = 15; var gridSize = topoObj.gridSize; - //alert(gridSize); var rad=height/(2 * gridSize);//10; var gaps= rad*2; @@ -372,11 +282,6 @@ function drawTopology(topoObj){ context.textAlign = "center"; context.fillText(cellPhysicalCellId, rad+gaps*col,rad+ gaps*row ); - - - /* var res = $http.post('http://ransimsvr:8081/ransim/api/GetNeighborList', dataObj) - var neighbour = JSON.parse(res); */ - for (i in neighbour.neighborList) { var neighbourNodeId = neighbour.neighborList[i].nodeId; @@ -394,12 +299,7 @@ function drawTopology(topoObj){ confusion = neighbour.neighborList[i].pciConfusionDetected; } - /* var confuColor = aColors; - if (typeof neighbour.neighborList[i].color != 'undefined') { - confuColor = neighbour.neighborList[i].color; - } */ - //alert(nodeId+" "+physicalCellId+" "+col+" "+row+" "+confusion+" "+confuColor+" "); - + if (collision) { if (confusion) { context.fillStyle = "#FF1493"; @@ -415,7 +315,6 @@ function drawTopology(topoObj){ context.beginPath(); context.arc(rad+gaps*col,rad+gaps*row, rad/2, 0, Math.PI*2, true); - //alert(nodeId+" Circle X " + (rad+gaps*col) + " Y: "+ (rad+gaps*row)); context.strokeStyle = "black"; context.stroke(); context.closePath(); @@ -433,7 +332,6 @@ function drawTopology(topoObj){ context.fillStyle = "white"; context.textAlign = "center"; context.fillText(neighbourPhysicalCellId, rad+gaps*col,rad+ gaps*row ); - //fillMultiLineText(context,nodeId, rad+gaps*col,rad+ gaps*row); } @@ -454,24 +352,12 @@ function drawTopology(topoObj){ context.fillStyle = "#FFFFFF"; context.fillRect(0,0,width,height); - //var gridSize = 15; var gridSize = topoObj.gridSize; - //alert(gridSize); var rad=height/(2 * gridSize);//10; var gaps= rad*2; - // alert(rad); - - //var row = topoObj.cellTopology[i].gridX; - //--row; - //alert(topoObj.cellTopology[i].nodeId); - //var col = topoObj.cellTopology[i].gridY; - //--col; - //alert(col); - //alert(i); - //context.arc(rad+gaps*col,rad+ gaps*row, rad/2, 0, Math.PI*2, true); - //alert(rad+ gaps*row); + context.fillStyle = "#D3D3D3"; context.beginPath(); @@ -535,11 +421,7 @@ function drawTopology(topoObj){ document.getElementById("rmenu").className = "hide"; }); - /* - $(document).bind("click", function(event) { - document.getElementById("rmenu").className = "hide"; - }); - */ + function isIntersectDefault(point, row, col, rad, gaps) { var x = (rad+gaps*col); diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/startPm.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/startPm.html index 1426e54..c5a82d7 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/startPm.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/startPm.html @@ -20,59 +20,62 @@ --> <html> - <head> - <title>PM</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body> - <center> - <h2>Enter the cells with Hand-off Failures</h2> - <div data-ng-init="onloadFun()" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate> - <table border = "0" align=center> - <tr> - <td>Node Id(bad value):</td> - <td><input name = "nodeIdBad" type = "string" ng-model = "nodeIdBad"> - <br> - </td> - </tr> - <tr> - <td colspan=2> Bad Value: A Cell for which 20% of its neighbors will have very high percentage of Hand-Off failure. The Cell-Neighbor pair should be blackisted.</td> - </tr> - <tr> - <td>Node Id(poor value):</td> - <td><input name = "nodeIdPoor" type = "string" ng-model = "nodeIdPoor"> - <br> - </td> - </tr> - <tr> - <td colspan=2> Poor Value: A Cell for which 20% of its neighbors will have a considerable percentage of Hand-Off failure.</td> - </tr> - <tr> - <td colspan=2 align=center> - <button ng-click="startPm()">Start</button> - <button ng-click = "close()">Close</button> - </td> - </tr> - </table> - </form> - </div> - <script> +<head> +<title>PM</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Enter the cells with Hand-off Failures</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Node Id(bad value):</td> + <td><input name="nodeIdBad" type="string" + ng-model="nodeIdBad"> <br></td> + </tr> + <tr> + <td colspan=2>Bad Value: A Cell for which 20% of its + neighbors will have very high percentage of Hand-Off failure. The + Cell-Neighbor pair should be blackisted.</td> + </tr> + <tr> + <td>Node Id(poor value):</td> + <td><input name="nodeIdPoor" type="string" + ng-model="nodeIdPoor"> <br></td> + </tr> + <tr> + <td colspan=2>Poor Value: A Cell for which 20% of its + neighbors will have a considerable percentage of Hand-Off + failure.</td> + </tr> + <tr> + <td colspan=2 align=center> + <button ng-click="startPm()">Start</button> + <button ng-click="close()">Close</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', function($scope, $http) { $scope.startPm = function(){ @@ -88,11 +91,9 @@ var res = $http.post('/ransim/api/GeneratePmData', dataObj) .then(function successCallback(response){ - //alert("Request sent Successfully"); window.close(); }, function errorCallback(response){ - //alert("Request Failed"); window.close(); }); @@ -101,6 +102,7 @@ window.close(); } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/startsPm.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/startsPm.html index e44243b..59d78bd 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/startsPm.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/startsPm.html @@ -20,59 +20,60 @@ --> <html> - <head> - <title>PM</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body> - <center> - <h2>Enter the cells with Hand-off Failures</h2> - <div data-ng-init="onloadFun()" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate> - <table border = "0" align=center> - <tr> - <td>Node Id(bad value):</td> - <td><input name = "nodeIdBad" type = "string" ng-model = "nodeIdBad"> - <br> - </td> - </tr> - <tr> - <td colspan=2> Bad Value: Enter the ids of the cell(s) for which the HO to a few neighbors will have less than 25% success.</td> - </tr> - <tr> - <td>Node Id(poor value):</td> - <td><input name = "nodeIdPoor" type = "string" ng-model = "nodeIdPoor"> - <br> - </td> - </tr> - <tr> - <td colspan=2> Poor Value: Enter the ids of the cell(s) for which the HO to a few neighbors will have 25%-50% success.</td> - </tr> - <tr> - <td colspan=2 align=center> - <button ng-click="startPm()">Start</button> - <button ng-click = "close()">Close</button> - </td> - </tr> - </table> - </form> - </div> - <script> +<head> +<title>PM</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Enter the cells with Hand-off Failures</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Node Id(bad value):</td> + <td><input name="nodeIdBad" type="string" + ng-model="nodeIdBad"> <br></td> + </tr> + <tr> + <td colspan=2>Bad Value: Enter the ids of the cell(s) for + which the HO to a few neighbors will have less than 25% success.</td> + </tr> + <tr> + <td>Node Id(poor value):</td> + <td><input name="nodeIdPoor" type="string" + ng-model="nodeIdPoor"> <br></td> + </tr> + <tr> + <td colspan=2>Poor Value: Enter the ids of the cell(s) for + which the HO to a few neighbors will have 25%-50% success.</td> + </tr> + <tr> + <td colspan=2 align=center> + <button ng-click="startPm()">Start</button> + <button ng-click="close()">Close</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', function($scope, $http) { $scope.startPm = function(){ @@ -101,6 +102,7 @@ window.close(); } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/stopPm.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/stopPm.html index c43e890..d511864 100644 --- a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/stopPm.html +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/stopPm.html @@ -20,46 +20,45 @@ --> <html> - <head> - <title>Performance Management</title> - <script src="angular.min.js"></script> - <style> - table, th , td { - border: 1px solid grey; - border-collapse: collapse; - padding: 5px; - } - - table tr:nth-child(odd) { - background-color: #f2f2f2; - } - - table tr:nth-child(even) { - background-color: #ffffff; - } - </style> - </head> - <body> - <center> - <h2>Performance Management(PM)</h2> - <div data-ng-init="onloadFun()" ng-app = "mainApp" ng-controller = "configController"> - <form name = "configForm" novalidate> - <table border = "0" align=center> - <tr> - <td> - Stop generating PM data - </td> - </tr> - <tr> - <td align=right> - <button ng-click="stopPm()">Yes</button> - <button ng-click = "close()">No</button> - </td> - </tr> - </table> - </form> - </div> - <script> +<head> +<title>Performance Management</title> +<script src="angular.min.js"></script> +<style> +table, th, td { + border: 1px solid grey; + border-collapse: collapse; + padding: 5px; +} + +table tr:nth-child(odd) { + background-color: #f2f2f2; +} + +table tr:nth-child(even) { + background-color: #ffffff; +} +</style> +</head> +<body> + <center> + <h2>Performance Management(PM)</h2> + <div data-ng-init="onloadFun()" ng-app="mainApp" + ng-controller="configController"> + <form name="configForm" novalidate> + <table border="0" align=center> + <tr> + <td>Stop generating PM data</td> + </tr> + <tr> + <td align=right> + <button ng-click="stopPm()">Yes</button> + <button ng-click="close()">No</button> + </td> + </tr> + </table> + </form> + </div> + <script> var mainApp = angular.module("mainApp", []); mainApp.controller('configController',['$scope', '$http', function($scope, $http) { $scope.stopPm = function(){ @@ -89,6 +88,7 @@ window.close(); } }]); - </script> - <center></body> + </script> + <center> +</body> </html> diff --git a/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/uploadFile.html b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/uploadFile.html new file mode 100644 index 0000000..fd55dee --- /dev/null +++ b/ransim/ransimctrlr/RANSIM-GUI/src/main/webapp/uploadFile.html @@ -0,0 +1,13 @@ +<!DOCTYPE html> +<html xmlns:th="http://www.thymeleaf.org"> +<body> + +<h1>Spring Boot file upload example</h1> + +<form method="POST" action="/ransim/file/upload" enctype="multipart/form-data"> + <input type="file" name="file" /><br/><br/> + <input type="submit" value="Submit" /> +</form> + +</body> +</html>
\ No newline at end of file |