Files
oopt-gnpy-web-gui/docs/main.js.html

581 lines
24 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JSDoc: Source: main.js</title>
<script src="scripts/prettify/prettify.js"> </script>
<script src="scripts/prettify/lang-css.js"> </script>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
<link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>
<body>
<div id="main">
<h1 class="page-title">Source: main.js</h1>
<section>
<article>
<pre class="prettyprint source linenums"><code>/**
* @file GNPy is a open source optical network planning tool which can be used to simulate multi-vendor open optical networks. Click below to explore the tool.
* @see &lt;a href="https://tiptool.vee-services.com/">GNPy Optical network planning tool&lt;/a>
*/
/**
* main.js
* The main.js library describes UI actions. like show/hide and update the HTML element with style based on user interaction.
* @module main
*/
let attenuator = document.querySelector('#attenuator');
let roadm = document.querySelector('#roadm');
let ILA = document.querySelector('#ILA');
let amplifier = document.querySelector('#amplifier');
let dualfiber = document.querySelector('#dualfiber');
let service = document.querySelector('#service');
let transceiver = document.querySelector('#transceiver');
let singlefiber = document.querySelector('#singlefiber');
let singlepatch = document.querySelector('#singlepatch');
let dualpatch = document.querySelector('#dualpatch');
let ramanamp = document.querySelector('#ramanamp');
let drawerclose = document.getElementById('drawer-close')
/**
* Open drawer based on node/fiber/patch/service.
* @param {string} node - The type of component.
*/
function openDrawer(node) {
switch (node) {
case 'attenuator':
roadm.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
attenuator.classList.add('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
dualpatch.classList.remove('d-visible');
ramanamp.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
break;
case 'roadm':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
dualpatch.classList.remove('d-visible');
roadm.classList.add('d-visible');
ramanamp.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
break;
case 'ILA':
attenuator.classList.remove('d-visible');
ILA.classList.add('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
dualpatch.classList.remove('d-visible');
ramanamp.classList.remove('d-visible');
break;
case 'amplifier':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.add('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
dualpatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
ramanamp.classList.remove('d-visible');
break;
case 'dualfiber':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.add('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
dualpatch.classList.remove('d-visible');
ramanamp.classList.remove('d-visible');
break;
case 'create':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
dualpatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
ramanamp.classList.remove('d-visible');
break;
case 'transceiver':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.add('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
dualpatch.classList.remove('d-visible');
ramanamp.classList.remove('d-visible');
break;
case 'singlefiber':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.add('d-visible');
singlepatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
dualpatch.classList.remove('d-visible');
ramanamp.classList.remove('d-visible');
break;
case 'dualpatch':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
dualpatch.classList.add('d-visible');
// drawerclose.classList.add("drawerleft")
ramanamp.classList.remove('d-visible');
break;
case 'singlepatch':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.add('d-visible');
dualpatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
ramanamp.classList.remove('d-visible');
break;
case 'service':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.add('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
dualpatch.classList.remove('d-visible');
ramanamp.classList.remove('d-visible');
break;
case 'ramanamp':
attenuator.classList.remove('d-visible');
ILA.classList.remove('d-visible');
amplifier.classList.remove('d-visible');
dualfiber.classList.remove('d-visible');
service.classList.remove('d-visible');
roadm.classList.remove('d-visible');
transceiver.classList.remove('d-visible');
singlefiber.classList.remove('d-visible');
singlepatch.classList.remove('d-visible');
// drawerclose.classList.add("drawerleft")
dualpatch.classList.remove('d-visible');
ramanamp.classList.add('d-visible');
break;
}
}
/**
* Close drawer based on node/fiber/patch/service.
* @param {string} node - The type of component.
*/
function closeDrawer(node) {
switch (node) {
case 'attenuator':
attenuator.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'roadm':
roadm.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'ILA':
ILA.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'amplifier':
amplifier.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'create':
create.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'singlefiber':
singlefiber.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'transceiver':
transceiver.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'singlepatch':
singlepatch.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'dualpatch':
dualpatch.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'dualfiber':
dualfiber.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
break;
case 'service':
service.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
case 'ramanamp':
ramanamp.classList.remove('d-visible');
// drawerclose.classList.remove("drawerleft")
}
}
var tabcontent = document.querySelector(".stp-tab");
var arrowbtn1 = document.querySelector("#toggle-arrow-1");
var arrowbtn2 = document.querySelector("#toggle-arrow-2");
var arrowbtn3 = document.querySelector("#toggle-arrow-3");
var arrowbtn4 = document.querySelector("#toggle-arrow-4");
var sidebartext = document.querySelectorAll(".sidebar-text");
var sidebartext1 = document.querySelectorAll(".sidebar-text1");
var sidebartext2 = document.querySelectorAll(".sidebar-text2");
var sidebartext3 = document.querySelectorAll(".sidebar-text3");
arrowbtn2.addEventListener("click", function () {
tabcontent.classList.toggle('left-59')
for (var i = 0; i &lt; sidebartext1.length; i++) {
sidebartext1[i].classList.toggle("d-none")
}
})
arrowbtn3.addEventListener("click", function () {
tabcontent.classList.toggle('left-59')
for (var i = 0; i &lt; sidebartext2.length; i++) {
sidebartext2[i].classList.toggle("d-none")
}
})
arrowbtn4.addEventListener("click", function () {
tabcontent.classList.toggle('left-59')
for (var i = 0; i &lt; sidebartext3.length; i++) {
sidebartext3[i].classList.toggle("d-none")
}
})
/**
* Highlight the steper menu by selection.
* @param {number} index - The menu index.
*/
function stepColor(index) {
showMenu = 0;
modeHighLight();
switch (index) {
case 1:
break;
case 2:
currentStepper = "stepCreateTopology";
showMenu = 1;
//let prev = document.querySelector("#step2").previousElementSibling;
//if (prev.id === "step1") {
// let step1 = document.getElementById("step1").childNodes;
// step1[1].classList.add("tab-nav-completed");
// step1[1].classList.add("text-tab-completed")
//}
break;
case 3:
currentStepper = "stepAddService";
showMenu = 2;
//let prev1 = document.querySelector("#step3").previousElementSibling;
//if (prev1.id === "step2") {
// let step1 = document.getElementById("step2").childNodes;
// step1[1].classList.add("tab-nav-completed");
// step1[1].classList.add("text-tab-completed")
//}
break;
case 4:
currentStepper = "stepSaveNetwork";
//let prev2 = document.querySelector("#step4").previousElementSibling;
//if (prev2.id === "step3") {
// let step1 = document.getElementById("step3").childNodes;
// step1[1].classList.add("tab-nav-completed");
// step1[1].classList.add("text-tab-completed")
//}
break;
}
}
var btnAddRoadm = "#btnAddRoadm";
var btnAddFused = "#btnAddFused";
var btnAddILA = "#btnAddILA";
var btnAddAmplifier = "#btnAddAmplifier";
var btnAddTransceiver = "#btnAddTransceiver";
var btnAddDualFiber = "#btnAddDualFiber";
var btnAddSingleFiber = "#btnAddSingleFiber";
var btnServiceActive = "#btnServiceActive";
var btnAddSinglePatch = "#btnAddSinglePatch";
var btnAddDualPatch = "#btnAddDualPatch";
var btnAddRamAmp = "#btnAddRamAmp";
/**
* Highlight node/fiber/patch/service menu by name.
* @param {string} node - The type on component.
*/
function modeHighLight(node) {
disableFiberService();
showHideDrawerandMenu();
switch (node) {
case 'Roadm':
$(btnAddRoadm).addClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'ILA':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).addClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'amplifier':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).addClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'fused':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).addClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'transceiver':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).addClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'dualfiber':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).addClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'singlefiber':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).addClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'singlepatch':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).addClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'dualpatch':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).addClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
break;
case 'ramanamp':
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).addClass('highlight');
break;
case 'service':
$(btnServiceActive).addClass('highlight');
break;
default:
$(btnAddRoadm).removeClass('highlight');
$(btnAddFused).removeClass('highlight');
$(btnAddILA).removeClass('highlight');
$(btnAddAmplifier).removeClass('highlight');
$(btnAddTransceiver).removeClass('highlight');
$(btnAddDualFiber).removeClass('highlight');
$(btnAddSingleFiber).removeClass('highlight');
$(btnServiceActive).removeClass('highlight');
$(btnAddSinglePatch).removeClass('highlight');
$(btnAddDualPatch).removeClass('highlight');
$(btnAddRamAmp).removeClass('highlight');
try {
network.disableEditMode();
}
catch {}
}
}
/** Show/Hide the context menu of node/fiber/patch/service. */
function showHideDrawerandMenu() {
document.getElementById("roadmMenu").style.display = "none";
document.getElementById("attenuatorMenu").style.display = "none";
document.getElementById("ILAMenu").style.display = "none";
document.getElementById("amplifierMenu").style.display = "none";
document.getElementById("transceiverMenu").style.display = "none";
document.getElementById("serviceMenu").style.display = "none";
document.getElementById("singleFiberMenu").style.display = "none";
document.getElementById("dualFiberMenu").style.display = "none";
document.getElementById("singlePatchMenu").style.display = "none";
document.getElementById("dualPatchMenu").style.display = "none";
document.getElementById("ramanAmpMenu").style.display = "none";
document.getElementById("templateMenu").style.display = "none";
closeDrawer('roadm');
closeDrawer('attenuator');
closeDrawer('ILA');
closeDrawer('amplifier');
closeDrawer('transceiver');
closeDrawer('service');
closeDrawer('dualfiber');
closeDrawer('singlefiber');
closeDrawer('singlepatch');
closeDrawer('dualpatch');
closeDrawer('ramanamp');
}
</code></pre>
</article>
</section>
</div>
<nav>
<h2><a href="index.html">oopt-gnpy-web-gui-main</a></h2><h3>Modules</h3><ul><li><a href="module-alea.html">alea</a></li><li><a href="module-constraints.html">constraints</a></li><li><a href="module-exampleUtil.html">exampleUtil</a></li><li><a href="module-fiber.html">fiber</a></li><li><a href="module-filesaver.html">filesaver</a></li><li><a href="module-main.html">main</a></li><li><a href="module-mynetwork.html">mynetwork</a></li><li><a href="module-node.html">node</a></li><li><a href="module-patch.html">patch</a></li><li><a href="module-service.html">service</a></li><li><a href="module-validation.html">validation</a></li></ul><h3>Tutorials</h3><ul><li><a href="tutorial-LICENSE.html">LICENSE</a></li><li><a href="tutorial-technical_document.html">technical_document</a></li></ul>
</nav>
<br class="clear">
<footer>
Documentation generated by <a href="https://github.com/jsdoc/jsdoc">JSDoc 3.6.10</a> on Wed Jul 06 2022 19:21:36 GMT+0530 (India Standard Time)
</footer>
<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>